Blogger Yorum Formu Nasıl Değiştirilir

Bu yazımda blogger mevcut yorum formundan sıkılanlar için yorum formuna nasıl renk katabiliriz onu sizlerle paylaşacağım.Bildiğiniz gibi hali hazırda bulunan yorum formunuz düz beyaz bir arka plana sahip bir formdur.Peki biz bu arka planı nasıl değiştirebiliriz?İstediğimiz bir resmi arka plan olarak nasıl belirleyebiliriz?

İlk olarak nasıl bir şey oluşturacağımız hakkında merakınız varsa DEMO sayfasını inceleyebilirsiniz.

Şablonumuzda değişiklik yapmadan önce yedeklemekte fayda var.Blogger hesabınıza giriş yapıp Html yi düzenleyeceğiniz kısma geliyorsunuz ve aşağıdaki kodu arıyorsunuz:

]]></b:skin>

Bu kodun hemen üzerine aşağıdaki kodu yapıştırıyorsunuz:

#newcomment-form iframe{
background:#ffffff url(http://3.bp.blogspot.com/_7wsQzULWIwo/Sx1aCAx_44I/AAAAAAAACeo/
HZz8QQT0etM/s400/plz-do-not-spam1.gif) no-repeat bottom right;
border:7px solid #C7C7C7;
padding:5px;
font:normal 12pt "ms sans serif", Arial;
color:#7EB2AC;
width:560px; height:250px !important;
}
#newcomment-form iframe:hover{
background:#ffffff url(http://1.bp.blogspot.com/_7wsQzULWIwo/Sx1Zs5rasXI/AAAAAAAACeg/
0fBam5AkHS0/s400/plz-do-not-spam2.gif) no-repeat bottom right;
border:7px solid #7EB2AC;
}
#newcomment-form a{
color:#7EB2AC;
}

Daha sonra <div class='comment-form'> kodunu bulup aşağıdaki kodla yer değiştiriyorsunuz:

<div id='newcomment-form'>

Şimdi şablonunuzu kaydedip değişikliği görebilirsiniz.

Yukarıdaki kodda bazı yerleri değiştirmek isteyenler için kod yapısından bahsetmek istiyorum:

Yukarıdaki kodları sitenize eklediğinizde fare ile yorum formunun üzerine geldiğinde yorum formunun değiştiğini göreceksiniz.Eğer siz de farklı resim ekleyip fare ile üzerine gelindiğinde yorum formunun değişmesini istiyorsanız resimlerin linklerini  değiştirmeniz yeterli.Eğer fare ile üzerine gelindiğinde resmin değişmesini istemiyorsanız

#newcomment-form iframe:hover{
background:#ffffff url(http://1.bp.blogspot.com/_7wsQzULWIwo/Sx1Zs5rasXI/AAAAAAAACeg/
0fBam5AkHS0/s400/plz-do-not-spam2.gif) no-repeat bottom right;
border:7px solid #7EB2AC;
}

 

kodunu silmeniz yeterli olacaktır.

Eğer resmin yerleşimini değiştirmek istiyorsanız bottom right kodunu bottom left, top right, top left şeklinde düzeltebilirsiniz.

Yukarıdaki kodlarda yine kalın yazdığım yerlerde değişiklik yapabilirsiniz.Arka plan rengini, yorum formu kutusunun genişlik ve yükseklik ayarlarını değiştirebilirsiniz.

Aynı zamanda benim demo linkinde gösterdiğim şekilde tek bir resim ve en üstte olacak şekilde yerleşim yapmak istiyorsanız yukarıdaki kodlar yerine aşağıdaki kodları eklemeniz yeterli olacaktır:

#newcomment-form iframe{
background:#ffffff url(http://www.branded07.com/wp-content/themes/branded07/images/b07V12_commentform_bk.jpg) no-repeat top;
border:7px solid #C7C7C7;
padding:100px 5px 5px 5px;
font:normal 12pt "ms sans serif", Arial;
color:#7EB2AC;
width:560px; height:250px !important;
}
#newcomment-form a{
color:#7EB2AC;
}

Evet ayrıntılı bir şekilde yorum formunu nasıl değiştirebilirsiniz onu sizlerle paylaştım.Eğer aklınızda bir soru olursa yorum bölümünde sorabilirsiniz.Güzel bir yorum formunuz varsa bizimle paylaşmayı ihmal etmeyin…