Mengedit Related Post linkwithin menjadi lebih keren

Memasang related post memang sangat penting dalam meningkatkan trafik blog. Menurut saya related post list view agak membosankan atau dapat saya katakan tidak menarik perhatian saya untuk melihatnya. Related post yang menarik perhatian pengunjung tentulah disertai gambar yang menarik.

Memang banyak cara untuk membuat related post dengan gambar, tetapi kebanyakan dari itu tidak memunculkan judul postingan secara keseluruhan ( judulnya kepotong .... ). Itu sama sekali tidak menarik dan tidak akan menarik minat pengunjung.

Pernah mendengar Linkwithin? ya itulah nama sebuah penyaji jasa related post gratis. Di linkwithin judul postnya muncul secara keseluruhan, tidak kepotong. Tetapi sayangnya, namanya juga gratisan pasti desainnya jelek dan ada nama linkwithin dipojok kanan bawah. Nah untuk memperbaiki desain linkwithin yang telihat sederhana, anda dapat mengikuti tips-tips dari saya. Jika anda tertarik, marilah ikuti step by stepnya:

Sebelum mengikuti tips dibawah, jika anda belum tahu cara memasang widget linkwithin. Baca dulu artikel ini.

Apply CSS To Change Look

1. Log in to your blogger account.

2. Masuk ke Template. > Edit HTML.

3. Letakan kode dibawah ini tepat diatas kode ]]></b:skin>

/*---Related Posts---*/#linkwithin_logolink_0 {display:none!important;}#lws_0 {clear: both!important; margin: 0 0 20px 0!important; }

.linkwithin_outer { margin: 1px 0px !important; background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirlvBHD0riVZiOGccFcJWZKybO5aLn8CDVEfL2aJ-VJvk-ZPWoxpwHplhRO2-3zL-Y9-dmKhDP9oZsasuQGc65CwvBivtszrRbaFOV2Sg31GMXLTHQyR6lS7E1SRpdx_NzeH80NjgYgEc/s400/mbt-related-posts.gif") repeat scroll rgb(42, 42, 42); height: 260px; width:590px!important; padding: 0px !important; box-shadow: 0px 4px 4px -4px rgba(0, 0, 0, 0.7) !important; border-radius: 5px 5px 5px 5px; }

Related:Cara Mengganti Bullet dan Numbering list pada blog

.linkwithin_inner {width:590px!important;}

.linkwithin_text {margin: 0px !important; padding: 10px !important; font-family: "Droid Sans",Helvetica,Arial,sans-serif; font-size: 1.35em; color: rgb(255, 255, 255); font-weight: 700; line-height: 1.35em; text-transform: capitalize; background-color: rgb(18, 18, 18); border-bottom: 1px solid rgb(0, 0, 0); border-top-right-radius: 5px; border-top-left-radius: 5px; background-image: -moz-linear-gradient(center top , rgb(36, 36, 36), rgb(18, 18, 18));}.linkwithin_posts a { border-right:0px!important; margin: 10px 0px 10px 20px !important;}

.linkwithin_posts a:hover { border-right:0px!important; margin: 10px 0px 10px 20px !important; background:none!important;}#linkwithin_logo_0 {display:none;}.linkwithin_img_0 { border: 1px solid #666 !important; padding: 1px !important; width: 100px !important; height: 70px !important; margin-right: 20px !important; overflow: hidden; background:#666!important;}.linkwithin_img_0:hover { border: 1px solid #666!important;opacity:0.8;}.linkwithin_img_0 div { width: 100px !important; height: 70px !important;}.linkwithin_title { color: rgb(255, 255, 255) !important; font-size: 1.1em !important; display: block; padding: 0px 10px 0px 0px !important; font-weight: 700 !important; line-height: 1.45em !important; margin-top: 10px !important; font-family: "Droid Sans",Helvetica,Arial,sans-serif !important; text-decoration:none!important; width:120px!important;}.linkwithin_title:hover {text-decoration:underline!important;}

4. Save your template.

Last Words

Bagaimana? sangat mudah sekali bukan? Sekarang related post linkwithin anda menjadi pro. maksudnya tanpa credit dan dengan desain keren. Sekian post tentang Mengedit Related Post linkwithin menjadi lebih keren. Jangan lupa membaca post saya yang lainnya dengan membaca DAFTAR ISI. Maaf bila ada salah-salah kata dan semoga tulisan ini dapat bermanfaat bagi anda :)

Mengedit Related Post linkwithin menjadi lebih keren

Apply CSS To Change Look

Last Words

Related Posts

Popular Posts

Label

Cari

Donasi

Artikel Pilihan