Blogger Yorum Formuna Google+ Yorumları Nasıl Eklenir?

Google Plus ve Blogger Yorumlarına Görselli Göster/Geçiş Uygulaması Nasıl Eklenir? 

Merhaba değerli Ehliblog okuyucuları, birçok kişi Google+ ve Blogger için yorumları açmayı biliyor ancak çoğu kişi görünümü nedeniyle kullanmak istemiyor. Bu eklentiyi neden kullanmak isteyelim diyorsanız takipçilerinizi düşünün. İnternet sitenizi Google+ platformundan düzenli takip eden ve yorum yapan yahut yapmak isteyen takipçileriniz elbette olacaktır. Bu eklenti ile onların yorumlarını da dikkate almış olacağız. Nasıl yapılacağına göz atmadan önce eklentinin görünümüne bir bakalım.

Eklentide gördüğünüz üzere yorumlar kısmına dinamiklik katmış olacağız. Eklentiyi beğendiyseniz hemen uygulamaya başlayalım.

Google Plus ve Blogger Yorumlarını Nasıl Birleştireceğiz?

Bunu yapabilmek için eklentimizde jQuery ve CSS kullanacağız. (Bilmeyenlere ufak bir ara not: jQuery; Hala gelişimi sürdürülen JavaScript kütüphanesidir. CSS; bir internet sitesinin biçimlendirme, renk ve yazı tipi gibi öğelerinin tek bir yerden yönetilmesini sağlayan bir kodlama biçimidir.) Şimdi uygulamamıza geçelim.

Adım 1: Blogger kullanıcı panelimize giriş yapalım. Şablon > HTML'yi düzenle adımlarını takip edelim.

Adım 2: Şablonumuza girdikten sonra CTRL+F tuşlarına basarak arama kutumuzu açalım ve aşağıda ki kodu aratalım.

<b:include data='post' name='post'/>

Adım 3: Bulduğumuz kodun bir alt satırına aşağıda ki kodu ekleyelim.

<b:if cond='data:blog.pageType == &quot;item&quot;'> <style>#comments, #gplus-comments-visibility {display:none;} .comments-icons {background: url(http://2.bp.blogspot.com/--CsmnKc1FSA/VI8FyLYdw7I/AAAAAAAAAwE/erSHV85Pg_Q/s1600/speech-bubble.png) no-repeat; font-size: 20px; font-family: &quot;Arial Narrow&quot;,Arial,sans-serif; color: #555; font-weight: bold; padding: 18px 15px 0; height: 70px; } .comments-icons a img {vertical-align: middle;}</style> <div class='comments-icons'> Show Comments: <a class='show-hide-comments' href='javascript:void();' onclick='$(&quot;#gplus-comments-visibility&quot;).slideToggle();$(&quot;#comments&quot;).hide();'><img class='gplus-icon' height='35' src='http://1.bp.blogspot.com/-i1zpfechOuY/VI763hqxlHI/AAAAAAAAAvs/dz4sWUQW-xU/s1600/google-plus-logo.png' width='35'/></a> OR <a class='show-hide-comments' href='javascript:void();' onclick='$(&quot;#comments&quot;).slideToggle();$(&quot;#gplus-comments-visibility&quot;).hide();'><img class='blogger-icon' height='35' src='http://3.bp.blogspot.com/-4N-YlJvoxdA/VI763udxlHI/AAAAAAAAAvw/0dY2Ys0zz2k/s1600/blogger-logo.png' width='35'/></a> </div> <div id='gplus-comments-visibility'> <div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='550'expr:data-href='data:post.url'/> </div> </b:if>

Not: data-width kısmında eklentimizin genişliğini ayarlayabiliriz. Tasarımınızın durumuna göre bu kısmı değiştirmeniz gerekebilir. (Taşma ya da küçük kalma gibi durumlarda kendinize göre ayarlamalısınız.)

Adım 4: Şablonumuzu kaydet butonuna basıp eklentimizin keyfini sürmeye başlayabiliriz. Eğer eklenti çalışmazsa blogunuzun tasarımında jQuery kütüphanesi eklenmemiş olabilir. Şablonda jQuery kütüphanesi yoksa aşağıdaki işlemi gerçekleştirerek, kütüphaneyi şablonunuza ekleyebilirsiniz. Şablonumuzda CTRL+F tuşlarına basalım ve şu kodu aratalım.

</head>

Bir üst satırına aşağıdaki kod yardımıyla jQuery kütüphanesini ekleyelim.

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>

Son Sözler

İşlem tamam. Yapamadığınız ya da yapmakta zorlandığınız bir yer olursa yorum kısmından sorabilirsiniz. Ayrıca eğer isterseniz, yorumlarınıza aşağıdaki görseldeki gibi eklentinize numaralandırma ve mesaj balonu ekleyebilirsiniz. Nasıl yapılacağını öğrenmek için Blogger Yorumlara Numara ve Dinamiklik Nasıl Eklenir? başlıklı yazıyı ziyaret edebilirsiniz.

Yazar Hakkında : Bu yazı Zeyrek Blog sahibi Batuhan Tarhanacıoğlu tarafından değerli Ehli Blog okuyucuları için yazılmıştır.
Eğer siz de Ehli Blog'da konuk yazar olmak isterseniz, ozanbaser et yandex kom adresine, yazı fikrinizle birlikte mail atabilirsiniz. =)