Blog Anda bisa lebih menarik dengan tambahan feature Related Post pada postingan blog seperti contoh ini.
Caranya gampang banget, ikut petunjuknya ya..
1. Bukalah blogger Anda
2. Pada pilihan Elemen Template. Lalu Pilit Edit HTML, jangan lupa centang Expand Template Widget jika menggunakan html lama....
3. Search kode <head> (Gunakan Ctrl+F untuk mempermudah pencarian), setelah Anda menemukannya, pastekan kode di bawah ini tepat di atas kode <head>
<!--Related Posts with thumbnails Start-->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #f2f2f2;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;width:100px;height:80px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;}
#related-title {color:#0033cc;text-align:center;padding: 0 5px;font-size:12px Arial; line-height:16px;text-shadow:0 2px 2px #fff;height:28px;width:100px;}
#related-posts .related_img:hover{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>
<!--Related Posts with thumbnails End-->
oh ya untuk related post ini disesuaikan untuk posting yang sudah diberi label.
0 komentar:
Posting Komentar