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  





116 komentar:

Muhammad Husni Farid said...

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

Adi Wijaya said...

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

PC DOwnload said...

bagus bang

Adi Wijaya said...

Thank you..

Unknown said...

gak nimbul tu slideshow nya?!!

Adi Wijaya said...

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

Anonymous said...

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

tas branded said...

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.

Staff Administrator said...

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

Entjep boedax TeKaJe said...

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

Adi Wijaya said...

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.

Adi Wijaya said...

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

rencong.soft said...

bagus

1x Klik Blog's (ahmad) said...

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

Jefri Krisna Putra said...

Ko' saya gak bsa ya gan.. Knp ya?

Adi Wijaya said...

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

Unknown said...

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

VINNA.DAS said...

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

Unknown said...

TQ infonyaa :D

Unknown said...

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?

Nana Nano-nano said...

:)

Unknown said...

boleh lah .. makasih gan infonya ...

cek >>
x-komodo

Robith said...

makasih gan
janagn lupa kunjungan balik ya ,,,

http://catatanrobith.blogspot.com/

Unknown said...

Sipp,,,, Bisa di terapkan

Anonymous said...

kunjangan malam, nice posting and happy blogging

Unknown said...

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

Unknown said...

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

Dwiworo said...

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

voo said...

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

Doslan Damanik, S.Pd said...

trima kasih infonya

Doslan Damanik, S.Pd said...

trima kasih infonya

asriyatno said...

makasih gan ilmunya

Ngizat said...

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

Redaksi said...

Okay! dicoba gan :)

Follow yo: qolamqarnain.blogspot.com

Ardityaramdhan said...

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

Asy shahid AM said...

makasih infonya :)

http://skatersklk.blogspot.com/

Eko said...

Keren banget widget nya..maksih gan...

Blog Belajar SEO Gratis said...

Terimakasih banyak mas sudah share tutorialnya. :)

Unknown said...

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

mauricelly said...

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..

bala-bala gehu said...

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


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

deasamanthaa.blogspot.com said...

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

Jupen Bahari said...

Thanks gan untuk Infonya semoga tetap berkarya...

blitari said...

thanks gan..

Admin said...

Thank you, sob.

agung said...

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

rare-angon said...

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

Unknown said...

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???

Widjaja said...

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

produk grosir said...

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

rossanoni said...

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

Samsidar Widiarso said...

jangan lupa mampir ya
frabagas.blogspot.com

Yuswanda said...

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

Plakat Jakarta said...

ajipzzzzzzzzzzz gan ane dah coba.tanx.

Bakul Angkringan said...

Maturnuwun Infonya ... Monggo mampir di Blog saya

Mang uem said...

Thanks sudah berbagi ilmunya, sukses selalu...

Unknown said...

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

eris risno said...

Ok gan petunjuknya oke banget

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

Informasi Terkini said...

ini yang ane cari...
makasih masta

Mr.Farhan said...

thanks infonya ya

mufita said...

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 :)

download film said...

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

Adi Wijaya said...

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.

eko sudibyo said...

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

Direktori Penerjemah Indonesia said...

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

Rizky Pratama said...

Ijin Copas bos

Kumpulan Puisi said...

postingan yang bagus. salam kunjungan

Karya Unik said...

terimakasih Share nya, langsung dicoba.

Software Kartu Pelajar, Kartu Pramuka dan Kartu Pegawa said...

Terima Kasih Kawan, ini sangat bermanfaat...

Neneng novesha said...

Merubah lebar box nya gimana ya?

Rumah dijual di Jogja said...

Ada contohnya gag Bro

Fauzan Abu Tolkhah said...

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

TotoKingmaster said...

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

sayetmdahri.blogspot.com said...

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

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

Khabaran Unik said...

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

Unknown said...

mantap juga...belajar dulu yaaa

Anonymous said...

cara ganti gambar widget slideshowx gmna ya?

Unknown said...

kereeenn gan.. thx.

Jefry said...

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

Jajan Ngampus said...

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

Droiden Garuda said...

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

situs islam pencerahan said...

Follow my blog

Kang Arnot said...

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

Unknown said...

kok gak bsa gan...

Unknown said...

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...

Adi Wijaya said...

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...

mbogo.net said...

Kyaknya menarik nich, izin cobain ya gan.

Unknown said...

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 ^^

Unknown said...

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

Adinda_Nancy said...

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

Unknown said...

Terimakasih ;;;;)

http://fairuzalhumaira.blogspot.com/

Chandra Septian said...

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

coolie doolie stone said...

Kerenn!!
mau dcoba akh

sukmagie said...

Mampir ya sob :-)
sukses terus deh

Rendi Yenzia Ulfa said...

gak bisa masuk gan. betul gak nih Postingannya?

retno said...

sukses selalu ya , makasih

retno said...

makasih, postingannya sangat bermanfaat

giant said...

thanks infonya, sukses selalu..

tiara said...

keren postingannya,sukses ya

gilang said...

makasih dah berbagi ilmunya,,

gladis said...

wow infonya keren banget,

gladis said...

bermanfaat banget informasinya ,,thanks ya

sederhana said...

terima kasih banget buat infonya ,

anwar said...

referensinya mantap bos....

Kang Trick said...

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

faul said...

terima kasih infonya...mantab...

Unknown said...

gk muncul gan padahal udah diganti ama url punya saya

pernak-pernik lucu said...

Bisa gan,tapi agak berat loadingnya

krist said...

kalau mau pasang slide antar label gimana caranya ya

Anonymous said...

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

Unknown said...

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

Cakrawala said...

Artikelnya lumayan bantu banget neh ...

Dedi said...

Bagus dan membantu banget

Unknown said...

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

Unknown said...

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

Paket catering pernikahan said...

Nice your post