cara membuat slider show posting bergerak otomatis

agar blog anda terlihat menarik dengan menambahkan kode di bawah ini untuk membuat slide show diatas,agar tampilan blog anda semakin menarik silahkan pasang kode nya di bawah ini:

langkah pertama adalah
1.buka blogger
2.klik template
3.klik edit html-kemudian klik ctrl+f-lalu cari kode berikut   ]]></b:skin>
4.lalu pastekan kode di bawah ini tepat diatas kode     ]]></b:skin>

#featured-wrap{border-bottom:1px solid #000;box-shadow:0 1px 0 0 #333;background:#111;position:relative;height:175px;margin:0 auto}<br /> #featured{border:2px solid #444;outline:1px solid #000;position:relative;width:88%;height:150px;overflow:hidden;top:10px;margin:0 auto}<br /> #featured ul{width:9999px}<br /> #featured ul,#featured li{list-style:none;padding:0;margin:0;overflow:hidden}<br /> #featured li{width:150px;display:inline-block;float:left;height:150px;background:#222;border-left:1px solid #111;border-right:1px solid #333;}<br /> .thumb-featured{width:140px;height:100px;margin:5px auto;overflow:hidden;border:1px solid #000}<br /> .thumb-featured img{display:block;width:134px;height:94px;border:3px solid #444;}<br /> .title-featured{text-align:center;position:relative;margin-top:-20px}<br /> .title-featured h4{font-size:90%;max-height:45px;overflow:hidden}<br /> .arrow{position:absolute;display:block;background:#111 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizdsf-6q_gLqV0WlyJz7_a2xGwF3skeWD8iFMglfjWGZEX_5ax7WqFaCUhJYEFJIf4u6TamhVcMi4mrmuqc5N7UzTwmaZ4KxtJDhBvkg0sg3AegcVz6MDdPNSGnr6JGgyf_Lo7-7-yOpI/h120/icon-sprite.png)no-repeat;background-position:0 50%;width:35px;height:60px;top:50px;text-indent:-9999px;border:1px solid #000;box-shadow:0 0 0 1px rgba(51, 51, 51, 1)inset}<br /> .arrow.back{background-position:0 50%;left:10px}<br /> .arrow.forward{background-position:100% 50%;right:10px}<br /> span.slideloading{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTilIculFslChvH7hYCvltYXJ94Vn0iJrA0ykOqUpgy7Fq38XBWBstyrR9EO8trvQ8mv21V5fhY1E-6rgOTbbbOTRYQuzNRwDVs-9sjs9vz86AJ5UXaP6DB4taVrq0ZSPl6C8o50YOX8E/h42/loading.gif);background-repeat:no-repeat;background-position:50% 50%;text-indent:-9999px;margin:50px auto}<br /> <br />

5.kopi lagi kode di bawah ini dan pastekan di atas kode  </head>

<script type='text/javascript' src='http://faceblog-evolutions.googlecode.com/files/Slider-Carousel.js'/>

6.cara menempatkan tampilan featured slide show nya mau di tempatkan di mana jika mau di tempatkan di bagian atas silahkan kopi kode yang ada di bawah ini dan pastekan di bawah kode <div id='main-wrapper'>

 dan kalau mau memasang slider show posting nya di bagian bawah / footer silahkan kopi kode yang ada di bawah ini dan pastekan di bawah kode <footer id='footer-wrapper'>

<b:if cond='data:blog.url == data:blog.homepageUrl'> <div id='featured-wrap'> <div id='featured'> <span class='slideloading'>Loading...</span> </div></div></b:if> 

7.lalu simpan template 8.selesai.

Related Posts:

Tweet