CARA MEMASANG PERMALINK KEREN DI BLOG

Cara memasang Permalink keren di Blogspot - Sebelum memasang permalink ini, alangkah baiknya sobat tahu dulu apa kegunaannya. Kegunaan permalink untuk SEO itu, agar link url pada blog kita tidak terpotong. contoh : http://tanganhacker.blogspot.com/2013/10/cara-memasang-permalink-keren-di.html Nah, lihat url nya harusnya http://tanganhacker.blogspot.com/2013/10/cara-memasang-permalink-keren-di-blogspot.html . Nah itulah kegunaan permalink yang saya ketahui. Untuk pemasangannya sangatlah mudah saat sobat menulis artikel, pasti di sebelah tab kanan ada tulisan LINK. nah itulah tempat mengedit permalink. Untuk itu, jagalah link url kita agar judul dengan link sama .

Tapi yang kita bahas bukanlah itu, tapi bagaimana cara membuat permalink otomatis di bawah artikel ?? lihat screen shoot dibawah ini :

Nah , itulah screen shootnya. untuk itu berikut langkah langkah Cara memasang Permalink keren di Blogspot :

1. Masukkan masuk ke blogger.com >>  blog kita >> Template >> Edit HTml

Cari code ]]></b:skin> dengan menkan tombol f4

Setelah itu, masukkan java script dibawah ini diatas ]]></b:skin> . 

.tbiauthorbox {
position: relative;
margin: 20px auto;
border: 10px solid #00CC00;
padding: 5px;
min-height: 115px;
max-width: 650px;
-webkit-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
transition: all 0.3s ease-in;
}
.tbiauthorbox:hover {
border: 10px solid #0033CC;
-webkit-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
transition: all 0.3s ease-in;
}
.tbiauthoravatar {
background: #fff;
border: 1px solid #ccc9bd;
float: left;
height: 100px;
padding: 2px;
position: relative;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 0 0 4px 0 #d9d9d9;
-moz-box-shadow: 0 0 4px 0 #d9d9d9;
box-shadow: 0 0 4px 0 #d9d9d9;
width: 100px;
}
.tbiauthoravatar img {
height: 100px;
width: 100px;
}
.tbiauthorlabel {
font-family: 'lucida sans unicode', 'lucida grande', sans-serif;
background: #333;
color: #fff;
display: block;
font-size: 11px;
font-weight: bold;
line-height: 20px;
height: 20px;
margin-left: -43px;
position: absolute;
bottom: -10px;
left: 50%;
text-align: center;
width: 86px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.tbiauthorcontent {
margin-left: 120px;
}
.tbiauthorhead {
border-bottom: 1px solid #ddd;
margin-bottom: 12px;
padding: 0 160px 3px 0;
position: relative;
}
.tbiauthorbox h3 {
font-family: georgia, serif;
color: #302E29;
font-size: 26px;
font-weight: normal;
line-height: 30px;
margin: 0;
border: none;
text-transform: none;
text-decoration: none;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.tbiauthorbox h3:hover {
color: #E65002;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.tbiauthorbox h3 a {
color: #302E29 !important;
text-decoration: none;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.tbiauthorbox h3 a:hover {
color: #E65002 !important;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.tbiauthorsocial {
list-style: none;
margin: 0;
padding: 0;
position: absolute;
top: 4px;
right: 0;
}
.tbiauthorsocial li {
float: left;
margin-right: 4px;
padding: 0;
}
.tbiauthorsocial li a {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG-9H_lffl3anhUjmMnOzpNlJBlidlVCRn5zE4GOLVmv92l9lBz2vzVQtaYGZUUvLBmewlFHC-hOhcER4bK7dP0dS1HJVZ85pknLcYoZElo0e39aHFt97Aw559YTmpBrPve5Bx3b_yv6I/s75/icons_user_links.png) no-repeat 0 0;
color: #008E00;
display: block;
height: 20px;
font-size: 0;
text-indent: -99999px;
width: 20px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.tbiauthorsocial li a.authorFacebook {
background-position: -20px 0;
}
.tbiauthorsocial li a.authorGooglePlus {
background-position: -40px 0;
}
.tbiauthorsocial li a.authorTwitter {
background-position: -60px 0;
}
.tbiauthorsocial li a.authorBlog:hover {
background-position: 0 -20px;
}
.tbiauthorsocial li a.authorFacebook:hover {
background-position: -20px -20px;
}
.tbiauthorsocial li a.authorGooglePlus:hover {
background-position: -40px -20px;
}
.tbiauthorsocial li a.authorTwitter:hover {
background-position: -60px -20px;
}
.tbiauthorbox p.bio {
font-family: 'lucida sans unicode', 'lucida grande', sans-serif;
font-size: 12px;
line-height: 18px;
}
.tbiauthorbox p a {
color: #E65002;
}

Gantilah code warna sesuka sobat  ysng ditandai dengan tanda # . jika belum tau kode kodenya, silahkan dapatkan kode warna di Kode Warna

Langkah ke 2 , silahkan cari kode <div class='post-footer-line post-footer-line-3'>

Setelah itu, letakkan kode dibawah ini dibawah kode <div class='post-footer-line post-footer-line-3'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='tbiauthorbox'>
<div class='tbiauthoravatar'>
<img alt='Andri Nugroho' src='https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-ash3/1185210_537611042961121_175300381_n.jpg'/>
<span class='tbiauthorlabel'>
Post Author
</span>
</div>
<div class='tbiauthorcontent'>
<div class='tbiauthorhead'>
<h3>
<a href='http://Tanganhacker.blogspot.com/'>
Andri Nugroho
</a>
</h3>
<ul class='tbiauthorsocial'>
<li>
<a class='authorBlog' href='http://TanganHacker.blogspot.com/' target='_blank' title='Blog'>
Blog
</a>
</li>
<li>
<a class='authorFacebook' href='https://www.facebook.com/andryctyajawa' target='_blank' title='Facebook'>
Facebook
</a>
</li>
<li>
<a class='authorGooglePlus' href='https://plus.google.com/101934592591929631248' target='_blank' title='GooglePlus'>
GooglePlus
</a>
</li>
<li>
<a class='authorTwitter' href='https://twitter.com/andry_cyber' target='_blank' title='Twitter'>
Twitter
</a>
</li>
</ul>
</div>
<left>
Terimakasih telah membaca artikel. Tolong comentarkan jika ada kesalahan  dalam penulisan atau pun maksud dan tujuannya. 
<strong>
<u>
<data:blog.pageName/>
</u>
</strong>
  Sobat bisa copy paste artikel ini asalkan sertakan link dibawah ini :
<strong>
<a expr:href='data:post.url'>
<data:post.url/>
</a>
Karena sebagus bagusnya blog, jika copy - paste pasti akan terhapus oleh pakde Google Juga hehe
</strong>
.
</left>
</div>
</div>
</b:if>

Gampangkan ??? Nah itulah cara memasang permalink keren di blogspot. Untuk menambah kualitas SEO sobat, boleh dibaca Kumpulan situs cek kualitas SEO untuk menambah wawasan blog sobat. hehe

KATA KUNCI

Cara memasang Permalink keren di Blogspot

Widget permalink

Memasang permalink di blog

Permalink keren blog

Permalink

Memasang permalink di postingan blog