Cara Membuat Kotak Permalink di Bawah Posting Blog
Sudah pernah melihat kotak permalink, bukan? Salah satu elemen blog yang berfungsi untuk memberikan kemudahan bagi blog/web lain membuat tautan/linkback ke salah satu halaman posting blog; seperti yang saya sediakan di bawah posting-posting blog ini. Adanya kotak atau kolom permalink sangat membantu sobat dalam meningkatkan visibilitas dan traffic blog karena apabila ada blogger lain menyukai dan menganggap posting atau artikel blog sobat penting, maka dia dapat dengan mudah menemukan tag permalink di bawah artikel, meng-copy-nya, dan memasang/membaginya di blog; sehingga dia tidak perlu repot-repot membuat tag permalink sendiri. Jika sobat belum memiliki dan ingin membuat, silahkan ikuti tutorial menambahkan kotak permalink di bawah posting berikut.
Konsep dan Kode Kotak Permalink
Konsep yang saya gunakan adalah kotak permalink otomatis dengan memanfaatkan dua tag XML Blogger, yaitu <data:post.url/> untuk memanggil url posting yang sedang ditampilkan, dan <data:post.title/> untuk memanggil judul posting yang sedang ditampilkan, very easy! Permalink juga dilengkapi dengan tag link </a>. Kemudian permalink tersebut diletakkan pada textarea dengan memanfaatkan beberapa fungsi javascript sederhana. Dengan cara ini, semua isi kotak permalink tampil secara otomatis tanpa harus membuat isi secara manual dan dapat langsung digunakan.
Berikut kode-nya:
<div style='line-height:1.4em;padding: 1px; margin: 2px;background-color: #ffffff;font-size: 11px;text-align: justify'>
<span>Ganti teks ini dengan informasi mengenai permalink atau apapun di sini.</span><br />
<textarea cols='60' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='2' style='margin-top:3px;width:auto;'><a href="<data:post.url/>"><data:post.title/></a></textarea><br/>
</div><br />
Kostumisasi CSS:
Secara default saya menggunakan:
- background-color: #ffffff (putih), ganti #ffffff dengan kode warna lain sesuai dengan warna background posting blog.
- padding: 1px dan margin: 2px, ganti 1px dan 2px dengan nilai lain untuk menambah atau mengurangi padding dan margin.
- font-size: 11px, ganti dengan nilai lain untuk menambah/mengurangi ukuran huruf (pada text di atas kotak permalink).
Cara Memasang Kotak Permalink di Bawah Posting Blog
1. Copy kode di atas setelah melakukan kostumisasi, jika belum tahu apa yang harus dikostumisasi agar kotak permalink sesuai dengan desain blog, copy dulu saja.
2. Buka HTML editor blog, Dashboard > Template > Edit HTML.
3. Jangan lupa centang "Expand Widgets Template"
4. Cari <data:post.body/>. Bagi yang menggunakan readmore otomatis, akan ada lebih dari satu tag tersebut. Pada kebanyakan template, tag yang ditampilkan secara penuh adalah tag kedua. Jika tidak yakin, pilih dan coba dulu yang pertama, jika tidak bisa pilih tag sama yang kedua.
5. Letakkan kode kotak permalink tepat di bawah <data:post.body/>.
6. Save template.
Jika dipasang dengan benar, maka hasilnya akan tampak seperti ini:
Ganti teks ini dengan informasi mengenai permalink atau apapun di sini.
7. Cek hasilnya pada salah satu halaman posting dan lihat apakah dibutuhkan kostumisasi di bagian CSS seperti di atas.
Okay, itu dia langkah-langkah memasang kotak permalink di bawah posting Blogger. Semoga dulu sobat yang pernah menanyakan mengenai kotak permalink yang saya gunakan terpuaskan. And, have a nice blogging, guys!
Update:
Jika pada kasus tertentu anda mengalami kesulitan menampilkan permalink yang ikut tampil di halaman utama, itu karena pemasangan kode di data:post.body yang di bagian bawah readmore. Jika tidak tahu data:post.body yang mana yang tepat, gunakan ini (caranya sama persis dengan di atas):
© buka-rahasia.blogspot.com
Okay, itu dia langkah-langkah memasang kotak permalink di bawah posting Blogger. Semoga dulu sobat yang pernah menanyakan mengenai kotak permalink yang saya gunakan terpuaskan. And, have a nice blogging, guys!
Update:
Jika pada kasus tertentu anda mengalami kesulitan menampilkan permalink yang ikut tampil di halaman utama, itu karena pemasangan kode di data:post.body yang di bagian bawah readmore. Jika tidak tahu data:post.body yang mana yang tepat, gunakan ini (caranya sama persis dengan di atas):
<b:if cond='data:blog.pageType == "item"'>
Letakkan kode kotak permalink di sini
</b:if>
Cara Membuat Kotak Permalink di Bawah Posting Blog
Written by: Ahmad Khoirul Azmi
Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan codedi bawah atau share dengan sharing buttons di atas. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.
Written by: Ahmad Khoirul Azmi
Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan codedi bawah atau share dengan sharing buttons di atas. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.
Author:
wah... keren ya! coba dulu yah, tapi kayknya yang pantas masang permalink kayak gitu bagi yang blognya sudah tenar..... hiks jadi malu!
Bagus banget widgetnya nih mas bro. Ijin ngicpin ya mas.
Thanks sharingnya.
mas azmi,saya mau nanyak,,gimana ya caranya bikin rating anda writen di bawah postingan kayak mas azmi?ditunggu ya jawabannya,,,,
Bagus untuk dicoba,,,
layak dicoba karena lagi ikut lomba blog. Oh ya mo nanya nich... kenapa key word dalam artikel blogku tidak diindex oleh google. Yang diindex kok malah labelnya aja. Mohon informasinya.
Makasih tutorialnya
mantap..... :)
mas mau tanya, gimana cara buat link button
untuk cetak arikel blog? he...
thank you....
gan,makasi infonya ,berarti banget buat saya yang pemula ne,,
Info yang sangat bermanfaat... Terimakasih.. Salam ^^
Akhirnya dapat juga artikel yang dicari-cari dan dapatnya di tempat om Azmi.Maklum saya gak tau kata kuncinya.Terimakasih ya om Azmi,semoga semakin sukses terus dan makin mantap tautweb.com nya :)
Info bagus, gan. Slm kenal saja.
Numpang tanya Gan..
Kenapa ya di setiap belakang url blog saya suka ada kode? Itu apa ? Kode smacam ini #axzz1wbGR776A
contohnya http://www.nurhakim21.com/#axzz1wbGR776A
Gimana menghilangkannya
trimakasih telah berbagi.. salam kenal ya
masih belum ngerti betul fungsi nya om
padahal banyak yg bahas masalah permalink
maklum, newbie asli
baru taw nii sob,, aq coba nii..
kembali menyinggahi kawan,, tutorialnya keren2 bang.
sudah ane coba di blog ane Gan..
keren hasilnya..
tahanks infonya..
ijin nyoba mas :)
patut dicoba neeh... ^_^
mksh gan...
dapet juga di sini heheheheee.... terima kasih share nya gan,,, izin praktek,,, :)
thanks pencerahannya
sip...mantapzz
mampir ke blog ane : motivasi4life.blogspot.com
thanks gan infonya...
kerent broo
Wah Nice Info gan, jadi nambahin koleksi lagi nih :D
cara membuat permalink seperti blog buka-rahasia gmana mas? yg ada judulnya disamping kiri dan juga "Thanks for reading! Suka dengan artikel ini? " si samping kanan. ada tutorialnya mas?
terimakasih banyak atas infonya sobat
ditunggu kunjungan baliknya
langsung dicoba gan :D
permalink lumayan yaa buat nambah trafik
@Eckhart: Halo, itu adalah id blog yang ditandai karena mengandung adult content. Jadi ketika pengunjung masuk, dia tidak langsung ke homepage, tapi masuk dulu ke halaman agreement, menyetujui dan membuktikan dia sudah berusia legal untuk masuk ke halaman konten (dengan id). Ini sebenarnya masalah settings. Jika ingin ganti, masuk aja ke dashboard > settings. Kalo blog sobat mengandung konten demikian, sebaiknya jangan diganti.
Nyoba ah...........!! ijin gan..!!
sukses terpasang sob..
Aku coba pakai, ya Mas.... eh, biar warnanya gak putih dan mengikuti warna template blog kita pakai kode warna apa, ya, Mas? :)
postingan yang bagus dan sangat membantu, thanks alot mas bro.
kunjungi blog ssaya ya kawan,, :D http://www.holook.blogspot.com/
saya kok gak ada gan ...
bantuan gan... dan jika saya masukkan di bawah maka waktu di homenya permalinknya muncul juga, jadi jelek gan
aduh maaf gan lupa saya bahwa kode scrip tidak bisa di masukkan di kotak komentar, data post body saya gak ada gan, yang adanya cuma data post body penutup ( / )
iya gan. punya saya code.nya itu ga ada. heheh
gan kalau data post body-nya gak ada gimana ??
pencerahannya sangat di butuhkan.
@penggunacerdas dan kawan2 lain: data:post.body pasti ada, karena itu yang memuat konten post. Jangan lupa centang "expand widgets template" di pojok atas.
Kalo masih ada masalah dengan edit template simak ini dulu sebelum edit:
http://buka-rahasia.blogspot.com/2011/05/tips-edit-template-html-blogger-mudah.html
keren gan bisa di coba gan
kalau caranya buat permalink yg kayak punya agan gimana caranya
Nice info nya Gan
Mas, manfaatnya sama seperti "link to this post" atau "create a link" bukan?
klau ingin yang pakek blank gimana om?
pak setelah saya edit html terus saya ketik control+F buat search kode tapi kok gak ada ya pak? mohon solusinya pak. makasih.. ini blog sederhana saya mohon di cek http://psipil.blogspot.com
Kreatif ni
terima kasih atas tutorialnya, salam sukses...
thanks gan untuk tutorialnya..
sukses,,tenkyu gan...
TQ infonya mas Bro , Tipsnya berhasil semua nice Share lah...
mantaps nich infonya ngebantu ane banget bro! thanks :)
artikel dan posting yg menarik bro dan juga salam kenal dari mico batam islands dan sekalian bagi teman2 yg ingin download gratis film box office terbaru silakan kunjungi situsnya ok. thanks buat admin ini.makasi ya.
om ijin share scriptnya :D
< data : post . body > tidak ditemukan di html,ada yang salah dengan template blog saya?how?mohon pencerahannya www.mypatriotmuslim.blogspot.com
mantap infonya, oh ia, kl mau buat info yg dibawah postingan diatas permalink itu gmn cara buatnya? apa nmnya ya mas?
Trimakasih mas
http://effrycyber8.blogspot.com/
Mkasih ya tutornya mas Ahmad .. :D
#Blogwalking
maaf mas, saya malah gagal, permalinknya muncul di halaman blog di bawah posting setelah read more, kenapa ya? yang salah apa? oh ya gak ada mas yang ada www.alief7max.blogspot.com
Gunakan ini saja:
<b:if cond='data:blog.pageType == "item"'>
Letakkan kode permalink di atas di sini
</b:if>
cara meletakkannya sama seperti di atas.
maaf sekali lagi tanya, apa itu quot quot? kok banyak template blog baru yang menggunakan itu
& quote ; atau biasa disebut double quote adalah bahasa lain (ASCII) dari tanda kutip dobel ( " ), penggunaan ascii memudahkan browser dan engine suatu platform web untuk bisa membaca kode/script dengan lebih cepat dan tepat. Pada suatu kasus khusus, mesin Blogger tidak bisa membaca tag dan atribut html tertentu apabila ditulis apa adanya, maka penggunaan ASCII sangat dibutuhkan. Sebagai contoh, kode iklan adsense yang secara mentah dimasukkan ke dalam template Blogger, tidak dapat diparse oleh engine Blogger, sehingga iklan tidak tampil. Solusinya adalah dengan parsing dulu dengan HTML parser.
mas, sy pendatang baru di blog mas..
sy mau tanya mas...
sy berhasil pasang kotak permalink di bawah postingan, tp kok ada tulisan Proin tempor diatas kotak permalinknya mas..???
cara ngilanginnya gimana ???
kasih url blognya
sebenarnya fungsi dari kotak permalink ini banyak sekali..
tergantung kita saja mau digunakan dalam konten apa...
sukses buat mas khoirul...
Mantap mas broo artikelnya sangat bermanfaat, buat blogger pemula kyk saya :D
Post a Comment