Blogger İçeriklerini Sayfalandırma Eklentisi

29.3.18

Blog içerik sayfalandırması, ziyaretçilerin bir sonraki içeriği görüntüleyebilmesini kolaylaştırmak amacıyla oluşturulan ve içerikleri birden çok sayfaya bölerek numaralandıran JQuery eklentisidir.


Bu eklenti, blog yayınlarını numaralı şekilde sıralayarak sayfalara ayıran ve yayın içeriğini okumak için otomatik olarak görüntülenen numaralara tıklandığında sayfanın yüklenmesi sağlanır. Böylece, ziyaretçilere daha fazla reklam sunmak için otomatik olarak yüklenen içerik sayfalarına ayrı ayrı reklam eklenme imkanı da bulunuyor. Ayrıca, sayfaların daha fazla tıklanmasını da sağlıyor.

Blogger İçeriklerini Sayfalandırma Eklentisi Nasıl Kurulur?


Blog yayınlarınızın uzun olması ve sayfa düzenini sağlamak için, içerik sayfalandırması ile blog yayınlarınızı daha düzenli hale getirebilirsiniz. İçerik sayfalandırma eklensini blogunuza kurmak için aşağıdaki adımları takip edin.


Birinci adım: Aşağıdaki CSS kodlarını blogunuzun şablon editör sayfasında bulunan </head> kodunun bir satır üzerine ekleyin.

CSS
<b:if cond='data:view.isPost'>
<style type="text/css">
.post-body-nav button{background:transparent;cursor:pointer}
.post-body-nav button{padding:6px 12px;display:inline-block;color:#222;border:2px solid #eee;margin:4px;transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out}
.post-body-nav button.active {border:2px solid #888}
.post-body-nav button:hover,.post-body-nav button:focus{border:2px solid #888;color:#222}
</style>
</b:if>

İkinci adım: Aşağıdaki JQuery kodunu blogunuzun </body> kodunun bir satır üzerine ekleyin ve şablonu kaydedin.

JQuery
<b:if cond='data:view.isPost'>
<script type='text/javascript'>
//<![CDATA[
eval(function(p,a,c,k,e,d){e=function(c){return c.toString(36)};if(!''.replace(/^/,String)){while(c--){d[c.toString(a)]=k[c]||c.toString(a)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('b 2(){c d=4.a("f");d.g="7:9/8;e,k+m+n+h",4.l.i(d)}0.3?0.3("j",2,!1):0.5?0.5("6",2):0.6=2;',24,24,'window||downloadJSAtOnload|addEventListener|document|attachEvent|onload|data|javascript|application|createElement|function|var||base64|script|src|IiksJCgiLnBvc3QtYm9keS1wYWdlIikuaGlkZSgwKSwkKCIucG9zdC1ib2R5LXBhZ2UiKS5maXJzdCgpLmZhZGVJbigpLCQoIi5wb3N0LWJvZHktbmF2IGJ1dHRvbiIpLmZpcnN0KCkuYWRkQ2xhc3MoImFjdGl2ZSIpfQ0KJCgiLnBvc3QtYm9keS1uYXYgYnV0dG9uIikuY2xpY2soZnVuY3Rpb24oKXtpZighJCh0aGlzKS5oYXNDbGFzcygiYWN0aXZlIikpe3ZhciBlPWV2YWwoJCh0aGlzKS5hdHRyKCJkYXRhLXRhcmdldCIpKTskKCIucG9zdC1ib2R5LXBhZ2UiKS5oaWRlKCkucmVtb3ZlQ2xhc3MoImFjdGl2ZSIpLCQoIi5wb3N0LWJvZHktcGFnZSIpLmVxKGUpLmZhZGVJbigpLmFkZENsYXNzKCJhY3RpdmUiKSwkKCIucG9zdC1ib2R5LW5hdiBidXR0b24iKS5yZW1vdmVDbGFzcygiYWN0aXZlIiksJCh0aGlzKS5hZGRDbGFzcygiYWN0aXZlIiksJCgiaHRtbCxib2R5IikuYW5pbWF0ZSh7c2Nyb2xsVG9wOiQoIi5wb3N0LWJvZHktcGFnZS5hY3RpdmUiKS5vZmZzZXQoKS50b3B9LCJub3JtYWwiKX19KX0pOw0K|appendChild|load|LyohIGpRdWVyeSB8IGh0dHBzOi8vYmxvZ2dlcmVrbGVudGlsZXJpLmJsb2dzcG90LmNvbSAqLw0KJChmdW5jdGlvbigpe2lmKCQoIi5wb3N0LWJvZHkgLnBvc3QtYm9keS1wYWdlIikubGVuZ3RoPjApe3ZhciBhcnRpY2xlQm9keT0kKCIucG9zdC1ib2R5IikscGFnZXM9IiI7YXJ0aWNsZUJvZHkuZmluZCgiLnBvc3QtYm9keS1wYWdlIikuZWFjaChmdW5jdGlvbihpKXtwYWdlcys9IjxidXR0b24gZGF0YS10YXJnZXQ9JyIraSsiJz4iK2V2YWwoaSsxKSsiPC9idXR0b24|body|In0pLGFydGljbGVCb2R5LmFwcGVuZCgnPGRpdiBjbGFzcz0icG9zdC1ib2R5LW5hdiI|JytwYWdlcysiPC9kaXY'.split('|'),0,{}))
//]]>
</script>
</b:if>

Üçüncü adım: Blogunuzda bulunan uzun yayın içeriklerini aşağıdaki HTML kodlar içerisine ekleyerek yayınlayabilirsiniz.

HTML
<div class="post-body-page">
Sayfa 1
</div>
<div class="post-body-page">
Sayfa 2
</div>
<div class="post-body-page">
Sayfa 3
</div>
<div class="post-body-page">
Sayfa 4
</div>

Yayın sayfaları, yayın sayfanın altında otomatik olarak numaralandırılacaktır. Blog yayınınızı yukarıdaki HTML kodlar ile sınırsız olarak sayfalara ayırabilirsiniz.

Bknz: Blog Yayınlarında Otomatik İçindekiler Dizini Oluşturma

Bknz: Blogger AMP HTML Uyumlu İçindekiler Tablosu Oluşturma

Blogger yayın içeriklerini sayfalara ayırma eklentisi ile ilgili bilgi almak ve görüş bildirmek için yorum bırakabilirsiniz.
  1. Merhaba admin bey bu sıralamaya tıklarken sayfa aşağı veya yukarı hareket ediyor. Acaba kodlardan hangisini kaldırırsak sayfa hareketi durdur???

    YanıtlaSil
    Yanıtlar
    1. Kontrol dışı bir hareket mi var? Bana ne istediğinizi daha iyi açıklar mısınız.

      Sil
  2. İlk defa duyuyorum bu eklentiyi.

    Teşekkürler paylaşım için.

    YanıtlaSil
  3. Tema kodlarınız arasına eklemeniz gerekiyor.

    YanıtlaSil
  4. Yine harika bir blogger eklentisi. Özellikle uzun içeriklerde hem sayfanın yüklenmesi, hem de daha fazla reklam gösterebilmek için faydalı. Gayet de iyi çalışıyor. Teşekkürler..


    NOT: Senin paylaştığın blogger otomatik içindekiler eklentisini de kullandığım için çakışma oldu. İçindekiler listesinde yer alan ancak 2. ya da 3. sayfada kalan başlıklara tıkladığımda içindekiler listesinden o başlığa gidemiyorum. Bunun bir çözümü var mıdır?

    YanıtlaSil