vBulletin tarzı postbit ve postbit arkası resimlendirme.

[HelloIamSoapy]

Merhabalar,
Bugün sizlere vbulletin tarzı postbiti yukarıya almayı ve arkaplanı renklendirmeyi göstereceğim.


Genel anlamda bi talep olmasada bu tarz bir uygulama SA:MP Roleplay camiasında özellikle çok kullanılmaktadır.

Başlayalım.
(Bu bölüm tarantula901'in konusundan alıntılanmıştır)

Temanızda  yoksa default tema içerisinde bulunan Display.template.php ara

Kod Seç Genişlet

        // Show avatars, images, etc.?
         if (!empty($settings['show_user_images']) && empty($options['show_no_avatars']) && !empty($message['member']['avatar']['image']))
            echo '
                        <li class="avatar" style="overflow: auto;">
                           <a href="', $scripturl, '?action=profile;u=', $message['member']['id'], '">
                              ', $message['member']['avatar']['image'], '
                           </a>
                        </li>';
Değiştir.

Kod Seç Genişlet

        echo '          </ul>
                  </div></div>
                  <div class="right_colum"> <!--Inicio tercera columna-->
                  <div class="poster"><ul class="reset smalltext">';
Bul

Kod Seç Genişlet

           <div class="', $message['approved'] ? ($message['alternate'] == 0 ? 'windowbg' : 'windowbg2') : 'approvebg', '">
               <span class="topslice"><span></span></span>
               <div class="post_wrapper">';

      // Show information about the poster of this message.
      echo '
                  <div class="poster">
Değiştir

Kod Seç Genişlet

   
                <div class="roundframe">
                  <div class="cont_colum_post"><!--Inicio de columnas -->';

      // Show avatars, images, etc.?
      if (!empty($settings['show_user_images']) && empty($options['show_no_avatars']) && !empty($message['member']['avatar']['image']))
         echo '      <div class="left_colum"><ul class="reset"> <!--Inicio Primera columna -->
                        <li class="avatar" style="overflow: auto;">
                           <a href="', $scripturl, '?action=profile;u=', $message['member']['id'], '">
                              ', $message['member']['avatar']['image'], '
                           </a>
                        </li></ul></div>';

      // Show information about the poster of this message.
      echo '          <div class="left_colum"> <!--Inicio segunda columna-->
                  <div class="poster">
Bul

Kod Seç Genişlet

                    </ul>
                  </div>
                  <div class="postarea">
Değiştir

Kod Seç Genişlet

                    </ul>
                  </div></div>
               </div><!--Fin de columnas --></div>
            <span class="divider_info"><span></span></span>
             
            <div class="', $message['approved'] ? ($message['alternate'] == 0 ? 'windowbg' : 'windowbg2') : 'approvebg', '">
               <span class="topslice"><span></span></span>
               <div class="post_wrapper">           
                  <div class="postarea">
Temanızda bulunan css içindeki index.css dosyasında

Bul

Kod Seç Genişlet

/* poster and postarea + moderation area underneath */
.poster
{
   float: left;
   width: 15em;
}
.postarea, .moderatorbar
{
   margin: 0 0 0 16em;
}
.postarea div.flow_hidden
{
   width: 100%;
}
Değiştir.

Kod Seç Genişlet

/* Informacion de usuario Horizontal */
#forumposts div.poster {
    width: auto; }

.cont_colum_post {
   width: 100%;
   overflow:hidden;
   padding:0px; }

.left_colum  {
   float: left;
   margin-left: 0.5em; }

.right_colum  {
   float: right;
   margin-right: 2em; }

.left_colum  li.avatar {
   margin-top: 0.5em; }
   
span.divider_info {
   margin-bottom: 2px;
   -margin-bottom: 0px;
   display: block; }
   
/* poster and postarea + moderation area underneath */
.poster
{
   float: left;
   width: 14em;
}
.postarea, .moderatorbar
{
   margin: 0 0 0 1em;
   _padding-left: 1em;
}
.postarea div.flow_hidden
{
   width: auto;
}
Bu işlemler postbitimizi yataya dönüştürmek içindi, şimdi ufak ayrıntılara ve konu bütünlüğünü toparlamaya geçelim ardından arka tarafı örnek olarak gösterdiğim resimdeki gibi renklendireceğiz veya background resmi ekliyeceğiz.


Displaytemplate.php'de bulun

Kod Seç Genişlet

<div class="roundframe">

Değiştirin

Kod Seç Genişlet

';
if (isset($message['member']['group_id']))  {
    switch ($message['member']['group_id'])       {
    case '1':
       $godbg = 'background-color: #800000;color: #fff;';//admin grubu için renk ayarları
        break;
    case '2':
       $godbg = 'background-color:blue;color:yellow;';//global mod için renk ayarları
        break;
 case '0':
       $godbg = 'background-color:orange;color:green;';//normal üyeler için renk ayarları
         break;
 default:
   $godbg = '';//grub listesinde olmayanlar renk ayarları
 break;
     }
 }
 else {$godbg= '';}
 echo '
 <div class="godroundframe" style="'.$godbg.'">
Bu renklendirmek içindi eğer siz resimlendirmek istiyorsanız.

Yukarıda ki kodların içinde bulun

Kod Seç Genişlet

$godbg = 'background-color: #800000;color: #fff;';//admin grubu için renk ayarları
Değiştirin - Ben örnek olarak kendi sitemde hazır olan arkaplanı ekledim. Siz kendiniz tasarlayıp url bölümünü değiştirerek kullanabilirsiniz.

Kod Seç Genişlet

$godbg = 'background-image: url(http://god-rpg.com/Themes/godv1/images/yetkili.png);background-color: #cccccc;';//admin grubu için renk ayarları
Şimdi ufak ayrıntılara geçelim. Bu ayrıntılar benim siteme özel olduğu için sizin sitenizde ufak aksaklıklar çıkarabilir. css dosyalarınızda ufak oynamalar ile halledebilirsiniz. Onun haricinde sistem stabil olarak çalışmaktadır.


index.css içinde Bulun

Kod Seç Genişlet

#forumposts div.poster {
    width: auto; }

.cont_colum_post {
   width: 100%;
   overflow:hidden;
   padding:0px; }

.left_colum  {
   float: left;
   margin-left: 0.5em; }

.right_colum  {
   float: right;
   margin-right: 2em; }

.left_colum  li.avatar {
   margin-top: 0.5em; }
   
span.divider_info {
   margin-bottom: 2px;
   -margin-bottom: 0px;
   display: block; }
   
/* poster and postarea + moderation area underneath */
.poster
{
   float: left;
   width: 14em;
}
.postarea, .moderatorbar
{
   margin: 0 0 0 1em;
   _padding-left: 1em;
}
.postarea div.flow_hidden
{
   width: auto;
}
Değiştirin

Kod Seç Genişlet

/* Informacion de usuario Horizontal */
.godinfop
{
   width: 220px;
   float: left;
   margin-left: -520px;
   height: 82px;
   margin-top: 10px;
   padding-left: 10px !important;
   padding-top: 6px !important;
   position: absolute;
   z-index: 1;
}
.godinfop h4, .godinfop ul
{
padding: 0;
margin: 0 1em 0 1.5em;
}
.godinfop h4
{
margin: 0.2em 0 0.4em 1.1em;
font-size: 120%;
}
.godinfop h4, .godinfop h4 a
{
color: #444;
}
.godinfop ul ul
{
margin: 0.3em 1em 0 0;
padding: 0;
}
.godinfop ul ul li
{
display: inline;
}
.godroundframe
{
padding: 0 10px;
background: #f8f8f8;
border-left: 1px solid #eee;
border-right: 1px solid #eee;
height: 110px;
margin-top: 10px;
}
.god-nick { width:200px; height:40px; line-height:40px; padding:0px !important; margin-left:160px; margin-top:10px; padding-left:10px !important; position:absolute; z-index:2; }
.god-rank { width:200px; height:42px; line-height:42px; padding:0px !important; margin-left:-10px; padding-left:10px !important; position:absolute; z-index:2; }
.god-nick, .god-rank, .godinfop
{ -webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px; background: rgba(255, 255, 255, 0.78); }
.god-rank img { padding: 5px; margin-left: 25px; }

.cont_colum_post {
   width: 100%;
   overflow:hidden;
   padding:0px; }

.left_colum  {
   float: left;
   margin-left: 0.5em; }

.right_colum  {
   float: right;
   margin-right: 2em; }

.left_colum  li.avatar {
    width: 180px;
    height: 160px;
    position: absolute;
    z-index: 1;
margin-top: 15px;
}
Displaytemplate.php içinde bulun

Kod Seç Genişlet

<div class="right_colum">
                  <div class="poster"><ul class="reset smalltext">';
Değiştirin

Kod Seç Genişlet

[code]<div class="right_colum">
                  <div class="godinfop"><ul class="reset smalltext">';[/code]

Displaytemplate.php içinde bulun

Kod Seç Genişlet

<div class="poster">
Değiştirin

Kod Seç Genişlet

[code]<div class="god-nick">
Displaytemplate.php içinde bulun

Kod Seç Genişlet

<div class="keyinfo">
Değiştirin

Kod Seç Genişlet

<div class="godkeyinfo">
Displaytemplate.php içinde bulun

Kod Seç Genişlet

<li class="stars">', $message['member']['group_stars'], '</li>';
Değiştirin

Kod Seç Genişlet

<div class="god-rank">', $message['member']['group_stars'], '</div>';
Son olarak

index.css de bulun

Kod Seç Genişlet

.keyinfo
{
float: left;
width: 50%;
}
Değiştirin

Kod Seç Genişlet

.keyinfo
{
float: left;
width: 50%;
}
.godkeyinfo
{
float: left;
width: 50%;
margin-left: 160px;
}
Evet arkadaşlar, işlem bu kadar yapamadığınız yerler olursa konu altında bildirin. Gördüğümde yardımcı olmaya çalışacağım. İyi forumlar

Good Old Days - GOD-RPG
DeCuervo

[garfieald]

Teşekkürler oldu.

[tarantula901]

Paylaşım için teşekkürler hello işine yarayan rpgciler olacaktır.

[Bazinga]

Uzun zamandır beklediğim tek şey :) Teşekkür Ederim :) Bende bizzat kendi ellerimle sağ kısıma karakter bilgilerini ekleyip paylaşacağım iznin ile :

[tarantula901]

işinize yaramasına sevindim son halini paylaşmanız dileğiyle

[HelloIamSoapy]

Uzun zamandır beklediğim tek şey :) Teşekkür Ederim :) Bende bizzat kendi ellerimle sağ kısıma karakter bilgilerini ekleyip paylaşacağım iznin ile :

Ben onu ekleyecektimde daha alt yapım hazır değil :) ama basit oda ekleyemezsen haberleşelim ayarlarım ben bi tane

[Bazinga]

Tamam dostum ben kodlamaya çalışacağım yapamazsam sana yazarım :)

[garfieald]

Hello dostum kendi sitende sosyal ağları eklemişssin o orta bölgeye onu eklediğin kodları yollayaiblirmisin :D

[Bazinga]

http://blackliferpg.tk/forum/index.php?topic=1.0

Böyle oldu beyler sebebi ne?

[HelloIamSoapy]

Hello dostum kendi sitende sosyal ağları eklemişssin o orta bölgeye onu eklediğin kodları yollayaiblirmisin :D

http://custom.simplemachines.org/mods/index.php?mod=3304

[Bazinga]

HelloImSoappy !

Yardımına ihtiyacım var. :( , Tekrar bir saat denedim belkide daha falza yapıyorum yok oraya buraya kayıyor rica etsem orjinal css ve display'ı attım bunları editleyip atabilirmisin ? :)

http://s5.dosya.tc/server2/0kujs0/Desktop.rar.html

[Yaman]

Ben yapamadım  :'(

[tarantula901]

Neyi yapamadınız yapamadıklarınız neler ayrıntı verin

[Yaman]

Şu iki şeyi nasıl ayırcagım ?
http://prntscr.com/dd8d7s
ve arkadaki wallpaper tam oturmuyor

[Yaman]

@Tarantula901

[Yaman]

Cevaplanmadı hala..

[tarantula901]

Yapılan kodlamayı sitenzide görmeden  birşey söylemem zor.

[Yaman]

mysql nasıl baglanacak @Tarantula901

[tarantula901]

Ayrı bir mysql sorgusu oluşturman gerekiyor. php bilginiz olması lazım

[Yaman]

her şey tamamda, nereden bağlayacagım sql dosyası yok ki baktım.

[garfieald]

kendin oluşturcan sql dosyasını dostum php mysql bilgisi lzım oyle bağlican işte

[tarantula901]

her şey tamamda, nereden bağlayacagım sql dosyası yok ki baktım.

Php bilginiz olması gerekiyor malesef. başka türlü yapmanız mümkün değil

[dejavu96]

Hocam dediklerinin birebir aynısını yaptım fakat ; http://prntscr.com/ee8w9m

[tarantula901]

size yardımcı olabilmem için profilinizi düzgün girin yoksa yardımcı olamam.

[dejavu96]

Düzelttim fakat yine bu problem ile karşı karşıyayım yani bu sefer resim filan koymadım. Yine aynı stil dediklerinizi yaptım ve uygulamama rağmen.

[tarantula901]

Bu profili ben yazmadım malesef ben sadece vbulletine benzer profili paylaştım tam olarak sorun ne anlamadım. şuanda sitenizde farklı bir tema vardı düzgündü şuanda default var.

kullanmış olduğunuz temada düzenlenmiş buradaki profili uydurmak biraz zor olabilir.

[dejavu96]

Hallettim :D

[tarantula901]

evet gördüm nasıl hallettiniz tam olarak olanları uygulayarak mı?

[dejavu96]

Dediklerinizin bir çoğunu uyguladım bu sayede çözdüm. Çözemeyen arkadaşlara yardımcı olurum her türlü. Mesaj atmaları yeterli olucaktır.

[Talhanya]

Bunu yaparken sayılan çoğu php dosyası benim temamda yok ne yapacağız?

[tarantula901]

default temadan alıp senın temana aktar o dosyalar üzerinde çalışma yap.

[tekyürek]

vb ye niye özenirsiniz anlamamki   smf nin çok güzel  profil alanları var   vb ye özeniyosanız vb  ye gecin

[Böyle biri yok]

Olmadı düzeltebilir misiniz ? size iki dosyayı veriyorum. 0 dan

[tarantula901]

Eksik eklediniz baştan yapın

[Böyle biri yok]

Hocam ben bu işlemi iki defa yaptım olmadı siz yaparmısınız ricam ekte koymuştum zaten

[tarantula901]

Bu profii ben yapmadım malesef oyuzden tam olarak nerede eskik birşey diyemem yaptıktan sonra gizli sekmeden kontrol edin bakalım. sorun css ile ilgili gözüküyor kodlar eksıkmı tekrar kontrol edin.

[Böyle biri yok]

Bütün kodlamalar doğru ama şu [c ode] [/co de]  da yanlış mı yaptım bilmiyorum

[tarantula901]

code kodlarını eklemeyeceksınız :D onlar nereden geldı oraya :D onları kaldır :D alıntı yaparakmı kodları aldın nasıl yaptın

[Böyle biri yok]

İki kere var hangi resimdekini sileyim?

[tarantula901]

o kodları kaldırın o şekilde kullanın.

[BrainDamaged]

Verilen adımlara harfiyen uydum ama bir türlü yatay postpite geçebilmiş değilim yardımcı olabileceklere şimdiden teşekkür ederim.

Dosyalar:http://s9.dosya.tc/server2/tnf7n9/pa.rar.html

[tarantula901]

Yapıldıktan sonra gizli sekmeden kontrol edin

[Talhanya]

Her seferinde yapmaya çalıştığımda bu hatayı veriyor, bazılarında değiştirilecek kodları dosyalarda bulamıyorum ne yapmalıyım

[tarantula901]

Kodlari. Eklerken dikkat edin eksik kod eklemiş olabilirsiniz

[Nympe]

Konu anlatımın için teşekkürler dostum.

[mkucuksari]

Gerçekten güzel bir anlatım olmuş  ;)

[garfieald]

Güncel tutalım herkesin favorisi .   

[BrainDamaged]

Kod Seç Genişlet

if (isset($message['member']['group_id']))  {
switch ($message['member']['group_id'])       {
case '1':
   $godbg = 'background-color: #800000;color: #fff;';//admin grubu için renk ayarları
break;
case '2':
   $godbg = 'background-color:blue;color:yellow;';//global mod için renk ayarları
break;
case '0':
   $godbg = 'background-color:orange;color:green;';//normal üyeler için renk ayarları
break;
default:
   $godbg = '';//grub listesinde olmayanlar renk ayarları
break;
}
}
else {$godbg= '';}
echo '
<div class="godroundframe" style="'.$godbg.'">

Hocam bu kısıma ek olarak ileti sayısına göre grubplara ayarlamak istiyorum acaba nasıl ayarlayabiliriz ?

[BrainDamaged]

*G

[tarantula901]

Kod Seç Genişlet

if (isset($message['member']['post_group']))  {
switch ($message['member']['post_group'])       {
case '1':
   $godbg = 'background-color: #800000;color: #fff;';//admin grubu için renk ayarları
break;
case '2':
   $godbg = 'background-color:blue;color:yellow;';//global mod için renk ayarları
break;
case '0':
   $godbg = 'background-color:orange;color:green;';//normal üyeler için renk ayarları
break;
default:
   $godbg = '';//grub listesinde olmayanlar renk ayarları
break;
}
}
else {$godbg= '';}
echo '
<div class="godroundframe" style="'.$godbg.'">
üsteki kodu kullanın

[garfieald]

eline sağlık tarantula. 

[Ziyaretci]

Arkadaşlar benim temamda index kodları yok yataypostbit yapmak için Display.template.php dosyasındaki değişiklikleri yaptım,index kodları yok yardımcı olursanız sevinirim.

[tarantula901]

şu şekilde arayın

.keyinfo
{

sonra {} içideki kodlarla birlikte kodları değiştirin.

eğer yine yoksa index.css dosyasının en sonuna ekleyin kodları

[Ziyaretci]

Teşekkürler

[Charismax]

Örnek resim olsaydı göreceğimiz iyidi.. yazı içinde yatay posbit demişsiniz vb3 den kalma bizim kafalar klasik posbit ...

rankı nick altına aldıkmı tamamdır bunun anlatımı görseli varmı acaba ?