Loading... Please wait

Slideshow flash Cuber Blogger



                                                                     DEMO
untuk tahap pertama lihat script di bawah ini :

tahap 1.
<script src='http://dl.dropbox.com/u/31323979/cu3er/js/swfobject/swfobject.js' 
type='text/javascript'/>
<script type='text/javascript'>
  var flashvars = {};
  flashvars.xml = &quot;http://dl.dropbox.com/u/66187775/config2.xml&quot;;
  flashvars.font = &quot;font.swf&quot;;
  var attributes = {};
  attributes.wmode = &quot;transparent&quot;;
  attributes.id = &quot;slider&quot;;
  swfobject.embedSWF(&quot;http://dl.dropbox.com/u/31323979/cu3er/cu3er.swf&quot;, 
&quot;cu3er-container&quot;, &quot;900&quot;, &quot;400&quot;, &quot;9&quot;, 
&quot;http://dl.dropbox.com/u/31323979/cu3er/js/swfobject/expressInstall.swf&quot;, 
flashvars, attributes);
</script>
untuk yang saya garis bawahiitu... sebenarnya tidak perlu saya jelaskan.. dan anda tidak perlu merubahnya agar tidak terjadi kesalahan...
yang harus anda perhatikan adalah url yang berwarna merah.. itu adalah xml yang berisi tentang configurasi objeck pada box cuber.. di dalamnya adalah code-code untuk memasukan foto yang akan kita pasang ...

jika sudah di lihat , kalian perhatikan code url gambar/link  kira kira seperti ini...
    <slide>
<url>http://dl.dropbox.com/u/66187775/cube/cube1.jpg</url>
<link target="_blank">http://boxfree-88.blogspot.com</link>
    </slide>
anda cukup menganti alamat link gambar dan link tujuannya...
Note:
ouh iya ada cara mudah agar kita dapat meng upload foto yang kita inginkan dengan cepat...
jika anda berminat  silahkan anda kunjungi link  INI.
jika sudah anda cukup download saja softwarenya...jika kurang mengerti silahkan ajukan pertanyaan..
kita mulai ketahap code HTML
tahap 2.
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
   <div id='mygallery'>
<b:section id='123gallery' maxwidgets='1'>
<b:widget id='HTML2' locked='true' title='Slider' type='HTML'>
<b:includable id='main'>

<div class='gallery'>
      <div class='cu3er_resize'>
           <div id='cu3er-container'>
       <a href='http://www.adobe.com/go/getflashplayer'><img  
alt='get adobe flash player'  
src='http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif'/></a>
           </div>

       </div> 
    </div>
</b:includable>
</b:widget>
</b:section>
   </div>
</b:if>
</b:if>
untuk yang bergaris bawah itu jika anda menginginkan slideshow tampil hanya pada bagian halaman blog.. jika ingin tampil di semua halaman tinggal anda hapus saja dengan tag penutupnya...

yang berwarna merah adalah itu alamat url flash player.. agar slide show berjalan dengan sempuran..
dengan catatan flash anda sudah terupdate/terpasang...

menurut saya ini sudah cukup penjelasannya...kita mulai pasang saja ya..
CARA PEMASANGAN PADA TEMPLATE
1. masuk ke blogger anda pilih design/rancangan > edit HTML > 
cari code </head> biar cepat tekan ctrl+F kemudian masukan code di bawah di atas code tadi :

<script src='http://dl.dropbox.com/u/31323979/cu3er/js/swfobject/swfobject.js' 
type='text/javascript'/>
<script type='text/javascript'>
  var flashvars = {};
  flashvars.xml = &quot;http://dl.dropbox.com/u/66187775/config2.xml&quot;;
  flashvars.font = &quot;font.swf&quot;;
  var attributes = {};
  attributes.wmode = &quot;transparent&quot;;
  attributes.id = &quot;slider&quot;;
  swfobject.embedSWF(&quot;http://dl.dropbox.com/u/31323979/cu3er/cu3er.swf&quot;, 
&quot;cu3er-container&quot;, &quot;900&quot;, &quot;400&quot;, &quot;9&quot;, 
&quot;http://dl.dropbox.com/u/31323979/cu3er/js/swfobject/expressInstall.swf&quot;, 
flashvars, attributes);
</script>
2. kemudian copas script dibawah dan simpan dimanapun anda menginginkan slide show ini muncul  :
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
   <div id='mygallery'>
<b:section id='123gallery' maxwidgets='1'>
<b:widget id='HTML2' locked='true' title='Slider' type='HTML'>
<b:includable id='main'>

<div class='gallery'>
      <div class='cu3er_resize'>
           <div id='cu3er-container'>
       <a href='http://www.adobe.com/go/getflashplayer'> <img alt='get adobe 
flash player' 
 src='http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif'/>
</a>
           </div>

       </div> 
    </div>
</b:includable>
</b:widget>
</b:section>
   </div>
</b:if>
</b:if>
3. tahap akhir adalah menggunakan CSS untuk mengatur posisi dan ukuran  jika tata letak kurang baik..

 cari kode ]]></b:skin>  dan simpan css di bawah ini tepat di atas/sebelum code tadi :
* css cu3er
-----------------------*/
.gallery {width:970px;height:525px;margin:0 auto 0 ;background:url
("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmAhLH3c_rj-ecIsoTttBQQyPy8aClnCtkftaI36qCN-_EB-Y4VNrc0cwUnAaJxN0SCY07Sr_Nu9KyHEKtuKxMeoUU9N5HGhzjnP-_xdzlAlPFeOuVX_zVHu0drTdJ76G6sj_HUB5LUDVr/s1600/
simple_bg.png") 
no-repeat scroll center bottom transparent;}
.cu3er_resize {width:970px;margin-top:50px;display:inline-block;}
#cu3er-container {width:970px;outline:0;}

coba untuk di preview dulu atau pratinjau hasilnya... jika anda menggunakan flash block.. langsung publikasikan/publish post.




sumber


Masukkan alamat email kamu disini:

Posting Keren Lainnya : Bloggeron

0 komentar:

:f :D :x B-) b-( :@ x( :? ;;) :-B :| :)) :(( =(( :s :-j :-p :-o :-g :-x

Posting Komentar

Diberdayakan oleh Blogger.

Recent Posts With Thumbnails v3

Recent Posts With Thumbnails v3