Nah, kemarin kan ane dah pasang Related Post dengan Thumbnails Sekarang ane mau postingin Recent Post nih. Nah untuk lihat demonya, sobat bisa lihat pada sidebar kanan, atau lihat pada gambar disamping. Ni akan menampilkan semua postingan secara slide satu persatu.
Gimana....
Ni scriptnya :
<style type="text/css">
.gfg-root { width: auto; height: auto; position: relative; overflow: hidden; text-align: center; font-family: verdana, sans-serif;font-size: 12px;padding:2px; background:none;border: 0px solid #363636;}
.gfg-title {font-size: 16px;font-weight : bold;color : #fff;background-color: none;line-height : 1.4em;overflow: hidden;white-space : nowrap;}
.gfg-subtitle {font-size: 14px;font-weight: bold;color: #333;background-color: none;line-height : 1.4em; overflow : hidden;white-space : nowrap;margin-bottom : 0px;}
.gfg-subtitle a {color : #a43434;display:none !important;}
.gfg-entry {background-color: none;width : 100%;height : 9.9em;position : relative;overflow : hidden;text-align : left;margin-top : 0px;}
/* To allow correct behavior for overlay */
.gfg-root .gfg-entry .gf-result {position : relative;background-color:none;width : auto;height : 100%;padding-left : 5px;padding-right : 5px;}
.gfg-list {position : relative;overflow : hidden;text-align : left; margin-bottom : 15px;display:none !important;}
.gfg-root .gfg-entry .gf-result .gf-title {font-size: 13px;display:block;color:#a43434;font-weight:bold;line-height: 1.2em;overflow : hidden;white-space : nowrap;text-overflow : ellipsis;-o-text-overflow : ellipsis;margin-top : 4px;}
.gfg-root .gfg-entry .gf-result .gf-snippet {line-height : 1.3em;color: #333;margin-top : 3px;font-size: 12px;}
.clearFloat {clear : both;}
#feedGadget { margin-top: 3px;margin-left: auto;margin-right: auto;width: auto;font-family:verdana, arial;font-size: 10px;color: #333;}
</style>
<script src="http://www.google.com/jsapi/?key=ABQIAAAAcV2jSs52yGHKNXjYTcwvNBQjGizh_00DUHOFTBoYdXcXzGgaZxRGIm148GyVsULR8I1--uCF7hoW2w" type="text/javascript"></script> <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script> <script type="text/javascript"> function showGadget() { var feeds = [ {title:'title', url:'http://url-blog-sobat.com/feeds/posts/default?redirect=false&start-index=1&max-results=999'}, ]; new GFdynamicFeedControl(feeds, 'feedGadget', {numResults : 1000, stacked : true, title: " "}); } google.load("feeds", "1"); google.setOnLoadCallback(showGadget); </script> <div id="feedGadget"><center>Loading....</div>
Untuk Pemasanganya, Terserah sobat. Mau di pasang pada Add Gadget atau Edit Html.
Ni stepnya untuk Add Gadget :
- Login ke akun blog sobat.
- Pilih Rancangan, Add Gadget.
- Pilih Html/JavaScript.
- Copy Pastekan Script diatas kedalam add gadged
- Klik simpan dan simpan template.
Untuk stepn pemasangan pada Edit html :
- login ke akun blog sobat.
- Pilih Rancangan, edit Html.
- Copy Pastekan Kedalam Html Sobat, dengan ketentuhan harus di dalam tag <body>.
- Simpan template sobat dan lihat blog
Gimana......
Sobat juga bisa mengedit atau mengubah sesuai dengan keinginan sobat. Ok teruslah berkreasi dan tetap bersemangat.
Catatan : Silahkan sobat ganti url feeds-nya pada script tersebut.
http://url-blog-sobat.com/feeds/posts/default
Judul :
Membuat Recent Post Slide Keren
Rating : 4.5
Ditulis Oleh : sy@ms
Rating : 4.5
Ditulis Oleh : sy@ms
Jika mengutip harap berikan link yang menuju ke artikel Membuat Recent Post Slide Keren ini. Sesama blogger mari saling menghargai. Terima kasih atas perhatiannya
Copyright © 2011.
agan klo mw naro text dimana gan???
BalasHapusSalam kenal sob......
BalasHapusMaksud sobat untuk menambah text seperti apa....?
Kalau text judul atau pesan-pesan sobat bisa tambahkan tag
<div>
isi text disini
<hr /> untuk garis mendatar
taruh script recent post disini
<div>
ok, sobat semoga membantu..