Thursday, April 6, 2017

Cara Mudah Memasang Related Artikel dengan Thumbnail di Blogspot

Posted by with 2 comments
Untuk kalian yang newbie banget dengan blog, Molzania punya cara mudah untuk memasang widget Related Artikel dengan Thumbnail di Blogspot. Selama ini Molzania sangat kesulitan dalam mencari cara untuk memasang widget artikel related seperti yang kalian temukan pada bagian bawah blog ini. Kebanyakan artikel di google itu kita harus ubek-ubek html blogspot. Cara seperti ini mengandung banyak resiko. Salah satunya tampilan blog kita akan menjadi kacau bila kita salah menempatkan javascript.

Contoh Widget Related Artikel di Laman Molzania.com
Cara yang akan Molzania tunjukkan berikut ini sangatlah mudah. Kamu hanya tinggal menambahkan widget seperti biasa, tanpa harus mengubah apapun di dalam html blog. Cara ini sudah Molzania terapkan sendiri pada blog ini. Makanya kamu nggak usah khawatir akan takut gagal atau hasilnya tidak seperti yang sobat harapkan.

Sebelumnya kamu harus mengunjungi terlebih dahulu LinkWithIn. Disana kamu tinggal mengisi beberapa hal sesuai dengan identitas blog sobat. Tertera alamat email, url dan jenis platform blog sobat, dan berapa related artikel yang kalian inginkan untuk blog sobat. Beri tanda centang jika sekiranya background blog kalian berwarna gelap. Lalu terakhir klik Get Widget.

Laman Situs LinkWithIn
Lalu langkah selanjutnya tinggal tempatkan widget ke layout blog yang kamu suka. Misalnya blog Molzania.com menempatkan widget related artikel di bawah postingan blog. Maka widget artikel related pun hadir di bagian bawah postinganmu. Gimana? Mudah bukan? Tampilan blogmu akan cantik seperti gambar diatas.

Batas maksimal related article yang bisa dimasukkan hanya 5 buah. Itulah kekurangan dari situs LinkWithIn. Tapi bagi Molzania sih empat sudah cukuplah ya. Kalau kebanyakan kurang cantik nanti blognya. Oh ya jangan lupa menambahkan <center> di dalam menuliskan script html di dalam jendela widget blognya ya. Itu biar widget related articlenya rata ketengah. Nggak melenceng ke kiri atau ke kanan. Penulisannya cukup <center> itu saja kok. Tepat pada bagian awal script. Nanti blognya sendiri yang akan menyesuaikan.

Langkah Memasukkan Widget Related Artikel di Blogspot via LinkWithIn
Bila kamu menggunakan situs homepage seperti halaman pertama atau home Molzania.com, akan butuh sedikit penyesuaian lagi. Mau nggak mau kamu diharuskan merombak sedikit html blog kamu. Kalau tidak, maka tampilan homepage kamu akan kacau balau. Tidak akan terlihat cantik nantinya.

Caranya mudah kok. Hanya butuh menambahkan beberapa penyesuaian. temukan terlebih dahulu widget LinkWithIn di laman html blog kamu. Ingat, kamu harus menemukan widgetnya secara manual ya. Karena blogspot saat ini tak lagi mendukung pilihan Expand Widget Template. Untuk kasus blog Molzania, widget LinkWithIn ada di widget HTML16.
Langkah 2 Memasukkan Widget Related Artikel di Blogspot via LinkWithIn
Setelah kalian menemukan widget LinkWithIn di html blog kalian. Berikutnya kalian harus menambahkan dua kode javascript: <b:if cond='data:blog.pageType == &quot;item&quot;'> dan </b:if> berikut di masing-masing tempat seperti yang ditunjukkan pada gambar di bawah ini. Kode ini biasanya terselip diantara kode seperti ini:  <b:includable id='main'>...</b:includable> pada widget LinkWithIn. 

Berikut contoh penulisan javascript pada widget Related Article via LinkWithIn: (silahkan klik gambar berikut untuk memperbesar gambar agar kelihatan dengan jelas)

Langkah 3 Memasukkan Widget Related Artikel di Blogspot via LinkWithIn
Langkah terakhir klik preview template untuk memastikan tampilan blogmu agar sesuai dengan yang diinginkan. Lalu klik save dan lihat apakah ada kode yang error. Jika terdapat error, perhatikan lagi tulisan kode javascriptmu apakah ada salah penulisan huruf atau tidak. Bila sudah bisa disimpan, maka tadaa! blogmu akan mendapatkan konten related article yang hanya akan tampil pada laman postingan atau artikel. Selamat mencoba! Semoga bisa membantu. Sekian tutorial blog dari Molzania. Salam hangat! ^_^

2 comments :

Sharing is caring ! Give your comment here please :

Related Posts Plugin for WordPress, Blogger...