Cara Memasang Slide Show Postingan Di Blog

Cara Membuat Widget Slideshow Postingan
Belakangan ini banyak teman teman saya menanyakan kepada saya .. “gimana sih cara pasang slide show postingan di blog” susah ga ? terus saya jawab ga susah kok, tinggal copy scriptnya , edit dikit abis itu save. Jadi deh...  Namun satu udah bisa, beberapa hari kemudian ada yang nanya lagi dan begitu terus hingga beberapa orang. Sehingga munculah sebuah ide untuk memposting cara membuat slideshows di postingan. Banyak yang berminat memasang widget ini setelah melihat blog saya. Karena slide tersebut memudahkan para pengunjung untuk membaca postingan apa yang menarik di blog kita. Karena di slide show tersebut bisa menampilkan gambar dari tiap postingan kita. Disertai judul dan koment yang ada di postingan tersebut. Apakah anda berminat juga untuk memasang widget ini ? caranya mudah kok,. Tidak perlu memakan waktu lama... dari pada membuang – buang waktu mari kita langsung ke TKP saja,,, lets gooo....

Cara Memasang Widget Slide Show Postingan Di Blog

  • Login ke blog anda
  • Pilih Rancangan
  • Tambah gadget
  • Pilih tambah Html / Java Script
  • Kemudian Copy kode Html Dibawah ini

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>
    <script language='JavaScript'>

imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = " http://www.BlogAnda.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
    <script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div> 
<small><a href="http://permathic.blogspot.com/2012/04/cara-memasang-slide-show-postingan-di.html" target="_blank" title="Cara Memasang Slideshow Postingan Di Blog"> Widget Slideshow</a></small> 

Ingat !!! jangan lupa ubah tulisan warna merah menjadi alamat url Blog anda. Dan Editlah Width ( lebar) dan Height (tinggi) sesuai dengan yang anda inginkan. Namun jika anda tidak ingin repot2 mengubah ukuran, tinggal Copas aja. Tapi jangan lupa tulisan warna merahnya di ganti.

  • Pastekan script di atas kedalam Html/java script tadi
  • Simpan
  • Lalu atur dimana anda akan meletakan slide show tersebut
  • Lalu simpan kembali.
  • Selesai

Mudah bukan ? jangan lupa sering - sering berkunjung Ke Permathic Blog  

121 komentar

thanks gan infonya....
kebetulan ane lagi nyari script nya

sipp gan,,
jangan lupa,, sering - sering kunjungi permathic gan...

Great post, you have pointed out some superb details, I will tell my friends that this is a very informative blog thanks.
IT Company India

mungkin url yg saya kasih warna merah belum di ganti kali gan ma url blognya agan..

aku pengguna wordpress udah ku coba dah ku ganti tulisan warna merah dg url blog aku...kok ttp gak bs ya?

beneran gak tuh bisa? saya baca di blog laen katanya harus masuk ke edit html, centang widget trus taro dibawah Head trus di-save. Baru deh buka halaman tata letak trus bikin gadget html n taro kode laen.

keren mas post nya blog walking ya http://purnomosymb19.blogspot.com/ thx

bang follow blog ane :: http://boga-boedaxtekaje.blogspot.com/

buat agan tas branded dan andreascorsini, ga tuh gan, saya langsung paste aja di tambah gadget Html/Java Script terus ganti urlnya bisa. dan beberapa yg masang, bisa tuh nampil. contohnya punya agan Muhammad husni Farid yg komentnya paling atas. mungkin memang widgetnya khusus buat blogspot kali gan...
contoh slidenya ada di sebelah kiri blog saya di bawah iklan.

untuk agan Entjep.. udah ane follow blognya agan...

makasi gan akhirnya bisa pasang widget ini juga...
follow blog ane

tulisan warna merahnya di ganti dulu gan,. sesuai ma url blog yg mw di pasang slideshow

untuk merubah tinggi dan lebarnya di edit di mana..?

Follow blog gout yooo http://vinaa-thelucky-bastard.blogspot.com

Bang,.. Itu untuk 4 foto tampilan Slide Show! Kalau mw bikin atau tambah lagi! Jadi 5,6,7,8 Gimana caranya, Bang! Mohon petunjuk ilmunya bang?

boleh lah .. makasih gan infonya ...

cek >>
x-komodo

makasih gan
janagn lupa kunjungan balik ya ,,,

http://catatanrobith.blogspot.com/

kunjangan malam, nice posting and happy blogging

Trimakasih atas ilmu yang agan berikan . . . Langsung aja izin mencoba

thanks yea sob info na sngat berguna bnged bwd blog saya,.,
tx bngedd bguss,., :)

thanks gan infonya....
kebetulan aq jg lagi nyari script nya, http://dwiworo.blogspot.com

bisa gan, pi images tidak kluar..?
[ apa images yg di tampilkan harus tersimpan di blogger..? ] soalnya semua images blog q link dari luar semua.

makasih gan....
sippp....
kunjungi punya ane juga ya...
http://izat17.blogspot.com/

Okay! dicoba gan :)

Follow yo: qolamqarnain.blogspot.com

mau tanya, ini bentuk slide nya vertikal apa horizontal ya bang?

makasih infonya :)

http://skatersklk.blogspot.com/

Keren banget widget nya..maksih gan...

Terimakasih banyak mas sudah share tutorialnya. :)

follow aku http://listiantikahfiana.blogspot.com/ :)

Nice posting. Boleh juga nih di praktekin.. Makasih ya triknya..

Eh.. buat teman2, ingin bikin toko online, website gallery produk ada CMS yang patut dicoba. CMS webshop pro, download installasinya di sourforge net. Lengkapnya di sini:
https://sourceforge.net/projects/cmsprowebshop/

Contoh penggunaan template bisa lihat di web ini:
http://catering-murah.web.id

Just sharing, semoga berguna..

Gan Kok di BLOG ane gk nge SLIDE ya .??? MOHON BANTUANNYA ...


bermip.blogspot.com
bermip.co.cc
bermip.tk

thanks infonya :) tapi di blog gue kok gak ngeslide ya bang? padahal urlnya udah bener

Thanks gan untuk Infonya semoga tetap berkarya...

setelah dicoba berhasil gan,.. sekalian mo tanya nh, apa blh slideshownya dibuat horisontal gan,..
thanks

Rare Angon Berkunjung Sobat, Artikel dan tutorialnya sudah dicoba ... kenapa blog saya berat yaa.. mohon solusinya, trims

gaan, mohon petunjuk, udh berulang kali gonta ganti url yg di bold merah menjadi url blog ane, ga bisa2...
balesan nya :

"Kami tidak dapat menyimpan template Anda.

Harap perbaiki kesalahan di bawah, dan kirimkan template Anda lagi.
Template Anda tidak dapat diparse karena tidak well-formed. Harap pastikan bahwa semua elemen XML ditutup dengan benar.
Pesan error XML: The markup in the document following the root element must be well-formed."

kenapa yaaakk???

di blog sya tidak mau jalan slide Gan...bgmna in ya? mohon di bantu ya, thank...

wah postingannya bermanfaat banget buat ane gan.. makasih ya gan...

gan keren ..udah lama dicari...baru ketemu nih

jangan lupa mampir ya
frabagas.blogspot.com

Nampaknya paten caranya tapi penempatan slidenya di mana dan apa format slidnya?

ajipzzzzzzzzzzz gan ane dah coba.tanx.

Maturnuwun Infonya ... Monggo mampir di Blog saya

Thanks sudah berbagi ilmunya, sukses selalu...

THANKS BANGET YA GAN...
UDH ANE COBA...
DAN BERHASIL....
JANGAN LUPA BERKUNJUNG KE http://sefriwandanahsb.blogspot.com/

Ok gan petunjuknya oke banget

visit me yah!
http://jhangsoen.blogspot.com

ass, saya mau tanya, kok punya saya widgetny tdk bergerak ya? hanya diam saja, awalny bergerak tp stlh itu tdk, karena saya masih baru d blog, saya masih penasaran. jdi mohon bantuanya..
trmksh :)

wow artikel yg menarik mas, dan salam kenal dari mico dan juga saya suka blog ini dan juga bagi teman2 yg suka dengan film action,horor,atau box office dan download film gratis silakan kunjungi situsnya ok.thanks admin blog ini loe

maaf untuk bbrpa komentar yg blm sempet saya balas.. dan untuk pertanyaan2 yg blm smpt saya jawab juga. harap di mklumi,, sebab beberapa bulan ini admin bnyk di sibukan oleh pekerjaan dan tugas2 kuliah di dunia nyata. saya sebgai admin hanya ingin mengucapkan terima ksih atas kunjungn dn komentar dari shbt2 blogger semua..
semoga selalu semangat untuk nge-blogging.

bank,ane pernah coba tutorial di atas tp kok gak bisa yach, bentuin donk pengin bgt punya slide.

Pengen pasang tapi nggak ada demonya, jadi takut salah pasang.
Makasih sharingnya mas :)

ane uda bisa,,
tp sayang ke kecilan gambarnya...
ane uda cba mengubah lebar sama tingginya tp tetep aja gk brubah..
klw bleh te dmna letak ubah image nya jadi besar..?

postingan yang bagus. salam kunjungan

terimakasih Share nya, langsung dicoba.

bagus gan coba kalo pya aku gmn yah apa yg hrs di tamabahin.
http://www.suryapratamaartistik.blogspot.com

thanks bro info nya sangat membantu semoga sukses
blog ane bro http://www.prediksitogelasiajp.blogspot.com

thanks very much bro . . . infonya sangat membantu . . .

blog saiia bro http://sayetmdahri.blogspot.com

Thanks ya Ma Info nya..., Kunjung balik ya mas...!

cara ganti gambar widget slideshowx gmna ya?

Bagus ni bila dipasang dalam web terutama web komersial seperti punya saya biar tampilannya makin menarik
terima kasih buat info dan langkah2nya

makasih ga, mampir ke blog kami juga jajanngampuss.blogspot.com :)

asikk...makasih gan
:)
bermanfaat banget...

gan punya saya ok ndak jalan tolog kasih tau pa penyebabnya cek disini http://sunarnoponorogo.blogspot.com

mantap gan. mampir ke blog ane gan. http://operatingsystemdebian.blogspot.com

Keren Gan Slideshow nya, sukses Ta Masukkan ke Blog Saya. Thanks

Terima kasih tipsnya. Kemarin saya dah coba dan sukses di blog saya. Tapi beberapa hari ini kok jadi blank ya (gak ada apa2nya), seperti punya Anda di "Baca juga". Mohon bantuannya...

PEMBERITAHUAN !!!! bagi rekan-rekan blogger yg sudah memasang widget slideshow, untuk beberapa hari ini slideshow pada blog tidak tampil termasuk slideshow pada blog saya. setelah saya cek ternyata ada url yg tidak bisa di akses pada google code. sehingga saya memcoba memperbaiki sricptnya. dan akhirnya bisa juga tampil slidenya. bisa di lihat pada sidebar sebelah kiri permathic blog. nah jika rekan2 ingin slidenya tampil juga, maka ganti semua kode yang di atas menjadi kode script yang baru, bisa anda dapatkan pada link di bawah ini.

permathic.blogspot.com/2012/12/cara-membuat-slideshow-postingan-di-blog.html

ini kode yg lebih simple. semoga dengan kode yg baru ini bisa berhasil...

Kyaknya menarik nich, izin cobain ya gan.

oh makanya slide show d blog saya ndak bsa..
oke saya coba kode yang baru..makasih yaaa ^.^
kunjungi blog saya ya di smartmathematics22.blogspot.com dan diaryrima22.blogspot.com.
Thankyouuuu ya ^^

mantap bro bisa coba kunjungan baliknya ya www.naufalthedarkness.blogspot.com

waktu pertama coba kan bisa, nah kenapa waktu buka blog lagi dan lagi itu susah munculnya ya slide shownya? kenapa om?

Terimakasih ;;;;)

http://fairuzalhumaira.blogspot.com/

Mantap gan artikelnya , jangan lupa mampir ya http://candraseptian.blogspot.com/

Mampir ya sob :-)
sukses terus deh

gak bisa masuk gan. betul gak nih Postingannya?

sukses selalu ya , makasih

makasih, postingannya sangat bermanfaat

thanks infonya, sukses selalu..

keren postingannya,sukses ya

makasih dah berbagi ilmunya,,

bermanfaat banget informasinya ,,thanks ya

terima kasih banget buat infonya ,

referensinya mantap bos....

Mantap aku Buutuh Yang ini, tapi tolong berikan infonya supaya tulisan isi postingnya agak panjang, saya punya munculnya sedikit sekali kurang lebih cuma 30 Huruf, Makasiih gan Tlg berkunjung juga di blogku www.kangtrick.com

terima kasih infonya...mantab...

gk muncul gan padahal udah diganti ama url punya saya

kalau mau pasang slide antar label gimana caranya ya

Kunjungan Malam gan, segera dicoba. Follow and Mampir ke blok aq gan www.auliabalitour.blogspot.com

gak biza muncul gan....
yg merah udah saya ganti ma alamat url blog saya tp tetp gak biza muncul tu gan...???

Artikelnya lumayan bantu banget neh ...

Terima kasih sharingnya.
Mungkin kalau berbentuk widget, lebih mudah cara pakainya :)

http://www.maslukis.com/2016/10/bayar-semua-tagihan-langsung-dari-hp.html

terimakasih infonya om....mohon ijin untuk saya terapkan di blog saya ya...
terimakasih om...salam kenal