Sobat yang tertarik dengan widget yang satu ini, silahkan ikuti tutorial berikut.
Cara Membuat Permanen Link di Blog
1. Login ke akun blog sobat.
2. Klik rancangan --> Edit HTML --> Centang kotak expand template widget
3. Letakkan kode berikut di atas kode ]]></b:skin>
.admin-tulisan{
width:auto;
background:#FFF9EE;
border:2px solid #CCCCCC;
margin:30px 0 10px 0;
display:block;
font-family:"julee";
color:#000;
}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#993300;
border:none;
border-bottom:1px solid #CCCCCC;
color:#fff;
font-family:"julee";
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
padding:5px 10px;
margin:0 0 0 0;
display:block;
}
.admin-tulisan h4 a{color:#000000;}
.admin-tulisan img{
background:#000000;
width:90px;
height:100px;
border:1px solid #CCCCCC;
margin:3px 10px 0 0;
float:left;
padding:2px;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}
width:auto;
background:#FFF9EE;
border:2px solid #CCCCCC;
margin:30px 0 10px 0;
display:block;
font-family:"julee";
color:#000;
}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#993300;
border:none;
border-bottom:1px solid #CCCCCC;
color:#fff;
font-family:"julee";
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
padding:5px 10px;
margin:0 0 0 0;
display:block;
}
.admin-tulisan h4 a{color:#000000;}
.admin-tulisan img{
background:#000000;
width:90px;
height:100px;
border:1px solid #CCCCCC;
margin:3px 10px 0 0;
float:left;
padding:2px;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}
4. Cari kode <data:post.body/> ( gunakan Ctrl + F ) dan letakkan kode berikut tepat di bawahnya.
apa bila ada tiga kode yang sama, gunakan kode yang kedua.
<!-- Permalink Abalhafiz -->
<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <b><data:post.author/></b> ~ Tips dan Trik Blogspot</h4>
<div class='kontainer'>
<img alt='abalhafiz' src='http://i1108.photobucket.com/albums/h405/christian410/269111_225685127450056_100000257112719_900053_7432574_n.jpg'/>
Sobat sedang membaca artikel tentang <b><a expr:href='data:post.url'><data:post.title/></a></b>. Blog ini berisi berbagai artikel dari berbagai sumber yang menarik, bagi pengunjung diperbolehkan mengcopy paste artikel ini apabila bermanfaat, namun jangan lupa link dibawah ini sebagai sumbernya, Terima kasih!
<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='1'><a href="<data:post.url/>" target="_blank"><data:blog.pageName/></a></textarea>
<p><span style='float:right;font:italic 10px Georgia, Copse;'>
<a href='http://abalhafiz.blogspot.com/2012/03/cara-membuat-permalink-di-blog.html' target='_blank'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Permalink Abalhafiz -->
<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <b><data:post.author/></b> ~ Tips dan Trik Blogspot</h4>
<div class='kontainer'>
<img alt='abalhafiz' src='http://i1108.photobucket.com/albums/h405/christian410/269111_225685127450056_100000257112719_900053_7432574_n.jpg'/>
Sobat sedang membaca artikel tentang <b><a expr:href='data:post.url'><data:post.title/></a></b>. Blog ini berisi berbagai artikel dari berbagai sumber yang menarik, bagi pengunjung diperbolehkan mengcopy paste artikel ini apabila bermanfaat, namun jangan lupa link dibawah ini sebagai sumbernya, Terima kasih!
<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='1'><a href="<data:post.url/>" target="_blank"><data:blog.pageName/></a></textarea>
<p><span style='float:right;font:italic 10px Georgia, Copse;'>
<a href='http://abalhafiz.blogspot.com/2012/03/cara-membuat-permalink-di-blog.html' target='_blank'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Permalink Abalhafiz -->
5. Klik save dan lihat hasilnya.
Tambahan :
- Untuk edit warna latar bisa di edit di kode yang pertama, utak-atik kode warna bisa di photoshop
- Sesuaikan angka yang berwarna merah dengan ukuran template blog sobat ( ukuran textarea )