SliDer oToMaTis UnTuK BloG MenGguNaKan JQuery ParT.2

Bismillah ... 
Anda pasti sudah tahu tentang slider konten. 
Hampir semua blogger menggunakan slider konten .. apakah itu digunakan untuk gambar slideshow atau konten. 
Tapi slider konten yang paling yang ada harus memasukkan data secara manual ...
ini sangat sulit dan hanya membuang waktu anda .. terutama jika Anda adalah orang sibuk .. 
untuk memecahkan itu ... saya punya solusi .. " Awesome Konten Slider otomatis untuk Blogger menggunakan jQuery Bagian 1 "
Cara kerjanya adalah script akan membaca feed blogger dan membuat slider konten juga dengan gambar otomatis ...

EasySlider

Langkah 1: Menerapkan Style

1. Login ke Dashboard Blogger dan arahkan ke Tata Letak> Edit HTML
2. Jangan klik kotak centang yang mengatakan 'Expand Template Widget'
3. Menemukan ini

]]></ B: skin>

Kemudian masukkan script di depannya

/ * ----------------------------------------------- MULAI --------------------- Mudah Slider --------------------------- ----------------------------------------- EasySlider * / # slide-kontainer {height : 360px; position: relative; width: 480px;} # slider {height: 360px; kiri: 25px; overflow-x: hidden; overflow-y: hidden; position: relative; width:. 480px;} geser-desc {background : transparan url (http://i195.photobucket.com/albums/z105/dantearaujo/darkbg.png) ulangi gulir 0 0; color: # FFFFFF; padding: 10px; posisi: absolut; kanan: 0px; text-align: kiri; atas: 0; width: 200px; z-index:. 99999;} geser-desc h2 {display:.. block;} crosscol widget-content {position: relative;} # slider ul, # slider li, # slider2 ul, li {# slider2 margin: 0; padding: 0; daftar-style: none;} # slider2 {margin-top: 1em;} # slider li, # slider2 li {/ * mendefinisikan lebar dan tinggi dari item daftar (geser ) daerah seluruh slider akan menyesuaikan sesuai dengan parameter yang diberikan di sini * / width: 480px; height: 360px; overflow: hidden;} # prevBtn, # nextBtn, # slider1next, # slider1prev {display: block; width: 30px; height: 77px ; position: absolute; left: 30px-; text-indent:-9999px; top: 71px; z-index: 1000;} # nextBtn, # slider1next {kiri: 500px penting;} # prevBtn, # nextBtn, # slider1next, # slider1prev {display: block; height: 77px; kiri: 0; posisi: absolut; top: 132px; width: 30px; z-index: 1000;} # prevBtn sebuah, # nextBtn sebuah, # slider1next sebuah, # slider1prev a { display: block; position: relative; width: 30px; height: 77px; background: url (http://i195.photobucket.com/albums/z105/dantearaujo/prev.png) tidak mengulang-0 0;} # nextBtn sebuah , # slider1next a {background: url (http://i195.photobucket.com/albums/z105/dantearaujo/next.png) tidak mengulang-0 0;} / * kontrol numerik * / ol {margin kontrol #: 1em 0 ; padding: 0; height: 28px;} ol # kontrol li {margin: 0 10px 0 0; padding: 0; float: left; daftar-style: none; height: 28px; line-height: 28px;} ol # kontrol li a {float: left; height: 28px; line-height: 28px; border: 1px solid # ccc; background: # DAF3F8; color: # 555; padding: 0 10px; text-decoration: none;} # ol kontrol li . arus {background: # 5DC9E1; color: # fff;} ol # kontrol li a: fokus, # prevBtn satu: fokus, # nextBtn satu: fokus {outline: none;} / * END ------- -------------------------------------------------- ----------- ------------------------------------- Slider Mudah ------------------------------- EasySlider * /

Langkah 2: Terapkan Javascript

Temukan ini:

</ Body>

Kemudian masukkan script di depannya

<- JQuery -> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js' type='text/javascript'> </ script> < Script src = 'http://accordion-template.googlecode.com/svn/trunk/easySlider1.7.js' tipe 'text / javascript' => </ script> <script type='text/javascript'> / / <[CDATA [$ (dokumen) siap (function () {$ ("# slider") easySlider ({auto: benar, terus menerus:. true});});. //]]> </ script>!

Langkah 3: Terapkan Gadget

Desain -> Klik "Tambah Gadget" -> HTML / JavaScript tipe.

<div id="slider"> <script style="text/javascript" src="http://catur-at-abu-farhan.googlecode.com/svn/trunk/galleryposts-easySlider.min.js"> < / script> <script style="text/javascript"> numposts_gal var = 6 ; var numchars_gal = 150 ; random_posts var = palsu ;! / / random posts </ script> <- ganti dengan alamat web Anda (ditandai dengan warna merah ) -> <script </ Div>

Demo

Jika Anda memiliki pertanyaan silakan tinggalkan komentar .... thx u

• 
• 
• 
• 
• 
• 
•