Biasanya para blogger akan menambahkan aplikasi atau widget khusus untuk menambah daya tarik tampilan blognya. Salah satu cara yang bisa dilakukan oleh para blogger untuk mempercantik halaman blog mereka adalah membuat dan memasang kotak permalink keren di blog atau tepatnya di bawah artikel/postingan blog.
Apa yang dimaksud dengan kotak permalink? Kotak permalink adalah kotak khusus yang berisi url atau link permanen/tetap/tak bisa diubah dari suatu artikel/posting/tulisan yang ada di suatu blog. Tujuan memasang kotak permalink selain untuk menambah keindahan blog adalah memudahkan pengunjung blog mengetahui atau bisa juga meng-copy paste artikel yang sedang mereka baca. Jadi, tidak heran jika semakin banyak blogger yang memasang kotak permalink tersebut tidak terkecuali blog ini.
Pada kesempatan kali ini saya mau berbagi cara untuk membuat dan memasang kotak permalink yang keren di bawah posting blog supaya teman-teman yang belum tahu caranya bisa memasang sendiri di blog masing-masing. Silakan simak caranya di bawah ini:
Buka blog sobat masing-masing.
Klik tulisan template dan kemudian klik tulisan edit HTML.
Cari kode dan letakkan kode script berikut ini tepat di atasnya:
.admin-tulisan{ width:auto; background:#98F013; border:3px solid #1014EB; margin:30px 0 10px 0; display:block; font-family:"Times New Roman"; color:#FF0000; }
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4 a{color:#FF0000;}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{ background:#FF00EF; border:none; border-bottom:3px solid #FFEF00; color:#FFFF00; font-family:"Times New Roman"; 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:#FF0000;}
.admin-tulisan img{ background:#000000; width:90px; height:100px; border:2px solid #FF0009; margin:3px 10px 0 0; float:left; padding:2px; box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none; }
Setelah itu, silakan cari lagi kode dan letakkan kode script berikut ini tepat di bawahnya:
<!-- Oke-Reload -->
<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan' style='text-align:center'>
<h4>Diposting Oleh : <b><data:post.author/></b> ~ PENGEMBARA BIRU</h4>
<div class='kontainer' style='text-align:justify'>
<img alt='Oke-Reload' src='http://images.cooltext.com/3035040.gif'/>
Sekarang Anda sedang membaca artikel tentang: <b><a expr:href='data:post.url'><data:post.title/></a></b>. Silakan saja copy dan paste atau sebarluaskan artikel ini jika dinilai bermanfaat tetapi saya harapkan agar Anda jangan sampai lupa untuk menyertakan link aktif artikelnya di bawah ini:
<textarea cols='58' 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>Terima kasih atas perhatian dan kunjungan Anda
<p><span style='float:right;font:bold 12px Arial, Sans-Serif;'>
<a href='http://pengembarabiru.blogspot.com/2013/07/cara-mudah-membuat-dan-memasang-kotak.html' target='_blank'>*** Dapatkan Widget Ini ***</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Oke-Reload -->
<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan' style='text-align:center'>
<h4>Diposting Oleh : <b><data:post.author/></b> ~ PENGEMBARA BIRU</h4>
<div class='kontainer' style='text-align:justify'>
<img alt='Oke-Reload' src='http://images.cooltext.com/3035040.gif'/>
Sekarang Anda sedang membaca artikel tentang: <b><a expr:href='data:post.url'><data:post.title/></a></b>. Silakan saja copy dan paste atau sebarluaskan artikel ini jika dinilai bermanfaat tetapi saya harapkan agar Anda jangan sampai lupa untuk menyertakan link aktif artikelnya di bawah ini:
<textarea cols='58' 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>Terima kasih atas perhatian dan kunjungan Anda
<p><span style='float:right;font:bold 12px Arial, Sans-Serif;'>
<a href='http://pengembarabiru.blogspot.com/2013/07/cara-mudah-membuat-dan-memasang-kotak.html' target='_blank'>*** Dapatkan Widget Ini ***</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Oke-Reload -->
Keterangan:
Ganti tulisan dengan kata-kata sobat.
Ganti url gambar dengan url gambar sobat.
Setelah selesai, silakan klik tulisan simpan template dan coba lihat perubahan pada halaman blog sobat. Jika tidak berhasil, coba perhatikan lagi langkah-langkah di atas dengan teliti karena siapa tahu masih ada yang terlewat atau belum pas meletakkan kodenya.
Demikianlah cara mudah membuat dan memasang kotak permalink keren seperti yang ada di blog saya ini. Semoga sobat sekalian berhasil memasangnya.
No comments:
Post a Comment