Blogger için hazırlanmış eski ve sağlıklı çalışmayan bir eklenti var idi. Bu eklentiyi geliştirerek, yazı içerisinde alt kısımda çıkan "İlginizi Çekebilir" tarzında bir eklenti hazırladım. Eklenti tüm tarayıcılarda sorunsuz bir şekilde çalışmaktadır. Sizlerin uğraşmaması için ise, her şeyin otomatik olması için efor sarf ettim. Sonuç olarak da, aşağıdaki adımları uygulamanız, eklentiyi kullanmanız için yeterli olacaktır. Farklı bir işlem veya ayarlama yapılmasına ise gerek bulunmamaktadır.

AYRICA: Blogger’da Yazar Bilgi Kutusu Ekleme Nasıl Yapılır?

Blogger için "İlginizi Çekebilir" Eklentisi ve Kullanımı

1) Öncelikle temanızdaki aşağıdaki kodu bulun.

<div class='post-header'>

2) Hemen altına aşağıdaki kodları ekleyin.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
&lt;div id=&quot;hlslidein&quot; style=&quot;display:none;&quot;&gt;<div class='close'>KAPAT</div>&lt;p&gt;İLGİNİZİ ÇEKEBİLİR&lt;/p&gt;&lt;div id=&quot;hlslidein_image&quot;&gt;&lt;/div&gt;&lt;div id=&quot;hlslidein_title&quot;&gt;İçerik yükleniyor...&lt;/div&gt;&lt;/div&gt;
&lt;script&gt; if(document.location.href.split(&quot;/&quot;).length==6&amp;&amp;document.location.href.indexOf(&quot;.html&quot;)!=-1){if(typeof hl_onload_queue==&#39;undefined&#39;)var hl_onload_queue=[];if(typeof hl_dom_loaded==&#39;boolean&#39;)hl_dom_loaded=false;else var hl_dom_loaded=false;if(typeof hl_async_loader!=&#39;function&#39;){function hl_async_loader(src,callback,id){var script=document.createElement(&#39;script&#39;);script.type=&quot;text/javascript&quot;;script.async=true;script.src=src;script.id=id;var previous_script=document.getElementById(id);if(previous_script)if(previous_script.readyState==&quot;loaded&quot;||previous_script.readyState==&quot;complete&quot;){callback();return}else{script=previous_script}if(script.onload!=null)previous_callback=script.onload;script.onload=script.onreadystatechange=function(){var newcallback;if(previous_script&amp;&amp;previous_callback)newcallback=function(){previous_callback();callback()};else newcallback=callback;if(hl_dom_loaded){newcallback()}else hl_onload_queue.push(newcallback);script.onload=null;script.onreadystatechange=null};var head=document.getElementsByTagName(&#39;head&#39;)[0];if(!previous_script)head.appendChild(script)}}if(typeof hl_domLoaded!=&#39;function&#39;)function hl_domLoaded(callback){hl_dom_loaded=true;var len=hl_onload_queue.length;for(var i=0;i&lt;len;i++){hl_onload_queue[i]()}}hl_domLoaded();hl_async_loader(&quot;&quot;,function(){hl_async_loader(&quot;&quot;,function(){},&quot;hl-out-slide&quot;)},&quot;jQueryjs&quot;)} &lt;/script&gt;
&lt;script type=&#39;text/javascript&#39;&gt;
//&lt;![CDATA[
$(function() {
if (typeof hlslidein_custom_css == &#39;undefined&#39; || !hlslidein_custom_css) $(&#39;head&#39;).append(&#39;&lt;style&gt;#hlslidein{z-index:999;width:380px;padding-bottom:10px;padding-right:10px;padding-left:10px;background-color:#fff;position:fixed;left:-430px;bottom:0px;font-family:Arial,Helvetica,sans-serif;border-top:1px solid #aaa;border-right:1px solid #aaa;}#hlslidein p{font-size:13px;padding-bottom:5px;border-bottom:2px solid #374760;font-weight:normal;font-family:Arial,Helvetica,sans-serif;color:#555}#hlslidein_title{color:#555;font-weight:normal;font-size:14px;line-height:1.7em;margin:-3px 20px 10px 0}#hlslidein a:hover{color:#222}#hlslidein a,#hlslidein_title{text-decoration:none;color:#444;}#hlslidein .close,#hlslidein .expand,#hlslidein .help{cursor:pointer;color:#555;padding:0px 0 0 0px;margin-top:13px;float:right;right:10px;font-weight:normal;font-family:Arial,Helvetica,sans-serif;font-size:13px}#hlslidein .help{right:35px}#hlslidein_title,#hlslidein_image{float:left;width:72px;margin-right:25px;}#hlslidein_title{width:240px}&lt;/style&gt;&#39;);
$(&#39;#hlslidein&#39;).show();
var hlslidein_gone_in = false;
var hl_scroll_lock = false;
$(window).scroll(function() {
if (hl_scroll_lock) return;
if (hlslidein_gone_in == false) $(&#39;#hlslidein .expand&#39;).hide();
if (document.getElementById(&quot;hlslidein_place_holder&quot;)) {
var distanceTop = $(&#39;#hlslidein_place_holder&#39;).offset().top - $(window).height();
} else {
var distanceTop = $(document).height() - $(window).height();
} if ($(window).scrollTop() &gt; 0) {
if (hlslidein_gone_in == false) {
$(&#39;#hlslidein&#39;).animate({
&#39;left&#39;: &#39;0px&#39;,
&#39;bottom&#39;: &#39;0px&#39;
}, 300)
} else $(&#39;#hlslidein&#39;).animate({
&#39;left&#39;: &#39;-430px&#39;,
&#39;left&#39;: &#39;-430px&#39;
}, 300)
} else $(&#39;#hlslidein&#39;).stop(true).animate({
&#39;left&#39;: &#39;-430px&#39;,
&#39;bottom&#39;: &#39;0px&#39;
}, 300)
});
$(&#39;#hlslidein .close&#39;).bind(&#39;click&#39;, function() {
hl_scroll_lock = true;
$(&#39;#hlslidein&#39;).stop(true).animate({
&#39;left&#39;: &#39;-430px&#39;
}, 300);
hl_scroll_lock = false;
hlslidein_gone_in = true;
$(&#39;#hlslidein .expand&#39;).show();
$(&#39;#hlslidein .close&#39;).hide()
});
$(&#39;#hlslidein .expand&#39;).bind(&#39;click&#39;, function() {
$(&#39;#hlslidein .expand&#39;).hide();
$(&#39;#hlslidein&#39;).stop(true).animate({
&#39;bottom&#39;: &#39;0px&#39;
}, 300);
hlslidein_gone_in = false;
$(&#39;#hlslidein .close&#39;).show()
})
});
var hlslideinprocessJson = function(json, status) {
if (json.feed.entry) var randomNum = Math.ceil(Math.random() * json.feed.openSearch$totalResults.$t);
$.ajax({
url: &#39;/feeds/posts/summary&#39;,
data: {
&#39;max-results&#39;: &#39;2&#39;,
&#39;alt&#39;: &#39;json-in-script&#39;,
&#39;start-index&#39;: randomNum
},
success: hlslideinprocessRecommendation,
dataType: &#39;jsonp&#39;,
cache: true
})
};
$.ajax({
url: &#39;/feeds/posts/summary&#39;,
data: {
&#39;max-results&#39;: &#39;1&#39;,
&#39;alt&#39;: &#39;json-in-script&#39;
},
success: hlslideinprocessJson,
dataType: &#39;jsonp&#39;,
cache: true
});
var hlslideinprocessRecommendation = function(json, status) {
try {
if (json.feed.entry) {
for (var i = 0; i &lt; json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
var url = &#39;&#39;;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
url = entry.link[k].href + &#39;&#39;;
break
}
};
var title = entry.title.$t;
if (location.href.indexOf(url) == -1) {
try {
var thumbUrl = &#39;&#39;;
thumbUrl = entry.media$thumbnail.url;
$(&#39;#hlslidein_image&#39;).html(&#39;&lt;img src=&quot;&#39; + thumbUrl + &#39;&quot; class=&quot;image&quot; title=&quot;&#39; + title + &#39;&quot; /&gt;&#39;)
} catch (error) {}
var link = $(&#39;&lt;a&gt;&#39;);
link.attr(&#39;title&#39;, title);
link.text(title);
link.attr(&#39;href&#39;, url);
$(&#39;#hlslidein_title&#39;).empty();
link.appendTo($(&#39;#hlslidein_title&#39;));
return
}
}
}
} catch (error) {
$(&#39;#hlslidein_title&#39;).html(&#39;&lt;p&gt;Sorry! Some error occurred while fetching the Blog Feed.&lt;/p&gt;&#39;)
}
};
//]]&gt;
&lt;/script&gt;
</b:if>

Not: Temanızda jQuery kütüphanesi olduğundan emin olmalısınız.

Örnek Görünüm