Membuat Artikel Terkait Bergambar dan Deskripsi

Membuat Artikel Terkait Bergambar dan Deskripsi

Berikut langkah-langkah Membuat Artikel

  1. Pertama sekali tentunya terlebih dahulu login keakun Blogger Anda
  2. Kemudian langkah selanjutnya silahkan masuk ke menu templateedit HTML dan centang expand template widget
  3. Cari kode </head>
  4. Kemudian Pastekan kode berikut tepat diatasnya :
<b:if cond='data:blog.pageType == &quot;item&quot;'>
     <style type='text/css'>
          #related_posts h4              {background:#1e4a76;color:#FFF;font:bold 11px Arial,Tahoma,Verdana;margin:0;padding:5px 7px 4px 10px;text-shadow:1px 1px #000;text-transform:uppercase;}
          #relpost_img_sum               {height:308px;overflow:auto;margin:0;padding:5px;line-height:16px;}
          #relpost_img_sum:hover         {background:none;}
          #relpost_img_sum ul            {list-style-type:none;background:none;margin:0;padding:0;}
          #relpost_img_sum li            {border-top:1px solid #fff;outline:1px solid #DDD5CD;background:#EDE9E4;overflow:hidden;margin:0;padding:5px;height:64px;list-style:none;}
          #relpost_img_sum li:hover      {background-color:#F0ECE9;}
          #relpost_img_sum .news-title a {color:#2C6BA8;}
          #relpost_img_sum .news-title   {font-family:Arial,Serif;font-weight:bold !important;display:block;margin-bottom:4px;}
          #relpost_img_sum .news-text    {display:block;text-align:left;font-weight:normal;text-transform:none;color:#333;}
          #relpost_img_sum img           {float:left;margin-right:14px;padding:4px;background:#fafafa;border:1px solid #ddd;width:55px !important;height:55px !important;}
     </style>
     <script type='text/javascript'>
          var relnojudul = 0;
          var relmaxtampil = 10;
          var numchars = 200;
          var morelink = "baca selengkapnya";
     </script>
     <script src='http://reader-download.googlecode.com/svn/trunk/atdeskripsi.js' type='text/javascript'></script>
</b:if>
5. Langkaht berikutnya yakni cari salah satu kode dibawah ini :
<data:post.body/>
Keterangan :
Biasanya kode diatas ada 3-4, maka cari pada kode ke 2 ataupun 4. Tergantung pada pembentukkan template Anda. atau kode dibawah ini :
<div class='post-footer'>
6. Pastekan kode dibawah ini, dibawah pada kode diatas :

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
         <div id='related_posts'>
              <h4>Artikel Terkait</h4>
              <b:loop values='data:post.labels' var='label'>
                   <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=relpostimgcuplik&amp;max-results=50&quot;' type='text/javascript'></script>
              </b:loop>
              <ul id='relpost_img_sum'>
                   <script type='text/javascript'>artikelterkait();</script>
              </ul>
         </div>
    </b:if>
Jika cara diatas sudah anda lakukan dan langkah terakhir yang akan anda lakukan yakni Simpan Template anda dan coba preview kemudian lihat hasilnya.

Demikian ulasan saya mengenai  Membuat Artikel Terkait Bergambar dan Deskripsi dan semoga bermanfaat.

0 comments:

Post a Comment