Cara Membuat Artikel Terkait Ala Kang Ismet ~ RATU MOVIE

Cara Memasang Related Post atau Artikel terkait seo frienly Valid HTML 5 - Assalamualikum wr.wb hai sobat semua selamat malam apa kabar !! oke nih sobat semua pada postingan kali ini Admin Cyber 88 akan share nih buat kalian semua yaitu Cara Membuat Artikel Terkait Ala Kang Ismet , Tau enggak related post / Artikel Terkait ?? .

Artikel Terkait merupakan sebuah postingan postingan yang dibawah artikel yang biasanya seperti link dan gambar yang berfungsi mencantumkan semua postingan yang berlabel dan merupakan agar mengurangi bounce rate pada blogspot.

Dengan kalian memasang related post ini kalian bisa mendapatkan juga visitor / pageview yang ingin membaca artikel artikel yang lain , memasang artikel terkait juga merupakan optimasi seo, oleh karena itu memasang artikel terkait harus dilakaukan oleh para blogger .

nah karena memasang artikel terkait ini sangat penting bagi para pengguna blogger kalian bisa membaca cara membuat Artikel terkait ( konten ) dibawah ini .

Cara Membuat Artikel Terkait Ala Kang Ismet

Pastinya anda harus login di blogger dulu > Dashboard
Klik Pada menu disamping "Template" > Edit Template
Pada bagian isi template kalian klik dulu "CTRL+F" lalu cari kode "]]></b:skin>" atau "</style>" jika sudah ketemu masukkan CSS Dibawah ini diatas kode berikut .

<! --Artikel Terkait Start - Cyber 88 -->
.related-post{margin:2em auto 0;font-size:13px;background:#fff;border-radius:4px}
.related-post h4{font-size:14px;margin:0 0 .5em;background:#9dcb63;color:#fff;padding:14px 20px 14px 75px;font-weight:normal;border-radius:4px 4px 0 0;position:relative;font-family:Oswald,Arial,Sans-Serif;text-transform:uppercase}
.related-post h4:before{content:"\f074";font-family:fontAwesome;font-size:22px;font-style:normal;background-color:#8db857;color:#fff;border-radius:4px 0 0 0;top:0;left:0;padding:13px 20px;position:absolute}
ul.related-post-style-1{padding-left:0!important;margin-top:-12px}
.related-post-style-1 li{list-style:none;padding:15px 20px;border-top:1px solid #eceef5}
.related-post-style-1 li a{color:#79798d;text-decoration:none}
.related-post-style-1 li a:hover{color:#33aea5;text-decoration:none}
.related-post-style-1 li:before{content:"\f08e";font-family:fontAwesome;color:#c7cbd4;font-style:normal;top:0;left:0;margin-right:13px}
<! --Artikel Terkait Finish - Cyber 88 -->

dan jika kalian sudah memasang CSS diatas kemudian cari kode "<data:post.body>" ( Jika ada 3 kode "<data:post.body>" pilih yang terakhir saja , lalu jika anda sudah menemukan kode tersebut Pasang kode HTML dibawah kode tersebut .

<b:if cond='data:blog.pageType == "item"'>
<div id='related-post' class='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>Artikel Terkait:</h4>",
      numPosts: 5,
      titleLength: "auto",
      containerId: "related-post",
      newTabLink: false,
      widgetStyle: 1,
      callBack: function() {}
};
</script>
<script type='text/javascript' src='https://kang-is.googlecode.com/svn/trunk/javascript/related-post.min.js'/>
</b:if>

Nah jika anda sudah memasang kode HTML Diatas ,, ingat jangan disimpan dulu templatenya , soal ada satu lagi nih kode yang harus dipasang yaitu Script Kode FontAwesome ,, karena font awesome merupakan diperlukan kalian cari dulu kode </head> jika sudah menemukan kode tsb pasang kode dibawah ini tepat diatas kode tersebut .

<link href='//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css' rel='stylesheet'/>

nah jika sudah masang script diatas kemudian klik "simpan template"

Schreenshot

Nah itulah Cara Membuat Artikel Terkait Ala Kang Ismet dan Demikanlah artikel tentang Cara Membuat Artikel Terkait Ala Kang Ismet dan semoga bermanfaat bagi kita semua wassalamualikum wr.wb

iop

Add Comment

Tutorial Blogging