28 Nisan 2012 Cumartesi


Otomatik Thumbnail ve Devamını Oku Eklentisi

Bir çok kişinin kullandığı Otomatik Thumbnail ve Devamını Oku Eklentisinde , blogunuzda yazdığınız yazılara otamatik olarak konu içerisindeki resim ve devamını oku bağlantısının nasıl ekleneceğini bu yazımızda bulabilirsiniz...

Görüntü açısından da kullanışlı olan Otomatik Thumbnail ve Devamını Oku Eklentisi , Blogunuzda konuların uzayıp gitmesini engeller..Ana sayfada ve diğer sayfalarda daha iyi bir görüntü sağlar..

Hemen anlatıma geçelim..

Widget Şablonlarını Genişlet kutucuğunu işaretlediğinizden emin olun ve aşağıdaki kodu bulun..
</head>
Bulduğumuz kodun hemen üstüne , aşağıda yer alan kodları ekleyelim..
<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ;
summary_noimg = 400;
summary_img = 400;
img_thumb_height = 140;
img_thumb_width = 140;

</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");

if(img.length<=0) {
imgtag = '<span style="float:left;margin-right:5px;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFvza-pIxKke6owFUVKqX6uhYBhV4vPuEIGL9ff9DjBB5idTXd54eBHwxDEzlImF8o_sfzNYWJM-C5616Hq1CJw1ERBzDb2qHoI48R-oLslpXDjV0gteFoolKjCxpr615mfX1l6wkVvs2P/s0/2nrklth.jpg" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
var summ = summary_noimg;
}

if(img.length>=1) {
imgtag = '<span style="float:left;margin-right:5px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}

//]]>
</script>
Şimdi ise aşağıdaki kodumuzu bulalım..
<data:post.body/>
Bu kodumuzu aşağıdaki kod ile değiştirelim..( Daha detaylı olarak , bu kodu silin ve yerine aşağıdaki kodları ekleyin )
<!-- eklentileri.blogspot.com thumbnail devamını oku başlangıcı -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<a class='more' expr:href='data:post.url'>Devamını oku...</a>
</b:if>
</b:if>
<!-- eklentileri.blogspot.com thumbnail devamını oku bitişi -->
Yukarıdaki işlemleri yaptıysanız Otomatik Thumbnail ve Devamını Oku Eklentisini artık blogger blogunuzda kullanabileceksiniz..

Yukarıda eklemeniz gereken ilk kod içinde yer alan ;

img_thumb_height = 140;

img_thumb_width = 140;
Değerlerini değiştirerek , thumbnail yani ana sayfanızda görünecek resmin boyutunu ayarlayabilirsiniz..



<<< Bu Yazı için Arama Sonuçları  >>>

Otomatik Thumbnail ve Devamını Oku Eklentisi , Blogger Otomatik Thumbnail ve Devamını Oku Eklentisi , Blogger Thumbnail ekleme , Blogger Devamını oku Eklentisi , Blogger Devamını Oku ekleme , Blogger Thumbnail ve Devamını Oku


27 Nisan 2012 Cuma


Sadece Konu Başlıklarını Gösterme Eklentisi

Bu eklentimizde, ziyaretçileriniz blogunuzda arama yaptığında yada gerekli etikete tıkladığında, konularınız sadece başlık halinde listelenecektir..

Blogunuzda Sadece Konu Başlıklarını Gösterme Eklentisini kullanmak için aşağıda anlatılan adımı takip edin..

Hemen anlatıma geçelim..

Aşağıdaki kodumuzu buluyoruz..
<b:include data='post' name='post'/>
Bulduğumuz bu kodun yerine aşağıdaki kodlarımızı ekleyelim..( Daha net anlatmak gerekirse, üstte yer alan kodu silin ve aşağıdaki kodu sildiğiniz yere ekleyin.. )
<b:if cond='data:blog.homepageUrl
!= data:blog.url'>

<b:if cond='data:blog.pageType != "item"'>

<h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3>

<b:else/>

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

</b:if>

<b:else/>

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

</b:if>
Anlatılan adımı doğru yaptıysanız , Sadece Konu Başlıklarını Gösterme Eklentisini blogunuzda artık kullanabileceksiniz.. << DEMO >>


<<< Bu Yazı için Arama Sonuçları  >>>

Sadece Konu Başlıklarını Gösterme Eklentisi , Konu Başlıklarını Gösterme Eklentisi , Blogger Konu Başlıkları Gösterme , Blogger Sadece Başlıklar Görünsün , Bloggerda Başlıkları Gösterme



Blogger Resimli Benzer Yazılar Eklentisi v.2

Blogger blogunuz için Resimli benzer yazılar eklentisi istermisiniz ?

Daha önce BU yazımızda , resimli benzer yazılar eklentisinin nasıl yapılacağını anlatmıştık , farklı olarak bu eklentimizde , benzer yazılarınız , alt alta resimli şekilde listeleniyor..

Ziyaretçilerinizin ilgisini çekmek için resimli benzer yazılar eklentisini blogunuza eklemek için aşağıdaki anlatımı takip edin.

Öncelikle , Widget Şablonlarını Genişlet kutucuğunu işaretleyin ve Aşağıda yer alan kodumuzu bulun..
</head>
Hemen üstüne , altta yer alan kodlarımızı ekleyelim..
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
text-transform:none;
padding-left:5px;
}
#related-posts li {
list-style:none;
}
#related-posts h2{
font-size: 18px;
font-weight: bold;
color: #003300;
}
#related-posts a{
font-size: 16px;
color:#868686;
}
#related-posts a:hover{
color:black;
}
a.hidden img{
filter:alpha(opacity=70);
-moz-opacity: 0.5;
opacity: 0.5;
}
a.hidden:hover img{
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;}

</style>
<script src='http://yourjavascript.com/1124875421/benzer.js' type='text/javascript'/>
</b:if>
Şimdi ise bu kodumuzu buluyoruz..
<data:post.body/>
Hemen altına aşağıdaki kodlarımızı ekleyelim..
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=
4;
var relatedpoststitle=&quot;
BENZER YAZILAR&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
Anlatılanları doğru yaptıysanız eklentimiz artık hazır... << DEMO >>


<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Resimli Benzer Yazılar Eklentisi v.2 , Blogger Resimli Benzer Yazılar Eklentisi  , Blogger Resimli Benzer Yazılar  , Blogger Benzer Yazılar Eklentisi , Blogger Benzer Yazı Nasıl Eklenir


26 Nisan 2012 Perşembe


Blogger Mause imleci Değiştirme ( 28 adet )

Blogger blogunuzda kullandığınız mause ( fare ) imlecini değiştirmek istermisiniz ?

Bu eklentimizle , blogger blogunuzda bulunan imleciniz, farklı şekillerde gösterebileceksiniz..

Hemen anlatıma geçelim..

Aşağıdaki kodu bulalım..
</head>
Hemen üstüne aşağıda yer alan kodu ekleyelim..
<style type="text/css">body, a, a:hover {cursor: url(http://LİNK), progress;}</style>
Kod içinde bulunan kırmızı ile yazılmış http://LİNK yerine aşağıdaki beğendiğiniz imlecin linkini ekleyiniz..

http://www.fileden.com/files/2010/2/27/2776887/pen.jpg  http://www.fileden.com/files/2010/2/27/2776887/pen.cur

http://www.fileden.com/files/2010/2/27/2776887/link.jpg http://www.fileden.com/files/2010/2/27/2776887/link.cur

http://www.fileden.com/files/2010/2/27/2776887/dragon.jpg http://www.fileden.com/files/2010/2/27/2776887/dragon.cur

http://www.fileden.com/files/2010/2/27/2776887/dragonn.jpghttp://www.fileden.com/files/2010/2/27/2776887/dragonn.cur

http://www.fileden.com/files/2010/2/27/2776887/dragonnn.jpg http://www.fileden.com/files/2010/2/27/2776887/dragonnn.cur

http://www.fileden.com/files/2010/2/27/2776887/dragonnnn.jpg http://www.fileden.com/files/2010/2/27/2776887/dragonnnn.cur

http://www.fileden.com/files/2010/2/27/2776887/grndr.jpg http://www.fileden.com/files/2010/2/27/2776887/grndr.cur

http://www.fileden.com/files/2010/2/27/2776887/grndr2.jpg http://www.fileden.com/files/2010/2/27/2776887/grndr2.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer.png http://www.fileden.com/files/2010/2/27/2776887/bilquer.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer2.png http://www.fileden.com/files/2010/2/27/2776887/bilquer2.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer3.png http://www.fileden.com/files/2010/2/27/2776887/bilquer3.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer4.png http://www.fileden.com/files/2010/2/27/2776887/bilquer4.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer5.png http://www.fileden.com/files/2010/2/27/2776887/bilquer5.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer6.png http://www.fileden.com/files/2010/2/27/2776887/bilquer6.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer7.png  http://www.fileden.com/files/2010/2/27/2776887/bilquer7.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer8.png http://www.fileden.com/files/2010/2/27/2776887/bilquer8.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer9.png http://www.fileden.com/files/2010/2/27/2776887/bilquer9.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer10.png http://www.fileden.com/files/2010/2/27/2776887/bilquer10.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer11.png http://www.fileden.com/files/2010/2/27/2776887/bilquer11.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer12.pnghttp://www.fileden.com/files/2010/2/27/2776887/bilquer12.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer14.pnghttp://www.fileden.com/files/2010/2/27/2776887/bilquer14.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer16.png http://www.fileden.com/files/2010/2/27/2776887/bilquer16.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer17.png  http://www.fileden.com/files/2010/2/27/2776887/bilquer17.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer18.png  http://www.fileden.com/files/2010/2/27/2776887/bilquer18.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer23.png http://www.fileden.com/files/2010/2/27/2776887/bilquer23.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer24.pnghttp://www.fileden.com/files/2010/2/27/2776887/bilquer24.cur

http://www.fileden.com/files/2010/2/27/2776887/bilquer25.pnghttp://www.fileden.com/files/2010/2/27/2776887/bilquer25.cur

http://www.fileden.com/files/2010/2/27/2776887/grgr.png http://www.fileden.com/files/2010/2/27/2776887/prfcto.cur


<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Mause imleci Değiştirme , Blogger Fare imleci Değiştirme , Blogger fare imleçleri , blogger fare imleci nasıl değiştirilir , Blogger mause imleci ekleme , blogger mause imlecleri

Blogger Mause imleci Değiştirme ( 28 adet )

| | | | | Devamı » 26 Nisan 2012 Perşembe Unknown 0 yorum

24 Nisan 2012 Salı


Gazete Tarzı Yazı Yazma Eklentisi

Blogger Blogunuzda , Gazete Tarzı Yazı Yazma Eklentisi istermisiniz ?

Bu eklentimizde, blogger blogunuzda yayınlamak istediğiniz yazılarınızı 2 sütun şeklinde yan yana gösterebileceksiniz , Görüntü açısından da kullanışlı olan bu eklentimizi kullanmak isterseniz aşağıdaki adımları takip ediniz..

Öncelikle Demo için BURAYA tıklayınız..

Blogger blogunuzda , Yeyi yayın oluştur butonuna basın...Yazı alanı içinde HTML seçeneğini şeçerek aşağıdaki kodları yapıştırın..
<table cellpadding="10" cellspacing="10"><tbody>
<tr><td align="justify" valign="top" width="320">Deneme Yazısı Sol Tarafı</td><td align="justify" valign="top" width="300">Deneme Yazısı Sağ Tarafı</td></tr>
</tbody></table>
Kodu eklediyseniz , HTML Seçeneği yerine Oluştur seçeneğine girip ordan düzenleyebilirsiniz..Yukarıdaki kod içinde , Kırmızı ile geçen yer sol taraftaki yazınız, mavi ile geçen yer ise sağ taraftaki yazınız , buna göre düzenlersiniz..


23 Nisan 2012 Pazartesi


Blogger Animasyonlu Etiket Eklentisi

Bu eklentimizde, Blogger blogunuza yer alan etiketlerin üstüne gelindiğinde , Etiketimiz Sağa doğru hareket ediyor...

Demo için BURAYA tıklayın , açılan sayfada sağ taraftaki etiketlerin üstüne gelin.

Blogger Animasyonlu Etiket Eklentisini blogger blogunuza eklemek için aşağıdaki adımı izleyin..

Aşağıdaki kodu blogunuzun şablon kısmında bulun..
</head>
Hemen üstüne aşağıdaki kodları ekleyiniz..
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'>
</script>
<script type='text/javascript'>
var dur = 450;
$(document).ready(function() {
$('a.linknudge, .Label ul li a').hover(function() {
$(this).animate({
paddingLeft: '20px'
}, dur);
}, function() {
$(this).animate({
paddingLeft: 0
}, dur);
});
});</script>
Yapmanız gereken bu kadar...


<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Animasyonlu Etiket Eklentisi , Blogger Animasyonlu Etiket  , Blogger Etiket , Blogger Etiket Eklentisi , Blogger Etiket Ekleme

Blogger Animasyonlu Etiket Eklentisi

| | | | | Devamı » 23 Nisan 2012 Pazartesi Unknown 0 yorum

21 Nisan 2012 Cumartesi



Blogger Blogunuz Daha Hızlı Açılsın

Öncelikle bu yazımız bir eklenti değildir , Sadece blogger blogunuzun daha hızlı açılması için ipuçları içerir..

<< Resim >>
Blogger bloglarınızda , yazı içlerinde onlarca resim kullanmayın , mümkünse tek resim her zaman açılış hızı açısından önemlidir..Blogunuza eklediğiniz resimlerin boyutu büyük olmasın , büyük boyutlu resimler sayfanın yüklenme süresini geciktirir..

<< Eklenti >> 
Blogger bloglarımızda kullandığımız eklentiler vazgeçilmez , olmazsa olmazlardandır..Blogunuzda Gereksiz eklentilerden kaçının , mümkünse , hareketli çok fazla eklenti kullanmayın , örneğin ; flash obje içeren eklentiler blogunuzun açılış hızına etki eder..

<< Javascript >> 
Blogger blogumuzda , Hıza etki eden bir faktörde javascript dosyalarıdır , Bazen kullandığınız temanın içinde zaten varlardır, bazende kullandığınız eklentilerde de yer alırlar , bu javascript dosyaları başka kaynaklarda yüklü olduklarından , Blogger açılırken , kendi barındıkları sunuculara bağlanıp blogunuzun açılışını yavaşlatabilirler..

Sonuç olarak , blogger blogunuzun daha hızlı açılmasını istiyorsanız , yazılarınıza onlarca resim eklemeyiniz, ve gereksiz eklentilerden kaçınınız..


<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Blogunuz Daha Hızlı Açılsın , Blogger  Daha Hızlı Açılsın , Blogger Hzılandırma , Blogger Sayfam Nasıl Hızlı Açılır , Blogum Yavaş Açılıyor , Blogger Hızlandırma teknikleri , Blogunuz Daha Hızlı Açılsın


Blogger Blogunuz Daha Hızlı Açılsın

| | | | | Devamı » 21 Nisan 2012 Cumartesi Unknown 0 yorum

19 Nisan 2012 Perşembe


Kilitli , Kaldırılamayan Eklentileri Kaldırma

Blogger blogunuzda , Şablon değişikliği sonucu , Bazı eklentileri kaldıramayabilirsiniz, yada yukarıdaki resimdeki gibi , powered by blogger yazısının bulunduğu eklenti kilitli , kaldırılamayabilir olabilir..

Bu yazımızda, blogger için kaldıramadığınız kilitli eklentilerinizi nasıl kaldırabileceğinizi anlattık..


Blogger blogunuzda Yerleşim sayfanıza girin..


Yukarıdaki örnek resimde gördüğünüz , Attribution eklentisi kilitli durumda kaldırılamıyor , yanındaki Düzenle butonuna bastığımızda aşağıdaki resimdeki panelimiz açılıyor..


Üstteki örnek resimde gördüğünüz gibi , Attribution adlı eklentimizin Kaldır bağlantısı yok , bu yüzden bu eklentiyi kaldıramıyoruz...

Aşağıdaki anlatılanları uyguladıktan sonra şu şekilde bir sonuç alacağız..


Yukarıdaki resimde gördüğünüz gibi , eklentimizin artık Kaldır Butonu aktif..

Eğer blogger blogunuzda , sizinde kaldıramadığınız , kilitli eklentiler varsa aşağıdaki anlatım ile , blogunuzdan kaldırabilirsiniz..

Anlatıma Geçelim..

Blogger blogunuzda Yerleşim sekmesine girin , Kaldırılamayan eklentiniz, yani kilitli olan eklentinizin ismini blogger şablonunda aratacağız...Bizim örneğimizde Attribution eklentisi olduğu için , biz şablon kısmında Attribution şeklinde arama yaptık , siz kaldırmak istediğiniz eklenti adını yazın.... ( Widget Şablonlarını Genişlet kutucuğunu işaretlemeyi unutmayın )
<b:widget id='Attribution1' locked='true' title='' type='Attribution'>
<b:includable id='main'>
<b:if cond='data:feedbackSurveyLink'>
<div class='mobile-survey-link' style='text-align: center;'>
<data:feedbackSurveyLink/>
</div>
</b:if>




/// Yukarıdaki kod içinde geçen kırmızı true yazısını

Aşağıdaki gibi false olarak değiştiriyoruz ///







<b:widget id='Attribution1' locked='
false' title='' type='Attribution'>
<b:includable id='main'>
<b:if cond='data:feedbackSurveyLink'>
<div class='mobile-survey-link' style='text-align: center;'>
<data:feedbackSurveyLink/>
</div>
</b:if>

Attribution kelimesini aramamız sonucunda yukarıdaki kod dizilimini buluyoruz , Kod içinde kırmızı ile geçen true kısmını false olarak değiştireceğiz , böylelikle blogger blogunuzda kaldıramadığınız eklentinizi kaldırabilecekseniz..



<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Kaldırılamayan Eklentileri Kaldırma , Kaldırılamayan Eklenti , Blogger Eklenti Kaldırma , Kaldırılamayan Widget Kaldırma , Blogger Eklenti Kaldırma Sorunu , Eklenti Nasıl Kaldırılır , Kilitli Blogger Eklentisi

16 Nisan 2012 Pazartesi


Blogger Widget / Eklenti Hizalama

Tam olarak bir eklenti olmayan bu yazımızda , Bir çok blogger kullanıcısının ortak sorunu olan , eklediğiniz eklenti / gadget'in eklediğiniz yerde sağa yada sola dayalı durarak görüntü bozukluğuna yol açmasını engelleyeceğiz..

Basit olan bu işlemi Bir çok blogger kullanıcısı biliyordur , Bilmeyenler için anlatım aşağıda..

Bloggera eklediğiniz gadget / eklentinin bulunduğu kodu aşağıda kırmızı ile gösterilen kodlar arasına alın..
<center> BURAYA EKLENTİ KODUNUZ </center>
Yapmanız gereken sadece bu kadar..


Blogger Widget / Eklenti Ortalama

| | | | Devamı » 16 Nisan 2012 Pazartesi Unknown 0 yorum


Blogger Facebook Yorum Kutusu Ekleme Eklentisi


Blogger Blogunuzda bulunan yorum panelini , facebook yorum paneli ile değiştirmek istermisiniz ?

Bu eklentimizle , Ziyaretçileriniz yorumlarını facebook yardımı ile blogunuza gönderebilecek , biraz karışık olan bu eklentimizi , dikkatli şekilde uygularsanız blogger blogunuza ekleyebilirsiniz..

Anlatıma geçelim..


Blogunuzun ayarlar menüsüne girin , resimde gösterilen gibi, 1-2-3 ve 4 yollarını izleyin, ve Gizle seçeneğini seçin..Ayarları kaydet butonu ile çıkın..

Ardından BU adrese girerek , facebookta yeni bir uygulama oluşturalım..


Açılan panelde, Aşağıdaki resimdeki gibi 1 ve 2. adımları izleyin..



Açılan Güvenlik kontrolü Panelinde , aşağıdaki resimdeki gibi 1 ve 2. adımları izleyin..



Aşağıdaki panel açılacaktır..


Yukarıdaki panelde , ID Numaranız lazım olacaktır , isterseniz bir yere not alabilirsiniz, Resimdeki bütün adımları uygulayın..

Artık facebook ile işimiz bitti , şimdi blogunuzun şablon kısmına girerek aşağıdaki adımları takip edin...

Aşağıdaki kodu bulun..
<head>
Hemen bir satır altına , aşağıdaki kodu ekleyin , ID NUMARASI yerine kendi ID numaranızı yazınız ( Yukardaki resimde belirtmiştik )
<meta content='ID NUMARASI'   property='fb:app_id'/>
Şimdi ise aşağıdaki kodlardan birini bulalım..
<div class='post-footer-line post-footer-line-3'>


YADA


<p class='post-footer-line post-footer-line-3'>


YADA


<data:post.body/>
Bir satır altına aşağıdaki kodlarımızı ekleyelim.
<b:if cond='data:blog.pageType == "item"'>
<div id="fb-root"></div>
<script>(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));</script>
<fb:comments width='500' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/>
</b:if>
Son olarak aşağıdaki kodu bulun
<html
Bu kodumuza xmlns:fb="https://www.facebook.com/2008/fbml" kodunu ekliyeceğiz , örnek olarak aşağıdaki gibi
<html xmlns:fb="https://www.facebook.com/2008/fbml" b:version='2' class='v2' expr:dir='data:blog.languageDirection' 



Sadece Kırmızı yerde gösterilen gibi olacak , Mavi yazılar Örnek amaçlı yazılmıştır eklemeyiniz !!

Mavi yazılar sizde farklı olabilir..Kodu nasıl ekliyeceğinz amaçlı örnektir..
Artık blogunuzda , Blogger Facebook Yorum Kutusu Ekleme eklentisine sahipsiniz, bol yorumlar..DEMO


<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Facebook Yorum Kutusu Ekleme , Blogger Facebook Yorum Kutusu  , Facebook Yorum Kutusu Ekleme , Yorum Kutusu Ekleme , Facebook Yorum Formu , Facebook Yorum Formu Blogger ekle , Facebook Eklentisi


15 Nisan 2012 Pazar


Aşağı Açılan Sayfayla Kayan Menü Eklentisi

Bu eklentimizde , blogger blogunuzun sağ tarafında , sayfayla hareket eden , fare üstüne getirilince aşağı doğru açılan menü eklentisi yapımını anlatacağız..

Demosunu görmek için TIKLAYIN.

Aşağı Açılır Sayfayla Kayan Menü Eklentisi Anlatımı.

Yerleşim - Gadget Ekle - HTML/JavaScript seçeneği ile açılan panele aşağıdaki kodlarımızı ekleyelim..
<style text-type="CSS">
#bmenu{
position:fixed;
right:5px;
center:0px;
background-color:#2059DC;
border-radius:10px;
-moz-border-radius:10px;
border:2px solid #FFF;
width:202px;
height:20px;
color:#FFFFFF;
transition:all .5s ease-in;-moz-transition:all .5s ease-in;-webkit-transition:all .5s ease-in;-o-transition:all .5s ease-in;z-index:3;overflow:hidden;padding:9px 15px 10px;}

#bmenu h3{
margin:0;
padding:0;
text-align:center;
cursor:pointer;}

#bmenu ul{
border-radius:10px;-moz-border-radius:10px;
border:2px solid #FFf;
background-color:#9AB2EA;
margin:15px 0;
padding:0 15px;}

#bmenu li{list-style:none;margin:0 0 5px;padding:0;} #bmenu li a{
color:#000;
text-decoration:none;
font-size:14px;}

#bmenu li a:hover{
color:#fff;}

#bmenu:hover{
z-index:5;
height:175px;
</style>

<div id="bmenu">
<h3>
Açılır Menü</h3>
<ul>
<li><a href="#">MENÜ 1</a></li>
<li><a href="#">MENÜ 2</a></li>
<li><a href="#">MENÜ 3</a></li>
<li><a href="#">MENÜ 4</a></li>
<li><a href="#">MENÜ 5</a></li>
</ul>
</div>
Yukarıdaki kodlar içinde dikkat etmemiz gereken yerler renkli olarak belirtilmiştir..
Kırmızı yere >> Görüntü başlığınız...
Mavi yere >> Menü Başlıklarınız
Sarı Yere >> Menü Linkleriniz..

<<< Bu Yazı için Arama Sonuçları  >>>

Aşağı Açılan Sayfayla Kayan Menü Eklentisi , Aşağı Açılan Menü Eklentisi , Aşağı Açılan Kayan Menü Eklentisi , Aşağı Açılır Menü Eklentisi , Blogger Menü Yapımı , Blogger Menü Eklentisi



Blogger Rastgele Link Eklentisi

Blogger blogunuz için rastgele link eklentisi istermisiniz ?

Bu eklentimiz ile , sayfanızın istediğiniz bir yerinde rastgele link oluşturabileceksiniz, ziyaretçiler linke bastığında , blogger blogunuzda bulunan yazılardan biri rastgele açılacaktır..

Blogger Rastgele Link Eklentisini kullanmak için aşağıdaki yolları takip edin..

Yerleşim - Gadget Ekle - HTML/JavaScript seçeneği ile açılan panele aşağıdaki kodlarımızı ekleyin , herhangi bir başlık kullanmayın...
<script type="text/javascript"> function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; for (var j = 0; j < entry.link.length; ++j){if (entry.link[j].rel == 'alternate'){window.location = entry.link[j].href;}}} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = 'Rastgele Sayfa'; document.getElementById('Rastgele').appendChild(a); } </script> <script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky"></script>
Yukarıdaki kod içinde kırmızı ile geçen Rastgele Sayfa , link eklediğinizde gözükecek yazıdır , dilediğiniz gibi düzenleyebilirsiniz..


Yukarıdaki işlemi yaptıysanız , şimdi ise link eklememiz için aşağıdaki kodu yine Yerleşim - Gadget Ekle - HTML/JavaScript seçeneği ile açılan panele ekleyiniz , yada nerde kullanmak istiyorsanız orayada ekleyebilirsiniz..
<div id="Rastgele"></div>
Kod içinde bulunan Rastgele yazısına dokunmayın , o yazı gözükmeyecek , gözükecek yazı bir üst kodda kırmızı ile gösterilen yer..DEMO


<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Rastgele Link Eklentisi , Blogger Rastgele Link , Blogger Rastgele Link Eklentisi ekleme , Blogger Rastgele Link ekleme , Blogger Rastgele Eklentisi , Blogger Rastgele Yazı Gösterme , Blogger Rastgele Yazı Eklentisi



12 Nisan 2012 Perşembe


4 in 1 Yandan Açılan Facebook , Twitter , Google , Email Eklentisi

Blogger blogunuzda , yandan açılan facebook takipçi kutusu , Twitter son yazılarınız , Google + butonu ve email takip eklentisi istermisiniz..

Oldukça kullanışlı ve güzel bir eklenti olan 4in1 Yandan Açılan Facebook , Twitter , Google , Email Eklentisini blogger blogunuza eklemek için aşağıdaki yolu izleyin , Aşağıdaki kodu blogunuza Gadget olarak ekleyin..Kod için bulunan Kırmızı yazılmış yerlere , facebook twitter ve feedburner adreslerinizi yazınız , ( https://www.facebook.com/XXXXX , TWİTTERADRES , FEEDBURNERADRES Kısımlarına kendi adreslerinizi yazınız..)   DEMO


<style>img,a{border:0;}#on{visibility:visible;}#off{visibility:hidden;}#facebook_div{width:196px;height:353px;overflow:hidden;}#twitter_div{width:246px;height:353px;overflow:hidden;}#google_plus_div{width:152px;height:97px;overflow:hidden;margin-left:50px;margin-top:10px;}#knfeedburner_div{width:300px;height:97px;margin-top:25px;overflow:hidden;}#kakinetwork_div{width:300px;height:97px;overflow:hidden;}/* right side style */#facebook_right{z-index:10005;border:2px solid #3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;right:-200px;}#facebook_right img{position:absolute;top:-2px;left:-35px;}#facebook_right iframe{border:0px solid #3c95d9;overflow:hidden;position:static;height:360px;left:-2px;top:-3px;}#twitter_right{z-index:10004;border:2px solid #6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;right:-250px;}#twitter_right_img{position:absolute;top:-2px;left:-35px;border:0;}#google_plus_right{z-index:10003;background-color:#f2f2f2;border:2px solid #006ec9;border-top:2px solid #0056a0;border-bottom:2px solid #0056a0;border-right:2px solid #0056a0;border-left:hidden;width:152px;height:97px;position:fixed;right:-154px;}#google_plus_right_img{position:absolute;top:-2px;left:-33px;border:0;}#feedburner_right{z-index:10003;background-color:#fefefe;border:2px solid #5b5b5b;border-top:2px solid #5b5b5b;border-bottom:2px solid #5b5b5b;border-right:2px solid #5b5b5b;border-left:hidden;width:300px;height:97px;position:fixed;right:-303px;}#feedburner_right_img{position:absolute;top:-2px;left:-33px;border:0;}#kakinetwork_right{z-index:10003;border:2px solid #303030;background-color:#fff;width:300px;height:97px;position:fixed;}#kakinetwork_right img{position:absolute;top:-2px;left:-101px;}/* left side style */#facebook_left{z-index:10005;border:2px solid #3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;left:-200px;}#facebook_left img{position:absolute;top:-2px;right:-35px;}#facebook_left iframe{border:0px solid #3c95d9;overflow:hidden;position:static;height:360px;right:-2px;top:-3px;}#twitter_left{z-index:10004;border:2px solid #6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;left:-250px;}#twitter_left_img{position:absolute;top:-2px;right:-35px;border:0;}#google_plus_left{z-index:10003;background-color:#006ec9;border:2px solid #006ec9;border-top:2px solid #0056a0;border-bottom:2px solid #0056a0;border-left:2px solid #0056a0;border-right:hidden;width:152px;height:97px;position:fixed;left:-154px;}#google_plus_left_img{position:absolute;top:-2px;right:-33px;border:0;}#feedburner_left{z-index:10003;background-color:#fefefe;border:2px solid #5b5b5b;border-top:2px solid #5b5b5b;border-bottom:2px solid #5b5b5b;border-left:2px solid #5b5b5b;border-right:hidden;width:300px;height:97px;position:fixed;left:-303px;}#feedburner_left_img{position:absolute;top:-2px;right:-33px;border:0;}#kakinetwork_left{z-index:10003;border:2px solid #303030;background-color:#fff;width:300px;height:97px;position:fixed;}#kakinetwork_left img{position:absolute;top:-2px;right:-101px;}.box-title1{border:1px solid #ddd;/*border-radius*/-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;/*box-shadow*/-webkit-box-shadow:5px 5px 5px #CCCCCC;-moz-box-shadow:5px 5px 5px #CCCCCC;box-shadow:5px 5px 5px #CCCCCC;padding:10px;margin:10px 0;}.enteryouremail{background:#fff !important;border:1px solid #d2d2d2;padding:0px 8px 0px 8px;color:#a19999;font-size:12px;height:25px;width:165px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;margin:0px;}.submitbutton{background:#f2f2f2;border:1px solid #F66303;/*box-shadow*/-webkit-box-shadow:3px 3px 3px #666;box-shadow:3px 3px 3px #666;font:bold 12px Arial, sans-serif;color:#000000;height:25px;padding:0 12px 0 12px;margin:0 0 0 5px;/*border-radius*/-webkit-border-radius:5px;border-radius:5px;cursor:pointer;}</style><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script><script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script><script type="text/javascript">jQuery(document).ready(function(){ jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -200}, 500); });    jQuery("#twitter_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#twitter_right").stop(true,false).animate({right: -250}, 500); });     jQuery("#google_plus_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#google_plus_right").stop(true,false).animate({right: -154}, 500); });    jQuery("#feedburner_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#feedburner_right").stop(true,false).animate({right: -303}, 500); });    });</script><div id="on"><div id="facebook_right" style="top: 18%;"><div id="facebook_div"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQ0rYHMOXaC1KlRo9UoUgaBN5M8vNgmPY7LIZZWU2Rfu2T9dsUgX6z-FKjtUuR0DoKJuQ2LDShVPDoaUNys-6t5a2SHca0M5JY9Y6YAf2TMHVyPh3qNl0OWB6egSjIazbrmcAb8AYpSps/s1600/helperblogger.com-facebook-icon.png" alt="" /><iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/XXXXX&amp;locale=en_GB&amp;width=200&amp;connections=9&amp;stream=&amp;header=false&amp;show_faces=0&amp;height=356"   scrolling="no"></iframe></div></div></div><div id="on"><div id="twitter_right" style="top: 35%;"><div id="twitter_div"><img id="twitter_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQTLPmZzvhAFFo21Z6iGY95sbUSzArTUdRRRWPAr9pSQKhfRBVg8FSXwPCc2Js0xXSw9fWpSrEu6ZTiN74CKM977RdCs9qxjN8ZQ7130gRcYV61T7z4yTno-LJSS3r9SmiHEU5KX2WrzU/s1600/helperblogger.com-twitter-icon.png" /><script src="http://widgets.twimg.com/j/2/widget.js"></script><script>new TWTR.Widget({version: 2,type: 'profile',rpp: 4,interval: 1000,width: 246,height: 265,theme: {shell: {background: '#63BEFD',color: '#FFFFFF'},tweets: {background: '#FFFFFF',color: '#000000',links: '#47a61e'}},features: { loop: false,live: true,scrollbar: false,hashtags: false,timestamp: true,avatars: true,behavior: 'all' }}).render().setUser('TWİTTERADRES').start();</script></div></div></div><div id="on"><div id="google_plus_right" style="top: 52%;"><div id="google_plus_div"><img id="google_plus_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjceQLV6IjpcowxXALqO_eAjiBwT1h3ZIgNe-B-YfxGOoTg1BzvTHsSDXTsMdk-cr-Tk9Wrp-sslWCZqy_ejXQnpjHVELp74rk9jIfPHax_c9JDKW8XA2CTfrKpm0RgmhlC6Y2LqVproqU/s1600/helperblogger.com-google-plus-icon.png" /><div style="float:left;margin:10px 10px 10px 0;"><g:plusone size="tall" expr:href="data:post.url"></g:plusone></div></div></div><div id="on"><div id="feedburner_right" style=" top: 69%;"><div id="knfeedburner_div"><center><h4 style="color:#F66303;">You can also receive Free Email Updates:</h4><form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNERADRES', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="enteryouremail" name="email" value="Enter your email here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your email here...&#39;;}" onfocus="if (this.value == &#39;Enter your email here...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="FEEDBURNERADRES" name="uri" type="hidden" /><input value="Submit" class="submitbutton" type="submit" /></form></center><img id="feedburner_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbPR_kaLa1Z-1i8imQByEJwku6tUybukQHVoq2P-xMW8sceftj2s0XIoCTSgF9kOmWQ20cQuVD_KEV5TILfzfEVea49T25137wgnlvQcj27H36G3FqGHdX5EAw13h7wLwShgJKeNx-9GQ/s1600/helperblogger.com-subscribe-icon.png" /></div></div></div></div>


<<< Bu Yazı için Arama Sonuçları  >>>

4in1 Yandan Açılan Facebook , Twitter , Google , Email Eklentisi , Blogger yandan açılan , Blogger yandan açılan facebook , blogger yandan açılan twitter kutusu