Hay sobat B88S Cara Membuat Slider Ala Yahoo postingan yang akan saya shere sekarang. Alhamdulillah postingan yang
berbeda akan saya bagikan lagi. Tapi masih dalam konteks Tutorial
Blogging. Tepatkan tutorial kali ini saya beri judul Cara Membuat Slider
Ala Yahoo. Kenapa Ala Yahoo, karena pada kesempatan kali ini saya akan
membagikan tutorial slider ala yahoo, cek saja di id.yahoo.co.id.
Cara ini di atas latest post atau postingan terbaru di kontent blog / web.
Kira-kira gambarnya seperti berikut.
Pertama :
Login ke Akun blogger Anda
Kedua :
Tempatkan kode berikut sebelum kode ]]><b:skin>
/* Yahoo Slider Wrapper
----------------------------------------------- */
div.jqans-wrapper {-x-system-font:none;font-family:arial,helvetica,clean,sans-serif;font-size:12px;font-size-adjust:none;font-stretch:normal;font-style:normal;font-variant:normal;font-weight:normal;line-height:1.231;color:#666666;}
div.jqans-wrapperimg {border: 0;}
div.jqans-wrapperul,div.jqans-wrapper li,div.jqans-wrapper h1,div.jqans-wrapper p {list-style:none;margin: 0;padding: 0;}
div.jqans-wrapper {list-style:none;position: relative;overflow: hidden;}
div.jqans-wrapperul {position: relative;left: 0;width: auto;list-style-type: none;overflow: hidden;z-index: 1;}
div.jqans-wrapper li {list-style:none;float: left;display: inline;}
/* Yahoo Slider Content
----------------------------------------------- */
div.jqans-wrapper.default .jqans-stories ul, div.jqans-wrapper.default .jqans-stories li {height: 110px;}
div.jqans-wrapper.default .jqans-stories-selector ul, div.jqans-wrapper.default .jqans-stories-selector li {height: 10px;}
div.jqans-wrapper.default, div.jqans-wrapper.default .jqans-container {width: 458px;background:#fff;}
div.jqans-wrapper.default li {width: 115px;}
div.jqans-wrapper.default a {text-decoration: none;font-weight: normal;color: #363636;outline: none;}
div.jqans-wrapper.default strong {color: #000;}
/* wrapper */
div.jqans-wrapper.default {border: 1px solid #ccc;border-width: 1px 1px 0 1px;margin: 0 0 0.5em;}
/* container */
div.jqans-wrapper.default .jqans-container {min-height: 270px;text-align: center;padding-top: 4px;}
div.jqans-wrapper.default .jqans-container a {font-weight: bold;color:#000;}
div.jqans-wrapper.default .jqans-container img {width:438px;height:210px;}
/* headline */
div.jqans-wrapper.default .jqans-headline {text-align: left;margin-left:10px;margin-bottom: 4px;font:normal 13px Arial;}
div.jqans-wrapper.default .jqans-content h1 {text-align:left;color:#16387c;margin: 1px 9px;font:bold 18px Arial;letter-spacing:-.0001em;line-height:1.1em; height:22px;overflow:hidden;}
div.jqans-wrapper.default .jqans-content p {text-align: left;color: #333;margin: 1px 9px;font:normal 12px Arial;line-height:1.3em;height:30px;overflow:hidden;}
/* stories */
div.jqans-wrapper.default .jqans-stories {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQO0kSsosXtZwaNiFalucBBKXz4dV59BJ10a0LtG7KWICxNwAg6uOjwOTHg208W25ryfXVm5KQtH4T2WhzHRBqzwV-lFGstTfX6ZqnwtrswbG9v8gb9aXUHjBAaoYZJNiQT15x_3I0NPM/s1600/bg_stories.gif);background-repeat: repeat-x;background-position: top left;}
div.jqans-wrapper.default .jqans-stories li {overflow: hidden;text-align: center;font-size: 11px;color: #fff;line-height:1.2em;}
div.jqans-wrapper.default .jqans-stories li.selected {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfijLv6MQFquOeQ_05zR6lWNdLKTzORJg7lPDtLAnmur0QI-_A2tFcIT1Dpnb14uNkVXD27Yw6QDtSe5YFmOG9NnF3nBLCBSmhhUYLgnKKqu0FSaCqC8gX4wavmaSUQZam0pPG7uCb_QI/s1600/bg_selected.gif);background-repeat: no-repeat;background-position: top center;}
div.jqans-wrapper.default .jqans-stories li.selected a {color:#fff;}
div.jqans-wrapper.default .jqans-stories li img {margin-top: 22px;width:100px; height:52px;border-right:1px solid #fff;border-bottom:1px solid #fff;border-left:1px solid #555;border-top:1px solid #555;}
div.jqans-wrapper.default .jqans-stories li p {display: none;}
div.jqans-wrapper.default .jqans-stories li h3 {margin:0;padding:1px 10px;color:#000;
font-size:11px;font-weight:normal;font-family:Arial;height:28px;overflow:hidden;line-height:1.2em;}
div.jqans-wrapper.default .jqans-stories-selector li.selected div {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfijLv6MQFquOeQ_05zR6lWNdLKTzORJg7lPDtLAnmur0QI-_A2tFcIT1Dpnb14uNkVXD27Yw6QDtSe5YFmOG9NnF3nBLCBSmhhUYLgnKKqu0FSaCqC8gX4wavmaSUQZam0pPG7uCb_QI/s1600/bg_selected.gif);background-repeat: no-repeat;background-position: top center;}
/* pagination */
div.jqans-wrapper.default .jqans-pagination {border: 1px solid #ccc;border-width: 1px 0;margin: 0;padding: 4px 4px4px 4px;background: #f2f2f2;text-align: left;clear: both;width: 448px;overflow: hidden;}
div.jqans-wrapper.default .jqans-pagination-count {float: left;font:normal 11px Arial;color:#666;}
div.jqans-wrapper.default .jqans-pagination-controls {float: right;}
div.jqans-wrapper.default .jqans-pagination-controls a {display: inline-block;width: 22px;height: 13px;text-indent: -9999px;background: no-repeat bottom center;*float:left;}
div.jqans-wrapper.default .jqans-pagination-controls-back a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG-oNV-skluiTLiVpgtk5Q1KfHY8z1g193WZ2zHlrgF3WEu8hbG3AIPU2_IsAr5z8jWBfLXsZ2S4ZS6tJpJATQewxml9pSxRSWphya88fl9uZMLqx02JncM4P4CEsgawzwrp-7AihIQW0/s1600/previous.gif);}
div.jqans-wrapper.default .jqans-pagination-controls-next a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhURhvnYF9NsSSTedh2E969zuNDri60uXSaVWEdysqpo0QalXGnevIoyBxDAkq9OGdemfqqSu6_oCZFimoojAPPN2hWfnBWMU8tCTow3NkDoZFu1eAcC2bhwy6Y9FfhowPrOBMfG_1H-L8/s1600/next.gif);}
/* Slide Content
----------------------------------------------- */
.slide-wrapper {padding:0 auto;margin:0 auto;width:auto;float: left;
word-wrap: break-word; overflow: hidden;}
.slide {color: #666666;line-height: 1.3em;}
.slide ul {list-style:none;margin:0 0 0;padding:0 0 0;}
.slide li {margin:0;padding-top:0;
padding-right:0;padding-bottom:.25em;
padding-left:0px;text-indent:0px;line-height:1.3em;}
.slide .widget {margin:0px 0px 6px 0px;}
Letakkan kode berikut sebelum kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js'/>
<script type='text/javascript'>
//<![CDATA[
(function(a){a.fn.accessNews=function(b){var c={title:"HARI INI -",subtitle:"<span id='clock'/>",slideBy:4,speed:"normal",slideShowInterval:3000,slideShowDelay:3000,theme:"default",continuousPaging:true,contentTitle:"h3",contentSubTitle:"abbr",contentDescription:"p",onLoad:null,onComplete:null};return this.each(function(){b=jQuery.extend(c,b);var k=jQuery(this);var h=k.children();vari;varj;varf;var e={_wrapper:'<div class="jqans-wrapper '+b.theme+'"></div>',_container:'<div class="jqans-container"></div>',_headline:jQuery("<div class='jqans-headline'></div>").html(["<p><strong>",b.title,"</strong> ",b.subtitle,"</p>"].join("")),_content:jQuery("<div class='jqans-content'></div>"),_stories:'<div class="jqans-stories"></div>',_first:jQuery(h[0]),init:function(){if(b.onLoad){b.onLoad.call(a(this))}k.wrap(this._wrapper);k.before(this._container);var l=(h.length*this._first.outerWidth(true));k.css("width",l);if(b.title.length){this.append(this._headline)}this.append(this._content);this.selector(l);this.set(0);d.init();g.init();k.wrap(this._stories);if(b.onComplete){b.onComplete.call(a(this))}},selector:function(n){var m="";for(var l=1;l<=h.length;l++){m+="<li><div/></li>"}var p=jQuery('<div class="jqans-stories-selector"></div>');p.append("<ul>"+m+"</ul>");j=jQuery(p.find("ul"));f=j.children();p.css("width",n);k.before(p)},append:function(l){this.get().append(l)},get:function(){return k.parents("div.jqans-wrapper").find("div.jqans-container")},set:function(n){var o=this.get();var r=jQuery(h[n]);var m=jQuery(f[n]);var q=jQuery("div.jqans-content",o);var p=jQuery("<img></img>");var l=jQuery("<div></div>");var s=jQuery(b.contentTitle+" a",r).attr("title")||jQuery(b.contentTitle,r).text();p.attr("src",jQuery("img",r).attr("longdesc")||jQuery("img",r).attr("src"));l.html("<h1>"+s+"</h1><p>"+jQuery(b.contentDescription,r).html()+"</p>");q.empty();q.append(p);q.append(l);h.removeClass("selected");r.addClass("selected");f.removeClass("selected");m.addClass("selected")}};var d={loaded:false,_animating:false,_totalPages:0,_currentPage:1,_storyWidth:0,_slideByWidth:0,init:function(){if(h.length>b.slideBy){this._totalPages=Math.ceil(h.length/b.slideBy);this._storyWidth=jQuery(h[0]).outerWidth(true);this._slideByWidth=this._storyWidth*b.slideBy;this.draw();this.loaded=true}},draw:function(){var n=jQuery('<div class="jqans-pagination"></div>').html(['<div class="jqans-pagination-count"><span class="jqans-pagination-count-start">1</span> - <span class="jqans-pagination-count-end">',b.slideBy,'</span> of <span class="jqans-pagination-count-total">',h.length,'</span><strong>News Pagination</strong></div><div class="jqans-pagination-controls"><span class="jqans-pagination-controls-back"><a href="#" title="Back"><< Back</a></span><span class="jqans-pagination-controls-next"><a href="#" title="Next">Next >></a></span></div>'].join(""));k.after(n);var m=jQuery(".jqans-pagination-controls-next >a",n);var l=jQuery(".jqans-pagination-controls-back >a",n);m.click(function(){var o=d._currentPage+1;d.to(o);return false});l.click(function(){var o=d._currentPage-1;d.to(o);return false})},to:function(p){if(this._animating){return}this._animating=true;var q=k.parent("div").next(".jqans-pagination");var l=jQuery(".jqans-pagination-count-start",q);var s=jQuery(".jqans-pagination-count-end",q);if(p>this._totalPages){p=b.continuousPaging?1:this._totalPages}if(p<1){p=b.continuousPaging?this._totalPages:1}var r=(p*b.slideBy)-b.slideBy;var n=(p*b.slideBy);if(n>h.length){n=h.length}var o=parseInt(k.css("left"));var m=(p*this._slideByWidth)-this._slideByWidth;l.html(r+1);s.html(n);o=(m*-1);k.animate({left:o},b.speed);j.animate({left:o},b.speed);e.set(r);this._currentPage=p;this._animating=false}};var g={init:function(){this.attach();this.off();i=setTimeout(function(){g.on()},b.slideShowDelay)},on:function(){this.off();i=setInterval(function(){g.slide()},b.slideShowInterval)},off:function(){clearInterval(i)},slide:function(){var o=jQuery("li.selected",k);var m=o.next("li");var n=0;if(!m.length){m=jQuery(h[0]);n=1}var p=h.index(m);if(d.loaded){var l=(p)%b.slideBy;if(l===0){n=(Math.ceil(p/b.slideBy))+1}if(n>0){d.to(n)}}e.set(p)},attach:function(){var l=jQuery(k).parent("div.jqans-wrapper");l.hover(function(){g.off()},function(){g.on()})}};e.init();h.hover(function(){e.set(h.index(this))},function(){})})}})(jQuery);
//]]>
</script>
<script type='text/javascript'>
// when the DOM is ready, convert the feed anchors into feed content
jQuery(document).ready(function() {
jQuery('#newsslider').accessNews({
});
jQuery('#newsslider2').accessNews({
title :"BREAKING NEWS:",
subtitle:"stories from the internet",
speed :"slow",
slideBy : 4,
slideShowInterval: 100000,
slideShowDelay: 100000
});
});
</script>
<script type='text/javascript'>
/* <![CDATA[ */
jQuery.noConflict();jQuery(function(){jQuery("ul.menu-primary").superfish({animation:{opacity:"show"},autoArrows:true,dropShadows:false,speed:200,delay:800})});jQuery(function(){jQuery("ul.menu-secondary").superfish({animation:{opacity:"show"},autoArrows:true,dropShadows:false,speed:200,delay:800})});jQuery(document).ready(function(){jQuery(".fp-slides").cycle({fx:"fade",timeout:4000,delay:0,speed:400,next:".fp-next",prev:".fp-prev",pager:".fp-pager",continuous:0,sync:1,pause:1,pauseOnPagerHover:1,cleartype:true,cleartypeNoBg:true})});
/* ]]> */
</script>
<script type='text/javascript'>
//<![CDATA[
vardayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");var montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December");function getthedate(){var a=new Date();var g=a.getYear();if(g<1000){g+=1900}var h=a.getDay();var e=a.getMonth();var b=a.getDate();if(b<10){b="0"+b}vari=a.getHours();var c=a.getMinutes();var j=a.getSeconds();var d="AM";if(i>=12){d="PM"}if(i>12){i=i-12}if(i==0){i=12}if(c<=9){c="0"+c}if(j<=9){j="0"+j}var f="<font color='666666' face='Arial'>"+dayarray[h]+", "+montharray[e]+" "+b+", "+g+" "+i+":"+c+":"+j+" "+d+"</font>";if(document.all){document.all.clock.innerHTML=f}else{if(document.getElementById){document.getElementById("clock").innerHTML=f}else{document.write(f)}}}if(!document.all&&!document.getElementById){getthedate()}function goforit(){if(document.all||document.getElementById){setInterval("getthedate()",1000)}};
//]]>
</script>
Cari dan Ganti kode <body> dengan kode <body onLoad='goforit()'>
Kelima :
Untuk menampilkannya silahkan letakkan kode berikut setelah kode <div id='main-wrapper'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='slide-wrapper'>
<b:section class='slide' id='slide' preferred='yes'/>
</div>
</b:if>
Keenam :
Akan muncul widget baru di Halaman Page / Page Element
Silahkan tambah kode HTML/Javascript berikut di widget yang muncul di Page Element tadi
<ul id="newsslider">
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMt0gEN-7Q2DrGk7z7AfWQPeSGDFKqvql4yGaFiAe1I21WHTQ2kqYdJZNfWyUfK7FuNPWco1YVJ_5UA56YGvLpAszqJlqgdyzKpnLuj0hh6IkEkkKY_6FkZdTkB7IcHxj02CPcHi5sd4g7/s1600/emak.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/sad-romance-dalam-bimbang-kunikmati.html">(Sad Romance) DalamBimbang, Kunikmatidirimu</a></h3>
<p>WepesangatterpukulsetelahputuscintadenganHerryseseorang yang sangatmempesonanya... <a href="#"> more » </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIC7alGXZsBfVq1pH3oR8cHr2sSRbraMMC8btiUn0ZkhWWjnqNNXZUQxfzZcF8moy54Q8OmyfpT-B81JsKwVuEgcmRJM97CS6wNEBSlRWHvStL470noVnNvRZvtXca7N7t3v8O_0P3qLqL/s1600/hawa.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/diary-sang-penggoda-kekasihmu-merayuku.html">[Diary Sang Penggoda] KekasihmuMerayuku</a></h3>
<p>Wanitaitudatangpadaku, denganlangkahanggunterkesantergesa-gesa, wajahayunya..... <a href="#">more »</a></p>
</li>
<li>
<a class="title" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitdFeTAUGq9LDCRhSLBAUntr2eb4s8i378bsgHuHd3deqHXplrSW4fcCgA7WDOoqCrnu7eBeafZQ8tUfeazWgsmaNnbH_ueQZL7hJ06iCyQBy4pzdxEEli0CFvN4CRZy14leshBAueJOW0/s1600/hawa+2.jpg" /></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/sad-romance-di-pantai-itu-mereka.html">[Sad Romance] Di PantaiItuMereka</a></h3>
<p>Semiliranginlautmenghempasbibirpantai, pasirbergerakperlahantersapulembut air laut, sepasangkekasihadadisana.... <a href="#">more »</a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinBE3hP_8Js0DObex6ee3MWZkerYKn_zuR2c1A4KMmArttnmGFAQXfzsuVOo0RkMEX1SsQrPPVSbBC6gp3PRyjvwFiHShyphenhyphenrh6OWyZFqkSAmVs5GzHNzJkyjBwNXwlecUy39-NhGjvFuYMS/s1600/youly+chang.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/catatan-seorang-gay.html">Catatan Seorang Gay… </a></h3>
<p>Samar-samarherrymenatapbayangandirinyapadasebuahcermin.Siapa yang haruskupersalahkan?sebagaimanusia.... <a href="#">more » </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMt0gEN-7Q2DrGk7z7AfWQPeSGDFKqvql4yGaFiAe1I21WHTQ2kqYdJZNfWyUfK7FuNPWco1YVJ_5UA56YGvLpAszqJlqgdyzKpnLuj0hh6IkEkkKY_6FkZdTkB7IcHxj02CPcHi5sd4g7/s1600/emak.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/sad-romance-dalam-bimbang-kunikmati.html">(Sad Romance) DalamBimbang, Kunikmatidirimu</a></h3>
<p>WepesangatterpukulsetelahputuscintadenganHerryseseorang yang sangatmempesonanya... <a href="#"> more » </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIC7alGXZsBfVq1pH3oR8cHr2sSRbraMMC8btiUn0ZkhWWjnqNNXZUQxfzZcF8moy54Q8OmyfpT-B81JsKwVuEgcmRJM97CS6wNEBSlRWHvStL470noVnNvRZvtXca7N7t3v8O_0P3qLqL/s1600/hawa.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/diary-sang-penggoda-kekasihmu-merayuku.html">[Diary Sang Penggoda] KekasihmuMerayuku</a></h3>
<p>Wanitaitudatangpadaku, denganlangkahanggunterkesantergesa-gesa, wajahayunya..... <a href="#">more »</a></p>
</li>
<li>
<a class="title" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitdFeTAUGq9LDCRhSLBAUntr2eb4s8i378bsgHuHd3deqHXplrSW4fcCgA7WDOoqCrnu7eBeafZQ8tUfeazWgsmaNnbH_ueQZL7hJ06iCyQBy4pzdxEEli0CFvN4CRZy14leshBAueJOW0/s1600/hawa+2.jpg" /></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/sad-romance-di-pantai-itu-mereka.html">[Sad Romance] Di PantaiItuMereka</a></h3>
<p>Semiliranginlautmenghempasbibirpantai, pasirbergerakperlahantersapulembut air laut, sepasangkekasihadadisana.... <a href="#">more »</a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinBE3hP_8Js0DObex6ee3MWZkerYKn_zuR2c1A4KMmArttnmGFAQXfzsuVOo0RkMEX1SsQrPPVSbBC6gp3PRyjvwFiHShyphenhyphenrh6OWyZFqkSAmVs5GzHNzJkyjBwNXwlecUy39-NhGjvFuYMS/s1600/youly+chang.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/catatan-seorang-gay.html">Catatan Seorang Gay… </a></h3>
<p>Samar-samarherrymenatapbayangandirinyapadasebuahcermin.Siapa yang haruskupersalahkan?sebagaimanusia.... <a href="#">more » </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo8X8IgQ7HkShC1GSBmib_EDEDuP439jrzz5Sh-KZRk54ZsDq26avVwNC_jZTl851TPfyBdf-4YwkqBpaIDIR9hPZj2sdkbt2hKXNusjCMWO9ztnANJqkVSpckjDN4gKNDaB-2gxPEbeaz/s1600/emak.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/oh-emak-oh-ibu.html">Oh Emak Oh Ibu</a></h3>
<p>5 tahun yang laluwaktuemakmengantarkuke terminal bus antarprovinsigunamerantaudanberangkatkuliahke Jakarta... <a href="#"> more » </a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIC7alGXZsBfVq1pH3oR8cHr2sSRbraMMC8btiUn0ZkhWWjnqNNXZUQxfzZcF8moy54Q8OmyfpT-B81JsKwVuEgcmRJM97CS6wNEBSlRWHvStL470noVnNvRZvtXca7N7t3v8O_0P3qLqL/s1600/hawa.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/diary-sang-penggoda-kekasihmu-merayuku.html">[Diary Sang Penggoda] KekasihmuMerayuku</a></h3>
<p>Wanitaitudatangpadaku, denganlangkahanggunterkesantergesa-gesa, wajahayunya..... <a href="#">more »</a></p>
</li>
<li>
<a class="title" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitdFeTAUGq9LDCRhSLBAUntr2eb4s8i378bsgHuHd3deqHXplrSW4fcCgA7WDOoqCrnu7eBeafZQ8tUfeazWgsmaNnbH_ueQZL7hJ06iCyQBy4pzdxEEli0CFvN4CRZy14leshBAueJOW0/s1600/hawa+2.jpg" /></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/sad-romance-di-pantai-itu-mereka.html">[Sad Romance] Di PantaiItuMereka</a></h3>
<p>Semiliranginlautmenghempasbibirpantai, pasirbergerakperlahantersapulembut air laut, sepasangkekasihadadisana.... <a href="#">more »</a></p>
</li>
<li>
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinBE3hP_8Js0DObex6ee3MWZkerYKn_zuR2c1A4KMmArttnmGFAQXfzsuVOo0RkMEX1SsQrPPVSbBC6gp3PRyjvwFiHShyphenhyphenrh6OWyZFqkSAmVs5GzHNzJkyjBwNXwlecUy39-NhGjvFuYMS/s1600/youly+chang.jpg"/></a>
<h3><a href="http://violetcafe5.blogspot.com/2011/11/catatan-seorang-gay.html">Catatan Seorang Gay… </a></h3>
<p>Samar-samarherrymenatapbayangandirinyapadasebuahcermin.Siapa yang haruskupersalahkan?sebagaimanusia.... <a href="#">more » </a></p>
</li>
</ul>
Silahkan edit kode diatas dengan kontent anda
Terakhir :
Simpan blog anda