╪ ** Silahkan Berikan Komentar, Komentar Anda Sangat Berarti Bagi Saya **╪ Blog ini terinpirasi dari sang inspirator yang sangat luar biasa ::_Salam ..::EDUCATION FOR ALL::.. **╪

Get this widget!

Cara Membuat Artikel Terkait V.2 di Bloger


Kali ini Blog Phuel mau sharingn Cara Membuat Artikel Terkait. Fungsi dari pemasangan Artikel Terkait ini di dalam blog adalah untuk meningkatkan/menaikkan pageview blog kemudian untuk menampilkan artikel-artikel kita yang lama namun masih terkait dengan artikel baru yang masih 1 label.
Contohnya seperti yang di blog saya yang sederhana ni heheheeh..

langsung saja berikut langkahnya

1. Login ke akun blogspot teman-teman >> Design/Tataletak >> Edit HTML >> klik check box Expand Template Widget, INGAT untuk jaga jaga Backup dulu template blog kamu, yaitu dengan mengklik Download Template Lengkap yg ada di bagian atas kotak Edit HTML.

2. Langsung saja Cari kode: ]]></b:skin>

3. Lalu copy paste kode dibawah ini persis berada di atas kode ]]></b:skin>




/* Kode CSS untuk Artikel Terkait */
#underpost{
font-family:Arial, Tahoma, Verdana, Sans-serif;/* Jenis font. */
font-size:small;/* Ukuran font. */
color:#0080FF;/* Warna teks. */
background:#81BEF7;/* Warna latar belakang. */
clear:both;
float:left;
width:410px;/* Lebar area artikel terkait. Sesuaikan dengan lebar main-wrapper (kolom posting) anda. */
-moz-border-radius:10px;
border:0;
height:auto;
margin:0 auto;
padding:10px;
}

#underpost h2{
font-family:'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif;/* Jenis font heading. */
font-size:large;/* Ukuran font heading. */
color:#0080FF;/* Warna teks heading. */
margin-bottom:5px;
border-bottom:1px solid #0080FF;/* Warna garis pembatas dibawah teks heading. */
padding:0 0 5px;
}

#underpost a,#underpost a:link,#underpost a:active,#underpost a:visited{
color:#0B243B;/* Warna link */
text-decoration:none;
}

#underpost a:hover{
text-decoration:underline;
}

#artikel-terkait{
overflow:auto;
width:auto;
height:400px;/* Tinggi dari artikel terkait */
padding:10px;
}

4. Lalu cari kode ini lagi: <data:post.body/>

5. Copy paste kan kode di bawah ini persis berada di bawah kode <data:post.body/>
Jika yang sudah menggunakan auto readmore pilih kode <data:post.body/> yang ke dua
<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='underpost'><div class='similiar'><div class='widget-content'><h2><blink>Artikel Terkait Lainnya Seputar:</blink></h2><div id='artikel-terkait'><div id='relposts'/><br/><br/><script type='text/javascript'>var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;var maxNumberOfPostsPerLabel = 4;var maxNumberOfLabels = 10;maxNumberOfPostsPerLabel = 100;maxNumberOfLabels = 3;function listEntries10(json) {var ul = document.createElement(&#39;ul&#39;);var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?json.feed.entry.length : maxNumberOfPostsPerLabel;for (var i = 0; i &lt; maxPosts; i++) {var entry = json.feed.entry[i];var alturl;for (var k = 0; k &lt; entry.link.length; k++) {if (entry.link[k].rel == &#39;alternate&#39;) {alturl = entry.link[k].href;break;}}var li = document.createElement(&#39;li&#39;);var a = document.createElement(&#39;a&#39;);a.href = alturl;if(a.href!=location.href) {var txt = document.createTextNode(entry.title.$t);a.appendChild(txt);li.appendChild(a);ul.appendChild(li);}}for (var l = 0; l &lt; json.feed.link.length; l++) {if (json.feed.link[l].rel == &#39;alternate&#39;) {var raw = json.feed.link[l].href;var label = raw.substr(homeUrl3.length+13);var k;for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);var txt = document.createTextNode(label);var h = document.createElement(&#39;b&#39;);h.appendChild(txt);var div1 = document.createElement(&#39;div&#39;);div1.appendChild(h);div1.appendChild(ul);document.getElementById(&#39;relposts&#39;).appendChild(div1);}}}function search10(query, label) {var script = document.createElement(&#39;script&#39;);script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;+ label +&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);document.documentElement.firstChild.appendChild(script);}var labelArray = new Array();var numLabel = 0;<b:loop values='data:posts' var='post'><b:loop values='data:post.labels' var='label'>textLabel = &quot;<data:label.name/>&quot;;var test = 0;for (var i = 0; i &lt; labelArray.length; i++)if (labelArray[i] == textLabel) test = 1;if (test == 0) {labelArray.push(textLabel);var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?labelArray.length : maxNumberOfLabels;if (numLabel &lt; maxLabels) {search10(homeUrl3, textLabel);numLabel++;}}</b:loop></b:loop></script></div></div></div></div></b:if>

6. Jika sudah maka tinggal klik Save Templates dan lihat hasilnya.

Posting Lebih Baru Posting Lama Beranda

0 komentar:

Gambar Komentar

Terima Kasih Anda Sudah Membaca Artikel Ini, Silahkan Tinggalkan Sebuah Komentar, 1 Komentar Anda Sangatlah Berarti Bagi Saya