Cara Memasang Artikel Terkait dengan Gambar dan Deskripsi di Blog ~ NGE-KASKUS

Cara Memasang Artikel Terkait dengan Gambar dan Deskripsi di Blog | Memasang widget artikel terkait diblog merupakan salah satu langkah penting agar pengunjung blog betah. Sementara itu, menurut beberapa blogger senior, memasang artikel terkait atau related post juga dapat menambah seo.

Beranjak dari pentingnya memasang related post di sebuah blog, kali ini saya akan berbagi tips atau cara memasang artikel terkait dengan gambar dan deskripsi di blog yang pastinya keren. Untuk cara pemasangannya simak baik-baik yaw.
1. Masuk dasbor blog sobat
2. Klik template dan klik edit HTML
3. Cari kode ]]></b:skin> untuk mempermudah pencarian gunakan CTRL+F
4. Setelah ketemu, copy dan pestekan kode di bawah ini tepat di atas kode ]]></b:skin>

/* ==== Related Post Widget Start ==== */
.related-post {
margin:14px 0 8px;
font:normal normal 11px/1.4 Arial,Sans-Serif;
}
.related-post h4 {
font-family:"Oswald",Verdana,Sans-serif;
font-weight:normal;
text-transform:uppercase;
margin:0 0 4px;
font-size:14px;
color:#666;
}
/* Style 2 */
ul.related-post-style-2 {
padding:0 0 0 0 !important;
}
.related-post-style-2,
.related-post-style-2 li {
margin:0 0 0 0;
padding:0 0 0 0;
list-style:none;
}
.related-post-style-2 li {
padding:6px 0;
border-top:1px dotted #eee;
overflow:hidden;
}
.related-post-style-2 li:first-child {border-top:none}
.related-post-style-2 .related-post-item-thumbnail {
width:40px;
height:40px;
max-width:none;
max-height:none;
background-color:transparent;
border:none;
padding:0;
float:left;
margin:2px 6px 0 0;
}
.related-post-style-2 .related-post-item-title {
font-weight:bold;
font-size:110%;
}
.related-post-style-2 .related-post-item-summary {
display:block;
overflow:hidden;
}
.related-post-style-2 .related-post-item-more {}
/* ==== Related Post Widget End ==== */

5. Selanjutnya cari kode <data:post.body/> atau <div class='post-body'> setelah itu copy dan pastekan kode dibawah ini tepat di bawah code <data:post.body/> atau <div class='post-body'>

<b:if cond='data:blog.pageType == "item"'>
<div class='related-post' id='related-post'/>
  <script type='text/javascript'>
  var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
          "<data:label.name/>"<b:if cond='data:label.isLast != "true"'>,</b:if>
      </b:loop></b:if>];
  var relatedPostConfig = {
      homePage: "<data:blog.homepageUrl/>",
      widgetTitle: "<h4>
Related Post:</h4>
",
      numPosts: 5,
      summaryLength: 100,
      titleLength: "auto",
      thumbnailSize: 40,
      noImage: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRIg4Sk03jYuqodrGinDUFeKvL9OxJkx_K1wD6P7uw7MzxEvgAkUqhdOHfzF5XCTCSQK8SWnvha868NG89dGNmnbJnKNb-ZeTa_r2zKrUyrV0mkkgAJKjeEo8NqiS83lFXBMMTlRcIUEM/s40/picture_not_available.png",
      containerId: "related-post",
      newTabLink: false,
      moreText: "Read More",
      widgetStyle: 2,
      callBack: function() {}
  };
  </script>
  <script src='https://dl.dropboxusercontent.com/u/122336262/JavaScript/related-post.min.js' type='text/javascript'/>
</b:if>

6. Klik save, artikel terkait dengan gambar dan deskripsi sudah jadi.

Mudah bukan sobat cara memasang artikel terkait dengan gambar dan deskripsi di blog, semoga cara di atas dapat bermanfaat. Selamat mencoba!!

0 komentar:

Posting Komentar

WAJIB:
1. Pembaca yang budiman silahkan komentar disini dan saling klik/follow 'g+1' dan google plus ini akan bermanfaat untuk anda dalam membantu blog anda dan saya untuk meningkatkan traffic visitor+dollar adsense+backlink (PASTI)

2. Silahkan Masuk ke link ini Tukaran Link untuk saling tukar link

3. Berkomentarlah yang sopan , tidak mengandung SARA dan di larang NYEPAM atau memberi link aktif, semua komentar yang melanggar akan di hapus segera

4. DI LARANG COPAS TANPA MENYERTAKAN SUMBERNYA !!!

NGE-KASKUS

Rabu, 20 November 2013