Pages

Sabtu, 06 Agustus 2011

Create Artkel Terkait

Untuk membuat artikel terkait atau related post, kita akan sedikit mengutak – atik kode HTML template kita seperti membongkar alat elektronik. Jadi seperti biasa saya sarankan untuk membackup template sobat terlebih dahulu sebelum membuat artikel terkait ini. Para blogger baru yang belum tau tentang artikel terkait akan saya beri sedikit gambaran, kurang lebihnya seperti ini, dalam setiap postingan tentunya kita akan mengelompokkan postingan kita dalam beberapa kelompok atau yang biasa disebut dengan label (kategori). jadi dapat disimpulkan artikel terkait atau related post nanti berdasarkan label postingan itu.
Artikel terkait itu biasanya yang saya tau selalu berada dalam 1 kelompok postingan yang di kategorikan, contoh seperti dalam blog ini sobat bisa lihat pada halaman bawah postingan ini akan terlihat beberapa artikel terkait yang saling mengait, sekarang gak usah banyak cakap and GPL (Gak Pake Lama)
Berikut tutorial singkatnya :
  1. Login ke Blogger.
  2. Klik Tata Letak.
  3. Klik tab Edit HTML.
  4. Kemudian jangan lupa klik Expand Template Widgets .
  5. Cari kode yang seperti ini : <p><data:post.body/></p>
    atau jika bingung tekan Ctrl + F kemudian ketikkan kode berikut :
    <data:post.body/>
  6. Jika sudah menggunakan Read More pada template sobat, maka akan terdapat 2 kode <data:post.body/>
  7. Kemudian letakkan script berikut ini setelah kode <data:post.body/> yang pertama. <b:if cond=’data:blog.pageType == “item”‘>
    <div class=’similiar’>
    <div class=’widget-content’>
    <h3>Artikel Terkait</h3>
    <div id=’data2007′/><br/><br/>
    <script type=’text/javascript’>
    var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
    var maxNumberOfPostsPerLabel = 4;
    var maxNumberOfLabels = 7;
    maxNumberOfPostsPerLabel = 7;
    maxNumberOfLabels = 3;
    function listEntries10(json) {
    var ul = document.createElement('ul');
    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 == 'alternate') {
    alturl = entry.link[k].href;
    break;
    }
    }
    var li = document.createElement('li');
    var a = document.createElement('a');
    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 == 'alternate') {
    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('b');
    h.appendChild(txt);
    var div1 = document.createElement('div');
    div1.appendChild(h);
    div1.appendChild(ul);
    document.getElementById('data2007').appendChild(div1);
    }
    }
    }
    function search10(query, label) {
    var script = document.createElement('script');
    script.setAttribute('src', query + 'feeds/posts/default/-/'
    + label +
    '?alt=json-in-script&amp;callback=listEntries10');
    script.setAttribute('type', 'text/javascript');
    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>
    </b:if>
  8. Kemudian Save Template
  9. Sebenarnya tutorial yang kesembilan ini ga ada, cuma oskar mau bilang ” wah ternyata mudah banget ya he he he!!! selamat mencoba!!!


0 komentar:

Posting Komentar