Membuat Slideshow Keren

Membuat Slideshow Keren - Sekarang saya akan berbagi Tips Blog yaitu Membuat Slideshow Keren, dengan menambah Fitur ini Blog kamu akan terlihat keren, dan tidak hanya itu pada Slideshow ini kamu bisa menyisipkan Beirta atau Artikel Terpopuler Supaya tampil pertama di Home Page, dan juga memudahkan pengunjung melihat Artikel Terpopuler, Cara Buat Nya Mudah Kok,Lihat Gambar Di Bawah Ini.

Slideshow BLAZER BLOG

Jika Sobat Tertarik Membuat Slideshow Keren ikuti langkah-langkah dibawah ini.

1. Login ke Blog Kamu.

2. Pilih Rancangan

3. Pilih ADD GADGET Lalu Pilih HTML Java Script

4. Copy Kode Dibawah Ini.

<div id='featured'>
<ul class='ui-tabs-nav'>

<li class='ui-tabs-nav-item ui-tabs-selected' id='nav-fragment-1'><a href='#fragment-1'><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_QyMtiOeygTTiHHhw9-2vW-zd1oYjUvCBAFp52DJ6YeYCGPhcPLR3QYiwPmczXGCOUZMZ5DzcU9415bKkRYjagv4Ry4WRq8DIN97ewNDpR66V2134WfZud8HcN-s-Q4QPJIPlymAD6ag/s320/Steve+Jobs+Memory.jpg" /><span>Steven Paul "Steve" Jobs was Gone</span></a></li>

<li class='ui-tabs-nav-item' id='nav-fragment-2'><a href='#fragment-2'><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicmkU_DZemkZSTjIK2Ave_5o6ddcJaR0iWD0epTaNJP8uCsjDyxhxZggBcChUlIuN6ZMwBpK7t3pCPtx4PvJ5REruKFQASsYJCVW6qDZcR0eMFuXoZGHLyUv7jHaDbr__gLyvRrlgTDyA/s320/Marco+Simoncelli.jpg" /><span>Race in Peace Marco Simoncelli</span></a></li>

<li class='ui-tabs-nav-item' id='nav-fragment-3'><a href='#fragment-3'><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUzmYQP1-Xm_FkhKUgnvudNgE_9XroBuJNKrSqMTfZQVCGICmkWIIRcRhyphenhyphenADkzaTzPg_UHa2xpB7pn7mWTN1DLkGJ61JxRADBE3Khr_nzY1GCr2EsEr8fhKSfxD0rQrAU1J2hWIie_dqA/s320/Lionel+Messi.jpg" /><span>Why Lionel Messi Is The Great One</span></a></li>

<li class='ui-tabs-nav-item' id='nav-fragment-4'><a href='#fragment-4'><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpxDqesfwUyEURjMZ-_Vm8YXUw5P-spM6svRHeToL5rD95VKIQFY7IxvhbfSEtWnExQ8QLusJ6RjCv7I7bP3653b3gJtx1TxrLLui7UScuIi_M5vyjZJTOU5WHGBcDsL57BDerANB20TM/s320/Valentino+Rossi.jpg" /><span>Rossi, The Legend of Moto GP</span></a></li>

<li class='ui-tabs-nav-item' id='nav-fragment-5'><a href='#fragment-5'><img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuMfxi5yXMIv2qh8KDh9fAwI8d8Nj9OL_mn82s0XpZFs5dS8GIbLOH16UEB01ohxEl3n8uJTo8UTYIPxQCBllUmbU78Uqerm8KAwzNyUd9br8ICt-cgQKKrrFHxhFHYoZimv4gmj3Z-MQ/s1600/Michael+Jordan.jpg" /><span>Michael Jordan is the legend of Basketball</span></a></li>
</ul>

<div class='ui-tabs-panel' id='fragment-1' style=''>
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_QyMtiOeygTTiHHhw9-2vW-zd1oYjUvCBAFp52DJ6YeYCGPhcPLR3QYiwPmczXGCOUZMZ5DzcU9415bKkRYjagv4Ry4WRq8DIN97ewNDpR66V2134WfZud8HcN-s-Q4QPJIPlymAD6ag/s320/Steve+Jobs+Memory.jpg" />
<div class='info'>
<h2><a href='http://www.bloggermaps.com/2011/10/steve-jobs-creator-of-ipad-ipod-and.html'>Steve Jobs, Creator of iPad, iPod and iPhone was Gone</a></h2>
</div>
</div>

<div class='ui-tabs-panel ui-tabs-hide' id='fragment-2' style=''>
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicmkU_DZemkZSTjIK2Ave_5o6ddcJaR0iWD0epTaNJP8uCsjDyxhxZggBcChUlIuN6ZMwBpK7t3pCPtx4PvJ5REruKFQASsYJCVW6qDZcR0eMFuXoZGHLyUv7jHaDbr__gLyvRrlgTDyA/s320/Marco+Simoncelli.jpg" />
<div class='info'>
<h2><a href='http://www.bloggermaps.com/2011/10/motogp-lose-talented-rider-rest-in.html'>MotoGP lose Talented Rider , Rest in Peace Simonceli </a></h2>
</div>
</div>

<div class='ui-tabs-panel ui-tabs-hide' id='fragment-3' style=''>
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUzmYQP1-Xm_FkhKUgnvudNgE_9XroBuJNKrSqMTfZQVCGICmkWIIRcRhyphenhyphenADkzaTzPg_UHa2xpB7pn7mWTN1DLkGJ61JxRADBE3Khr_nzY1GCr2EsEr8fhKSfxD0rQrAU1J2hWIie_dqA/s320/Lionel+Messi.jpg" />
<div class='info'>
<h2><a href='http://borneo-sporty.blogspot.com/2011/11/why-lionel-messi-is-great-one.html'>Why Lionel Messi Is The Great One</a></h2>
</div>
</div>

<div class='ui-tabs-panel ui-tabs-hide' id='fragment-4' style=''>
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpxDqesfwUyEURjMZ-_Vm8YXUw5P-spM6svRHeToL5rD95VKIQFY7IxvhbfSEtWnExQ8QLusJ6RjCv7I7bP3653b3gJtx1TxrLLui7UScuIi_M5vyjZJTOU5WHGBcDsL57BDerANB20TM/s320/Valentino+Rossi.jpg" />
<div class='info'>
<h2><a href='http://borneo-sporty.blogspot.com/2011/11/valentino-rossi-legend-of-moto-gp.html'>Valentino Rossi, The Legend of Moto GP</a></h2>
</div>
</div>

<div class='ui-tabs-panel ui-tabs-hide' id='fragment-5' style=''>
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuMfxi5yXMIv2qh8KDh9fAwI8d8Nj9OL_mn82s0XpZFs5dS8GIbLOH16UEB01ohxEl3n8uJTo8UTYIPxQCBllUmbU78Uqerm8KAwzNyUd9br8ICt-cgQKKrrFHxhFHYoZimv4gmj3Z-MQ/s1600/Michael+Jordan.jpg" />
<div class='info'>
<h2><a href='http://borneo-sporty.blogspot.com/2011/11/michael-jordan-is-legend-of-basketball.html'>Michael Jordan is the legend of Basketball</a></h2>
</div>
</div>
</div>

Belum Selsai Sekarang Pilih Rancangan Lalu Pilih EDIT HTML Lalu Cari Kode ]]></b:skin>
Copy kode dibawah ini Tepat di atas Kode ]]></b:skin>

/* Featured Content
----------------------------------------------- */
#featured {width:640px;height:290px;margin:0 0 10px 0;padding:0;position:relative;}
#featured ul.ui-tabs-nav{position:absolute;top:0;right:0;list-style:none;padding:0; margin:0;width:235px;height:290px;}
#featured ul.ui-tabs-nav li{height:58px;padding:0;position:relative;line-height:1.0em;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtVM7YTB2TKheyOAdRiFx7Ka4odDtzy8GTaQhdnTMiUOEaHki0FhngWcm8x8gnUUOhDz8-cM7hCHrhU8UZdWv0y3h8Nq5aCY2ZMFSXomyiqXbl16uOg1sYSijvgJuob4W77GVI0snIP9E/s1600/slide_basic.gif) repeat-y bottom right;}
#featured ul.ui-tabs-nav li span {padding:0;margin:0;line-height:1.0em;}
#featured .ui-tabs-panel{width:405px; height:290px;position:relative;overflow:hidden;padding:0}
#featured .ui-tabs-panel img {width:395px; height:290px;margin:0 5px}
#featured .ui-tabs-hide {display:none;}
#featured li.ui-tabs-nav-item a {height:38px;display:block;margin:0; padding:10px 20px 10px 10px;color:#000;overflow:hidden;line-height:1.0em;outline:none;}
#featured li.ui-tabs-nav-item a:hover{background:none;text-decoration:none;color:#A00000}
#featured li.ui-tabs-selected{position:absolute;}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9DkYV2tSY9zFfbtomhZc3Ru5iLNEbZZ2PnNiBKx8OjotMN7amh6aw1KmeMGBgb-2klFSl4y2TVHFHz01gSWCPNjJJ-6hfb-AW4Pogp8nZsyUWg8uyLoZx_YiCrtSglMrdTJoI_2yk3OU/s1600/slide_hover.gif) no-repeat center right;display:block;font:normal 12px Arial;line-height:1.0em;color:#fff}
#featured ul.ui-tabs-nav li img{width:55px;height:38px;float:left; margin:0px 8px 5px 0;padding:0;border:none;}
#featured .ui-tabs-panel .info{position:absolute;top:230px; left:0; height:60px;width: 400px;background:#A00000;border-right:5px solid #000}
#featured .info h2{text-transform:none;line-height:1.2em;font-size:18px;font-family:Arial, serif;height:40px;color:#fff; padding:6px 10px; letter-spacing:.001em;margin:0;overflow:hidden;}
#featured .info a{text-decoration:none;color:#fff;}
#featured .info a:hover{color:#FFFF00;text-decoration:none;}

Keterangan.
Ganti Yang Berwarna Merah Dengan Judul Posting Atau Berita Artikel dan lain-lainnya.
Ganti Yang Berwarna Biru Dengan URL Posting, Artikel, Berita Dan Lain-lainnya
Ganti Yang Berwarna Ungu Dengan URL Gambar Kamu.

Lalu simpan Widget nya di atas Posting Kamu.
Jika ada kesalahan atau tidak berfungsi harap tinggalkan pesan di Kotak Komentar, karna Script ini masih dalam tahap percobaan.

SELAMAT MENCOBA

UNIK

Translate

Membuat Slideshow Keren

BACA JUGA YANG INI :