Sitemap

Selasa, 19 Juni 2012

Cara Membuat Artikel Terkait Related Post Thumbnail Vertikal Blogger

Setelah Membuat Blog tentu dilanjutkan dengan membuat artikel berkualitas agar sebuah blog hidup dengan penuh informasi dan juga menghiasi blog dengan berbagai cara dengan tujuan agar blog lebih indah dan juga antara artikel yang telah dibuat satu sama lain agar saling terhubung sehingga tercapai tujuan bahwa sebuah artikel akan terjangkau oleh pengunjung.

Akan dibahas pada kali ini yaitu Cara Membuat Artikel Terkait Related Post Thumbnail Vertikal yang dimana biasanya ditemui artikel terkait yang simple dan juga sudah ada juga related post dengan thumbnail namun nampak seperti linkwithin yang gambar diatas lalu text dibawah, sedangkan pada kesempatan ini mencoba memberikan membuat Related Post dengan disisi kiri Thumbnail gambar yang secara otomatis ditampilkan menyesuaikan dengan ukuran yang bisa diseting diikuti teks Vertikal kekanan.

Baiklah untuk tampilan Artikel Terkait atau Related Post yang akan tampil di akhir halaman posting artikel seperti pada gambar berikut ini :


Gambar tersebut juga telah di aplikasikan atau dipakai pada weblog web id ini karena tampilan yang menarik dimana artikel terkait dengan thumbnail disertai keterangan dari artikel yang bersangkutan dengan susunan yang tepat. Lalu bagaimana Cara Membuat Artikel Terkait atau Related Post Thumbnail seperti gambar diatas ?

Berikut langkah-langkah mudah dalam membuat Related Post Thumbnail Vertikal, yaitu :

1. Log In ke Dashboard Blogger
Pertama kunjungi blogger.com lalu log in ke Dashboard > Template/Rancangan > Edit HTML lalu centang pada "Expand Widget Templates".
Note : Jangan lupa backup template dengan cara dowbload template lama agar bila terjadi kesalahan dapat dikembalikan kesemula.

2. Memasukkan Code CSS/Style Sheet pada HTML Blogger
Silahkan cari code </head> dengan menggunakan button "Ctrl + F". setelah ketemu kode tersebut silahkan copy dan paste  "Copy All" code dibawah diatas code </head>

#main-wrapper {width: 520px;} : bisa disesuikan dengan lebar kolom body halaman posting

3. Langkah terakhir adalah untuk menampilkan Related Post pada setiap halaman posting.
Silahkan cari code <data:post.body/> dan bila sudah ketemu, silahkan masukkan code dibawah ini dengan cara copy dan paste "Copy All" code dibawah setelah code <data:post.body/>


Weblog Artikel Terkait : bisa dirubah sesuai keinginan 

Cukup mudah bukan dalam Membuat Artikel Terkait Thumbnail Vertikal di Blogger, cukup copas 2 code diatas pada tempat yang tepat maka related post dengan tampilan menarik dapat disajikan pada blog kesayangan.


Dengan memasukan alamat email dibawah ini, berarti anda akan dapat kiriman artikel terbaru dari www.WebLog.web.id di inbox anda:


4 komentar:

  1. Saya coba praktekan dulu, ya bro.. trims.. Salam dari masarkandas

    BalasHapus
    Balasan
    1. Silahkan dipraktekan cara membuat artikel terkait dengan tampilan yang menarik :)

      Hapus
  2. yang bergini yang bagus :D like

    BalasHapus
    Balasan
    1. Yup, moga bisa digunakan dengan baik

      Hapus