Cara Membuat Otomatis Slider Posting

Cara membuat slider posting  atau cara memasang slider posting , cara membuat slider posting otomatis.
slider posting atau suka di sebut juga dengan featured slider ini akan secara otomatis menampilkan cuplikan-cuplikan judul posting desertai gambar nya dan juga otomatis akan terlihat sedikit artikelnya sebagai contoh bisa di buka demo nya disini

sebagai contoh dari pembuatan slider posting atau slider konten secara otomatis ini seperti terlihat di dalam gambar yang di bawah ini

 
jika sudah paham untuk pembuatan slider posting ini caranya sebagai berikut :
1.buka blog anda
2.lalu login ke akun blog masing-masing
3.pergi ke dashboard blogger
4.pilih template dan klik lagi edit html
5.cari kode </head>
6.lalu kopi kode yang di bawah ini dan pastekan di atas kode </head>

<style>
#featuredSlider {margin:10px; padding:0 0 10px;width:96%; position:relative;border:0px solid #444;box-shadow:1px 1px 1px #eee;}
#featuredSlider .featured-thumb {float:left; margin:10px; padding:0;}
#featuredSlider .container {height:246px; margin:0 10px 0 0; overflow:hidden; position:relative;}
.featuredTitle{padding-top:15px;font:21px Arial;}
.featuredTitle a{color:#0080ff}
.featuredTitle a:hover{color:#0000ff}
.navigation {position:relative;bottom:23px;float:right;overflow:hidden;}
ul.pagination {list-style-type:none; margin:0 auto; padding:0;display:none}
a.readmore {float:left;border:1px solid #444;background:#444 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOv5eAeXAKGDFvhmK1dtCGKQkke_tpXnQd4kHFAM6aos9bWDOJw8Xwv1ZsXArp8lIDlW3zpGuq4OXw3HSXND3uy8chVb7aso_wiDfyMy5qexUxiqjhlbqxD1cNeWe9GF1z8Xmjz0QP17g/s1600/fade.png) repeat-x top;display:block;;font:bold 12px Arial;text-shadow: -1px -1px 0 #333;margin:10px 0 0 0;padding:4px 10px;color:#eee;-webkit-border-radius:3px;-moz-border-radius:3px;
border-radius:3px;-webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);}
a.readmore:hover {color:#ff0}
                        </style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script src='https://cdn.rawgit.com/Brando07/share/master/slider-otomatis-seocips-1.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5rep6tEu2LORevN-a0F4Kf3Duc7qRqF-zDRP7s_5bVtVfRXl8oixWRNg6IG6BvVfksS1eNAvI1RoQSuZY0hFfWaF9L992rDGkbGJJ0NhPnuFn1RfCbA0nQw2WY_VG7rYWrhef0HiBvqBO/s400/arkaan+reL400+2.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 90;
summaryTitle = 25;
numposts  = 6;
//]]>
</script>

7.cari lagi kode <div id='main-wrapper'>
8.lalu kopi kode yang di bawah ini dan pastekan di bawah kode <div id='main-wrapper'>

 <div id='featuredSlider'>
    <div class='container'>
    <script>
    document.write(&quot; &lt;script src=\&quot;/feeds/posts/default?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
    </script>
    <div class='navigation'>
    <ul class='pagination'/>            <script>
    $(&#39;.slides&#39;).cycle({
      fx:     &#39;fade&#39;,
      speed:  &#39;slow&#39;,
      timeout: 3000,
      pager:  &#39;.pagination&#39;
      });
    </script>
    </div>      
    </div>
    </div>

9.kemudian simpan perubahan templatenya
10.selesai.

Demikian tutorial cara membuat slider posting secara otomatis untuk blogger , semoga rekan blogger mudah mengikutinya.