Rabu, 30 November 2011

Edit
Posted by with No comments

Cara memasang gambar animasi lucu di pojok blog (widget animasi blog gratis)


Cara menampilkan gambar animasi di pojok blog. Terkadang untuk menghias blog agar tampak lebih menarik maka bisa memasang gambar animasi di blog.Bisa ditempatkan di pojok atas (kiri dan kanan), pojok bawah kiri dan kanan, atau semua pojok diisi gambar lucu-lucu.

Untuk menampilkan gambar lucu, cukup copy salah satu script html di bawah ini kemudian masukkan ke dalam gadget html. Script ini saya buat menggunakan kode html ditambah gambar dari situs sweetim.

Contoh dan scriptnya bisa dilihat di bawah ini :
1.Gajah loncat



Script:

<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BC.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget-Animasi</a></center></small></div>




2. Boring


Script :
<div style="position: fixed; bottom: 0px; left: 20px;width:80px;height:120px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002016B.gif" border="0" /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget-Animasi</a></center></small></div>

3.Tuyul ketawa


Script:

<div style="position: fixed; bottom: 0px; right: 20px;width:82px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002031F.gif" border="0" /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget-Animasi</a></center></small></div>


4.Boneka joget


Script :

<div style="position: fixed; bottom: 0px; left: 20px;width:82px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002013F.gif" border="0" /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget-Animasi</a></center></small></div>


5. Panda main bola


Script :

<div style="position: fixed; bottom: 0px; right: 30px;width:160px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002032D.gif" border="0" /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget-Animasi-Blog</a></center></small></div>



6. Tuyul baring


Script :
<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:100px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/0002031E.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Free-Widget-Animasi</a></center></small></div>

7. Panda biru



Script

<div style="position: fixed; bottom: 0px; left: 20px;width:100px;height:100px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/0002033D.gif" title="Click to get more." /></a>
<small><center><a href="http://www.komputerseo.com" target="_blank">Free-Widget-Animasi</a></center></small></div>

8. Panah



Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:210px;height:120px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020236.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>




9. Bunga




Script :

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020322.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>


10.Anjing laut


Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203B5.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>


11.Lumba-lumba


Script :

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BA.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>

12.Kucing tidur



Script :

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:140px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203C0.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>

13.Kelinci


Script :
<div style="position: fixed; bottom: 0px; left: 10px;width:125px;height:160px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203A0.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>


14.Dragon


Script:

<div style="position: fixed; bottom: 0px; left: 10px;width:150px;height:130px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020478.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>


15.Ikan


Script :

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:130px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020479.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>


16.Pinguin


Script :

<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020484.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>

17. Helikopter


Script :
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://www.sweetim.com/s.asp?im=gen&lpver=3&ref=10" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020389.gif" title="Click to get more." /></a><small><center><a href="http://www.komputerseo.com" target="_blank">Widget Animasi</a></center></small></div>

Anda bisa memilih salah satu script di atas kemudian masukkan ke gadget html/javascript. Jika menggunakan blog wordpress gratisan / blogdetik bisa copy script di atas ke widget text html.

Cara memasang widget animasi ke blog :

1. Pilih script yang tersedia

2. Di Dashboard blogger pilih Rancangan - Elemen halaman

3. Pilih Tambah Gadget

4. Pilih HTML/Javascript

5. Masukkan script animasi ke dalam kotak kontent HTML/Javascript


Follow Me @Novi_priell

Rabu, 23 November 2011

Edit
Posted by with No comments

Cara membuat Galery Photo pada Bloger

Karena kodenya panjang sekali maka langsung saja kita mulai membuat gallery foto pada blogger.  Dalam hal ini kita mempergunakan 16 buah foto.
Cara pembuatan :
  1. upload foto ke hosting (picasa, atau photobucket, atau yang lainnya)
  2. dapatkan url foto yang telah diupload
  3. bikin postingan dalam mode HTML (bukan Compose)
  4. masukkan kode di bawah ini pada postingan
  5. publish dan lihat hasilnya

membuat-galery-foto-blogspot

<div class="snap_preview">
<div>
<span style="color: #0066ff;font-size: medium;">Seribu Wajah Gayus</span></div>
<style type="text/css">.gallery{margin:auto;}.gallery-item{float:left; width:25%;} .gallery-caption { margin-left: 0; }</style>
<div class="gallery snap_nopreview">

<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="http://www.google.co.id/imgres?q=novi+aprian+dewi&um=1&hl=id&client=firefox-a&sa=N&rls=org.mozilla:en-US:official&channel=s&biw=1024&bih=584&tbm=isch&tbnid=ZJGsyw3SIFbk3M:&imgrefurl=http://www.facebook.com/permalink.php%3Fstory_fbid%3D10150178777379881%26id%3D52472954880&docid=Gv9JiGItwI3w1M&imgurl=http://profile.ak.fbcdn.net/hprofile-ak-snc4/274999_100001453692316_436829105_q.jpg&w=50&h=50&ei=cbTMTqLINMqqrAfbkYnpDA&zoom=1&iact=hc&vpx=428&vpy=220&dur=625&hovh=50&hovw=50&tx=81&ty=32&sig=110723411762616835356&page=1&tbnh=50&tbnw=50&start=0&ndsp=18&ved=1t:429,r:2,s:0 " width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgREbdoA4zAnXc6DeNFlblYq-eLvW0aKLG8v9RccwY0HxJiqf3RJoe0qjfljyWqX_IK820uBAiyi2y5OnmbHbG3LRpw6ThWV7gQXVfGGEfCX2ZQPb_L4-bB0d1E8RhT_hiZTO4bSyHiD14/s320/bieeen.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZc84iXTnFWJvD5-HkhzCnm9WtQJhGVhSwYfYjEeeR5oyt7_GkVfKrCt4mvvKjwc-1BY_NeJdWx0GXiO9F0409Ml3s9zT-n0IY3AraHN1nd59Ox4Bld8_OFArwCNHDozNYOJYZHTqmjFM/s320/blankon.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYSB8BpQMC6ZlO5VeZH4GPW5TEi-ncrLaYf7gP0XFsWVvvLYWu-R9_n9IYYe-MexLpuwEnLnUMOt6LFxT3Z9turaI53vL62e2WvnChP9rFNZ1z-FhLYCoR_gtCJV7bQkUWu-JIKEuEqJ4/s320/boxing.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdIp5GxHEo80TtKtDBRE5lrmf8zcX5JJ9mxM8Y88EDRALcdOCGqoVtV_TTgC9b7G_R70Vtikb1dBtafOtGifwj9CO-qJNWotVFroJDdwAn7pnNOC0X_tgzxM18PH-3wEKv5csIo5eu2ug/s320/duits.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjV_CeYcFF2PqwPG-r7wP8Bisyf7rG6uKV33CZayQmb6KpTa4o8iTOoC5TBkYiZr1epz5Xl3n4Fym2J-ydwcZ5bwI7y3zhGCrMyXSw5LvPQ7VR5twsldw0WZM2Vl7FX2cbwfQTIHeu7Q9U/s320/goyang.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcr5otuTdSQZS95GbqiCSO6eu3PXsloBL6hOXCsp_jLmrvUykRRU29XxAvoH5xFroJTAVqxf-laiA1LJh03JSlOtDLDqjcUkmhpXE8GowLIXkN1ILaURT3SmAnyQ0qh1FsBwVXCbKzmxk/s320/hormat.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWhBi9IsJfscR1LVNE1WJxeaZU1R_c2uCp-CH4rqwApbWQj9DCSz6cHntYyUYtvhvCZrBcWygUKfnnGsp_TXoNBEYG9vXO0fUCC0qVCUc0Ys3HD_WKfGkRQ7wB3hUwcyIPdfaDlk1uG2s/s320/jendr.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVILYIF0hQdaA412VAD7nSfXXFvVglBn2mBy_qsx3jQiVHHZvspSLBrrOTPLQ0dOU3paRBESoEsXZR6hvpgkVZbFmoI3iE-tFaqHlvDUVgyoKNNw-Dj52szCdBL1h7_COq4oVeqKzbLck/s320/koran.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGn5znOiGR0PzzqczJZlWtAqjgQkIKoZi1cAuQVzkwMNsXBKrx506IkZbN4Z8eeWAIYtijqpIuxuY7TQf1hB6volcjxc-zlJ4gvLCSPf9L0w_AuFqNNX8k4g9pJ-z_cv1S5pG1QkAx_Cc/s320/samar.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi025oejgVBd5SW8I_LLt9DlAIO7JEiPi8fjprJBGlkTummeoM1ArdjWysFr8G_def2JdpvtfOW1Q6cl_U0k09YXfrccYWMR7lBTOVdKFc5LQgAbsR1QjaG3oFthyphenhyphenYXC1smnx4laYTFU_g/s320/seribu.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh32thqp4cfVcKdNCxpdbHB7i4D1W7wBDmhH-MK40DI_yq874cohYFIjL68m-kTLFR6JYQZ8VEiQPpWZzf5mstw1U5_tNiwEzqVS4P1FR9KMXUX81w6ybcOhykYkq7P8ohO7vaKSSfE_Hc/s320/silat.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXynPuFOCYalfYgHGrXa-NSykqmPtknEPp6Ve3Hi0BKFwHEtxHUiG-ZmUgErZimQMR55l3iCGUULPogNUI9vRPrjEFmWBBzZ9OpBEfk7M_GsJMv858TItAN094Kwzg3PVYg-hb-XOs-rw/s320/wig1.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5jaPc7tpCFgkTuWWLzxdaGbOzKyHxsB-t2dm-OzwNIyv4VbQo-IqYz-ZifbfVPU6nwBDY7iw8q3f54uDifkp5jK7VPhPQlCsRZmjSbtWlA-nH2DjVulvJA1BtJ3WDC3FKhpw4Ht9w-7A/s320/tenis.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTrFDGWWaFuDsH84fyETX_htXPORNfADomo22j5jwlJZPdDxWz_NF9jS2Ym9nkVr_q2GUncA6UXmwigMzFUAuzZPqRquH5sW6wDK7AAhuvl3z1o1RLwFiUitqhIKIzqo0p4osIzav36xs/s320/santai.jpg" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href=" http://brugkembar.blogspot.com/2011/01/cara-membuat-gallery-foto-pada-blogger.html " target="_blank">
<img border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWSsHhiVfELOI-t7ac-GiweTaKQiWnQ8TGa-KgxLNR7mNVdM7xHDsSqVcVqYohSz9hyCVT0qSLdlKekhyphenhyphenhsEvoBXlnhSmNt9pyRqefbPhI88qAd-ytxb2o6xcbtrXimFTnpcV6iKeuS18/s320/kacamata.jpg" width="200" /></a>
</dt>
</dl>
</div>
</div>
Catatan Penting :
  1. Kode yang berwarna merah adalah url foto yang didapatkan dari hosting setelah foto diupload.
  2. Ukuran foto bisa diganti dengan merubah angka 150 dan 200.
  3. Angka 25% adalah prosentase untuk membuat foto berjajar menyamping 4 kolom (rumusnya: 100% dibagi 4 = 25%)
  4. Bila ingin menambah jumlah foto tinggal copy saja mulai kode <dl class="gallery-item"> sampai dengan kode </dl> demikian pula jika ingin menguranginya.
  5. Dalam menuliskan kode harus benar-benar rapat, jangan menggunakan enter, bila masih terdapat ruang kosong maka fungsikanlah backspace untuk menghapusnya sehingga kode menjadi rapat.
  6. Kalau semuanya sudah dilakukan dengan benar, hasilnya bisa dilihat  disini.

Edit
Posted by with No comments
Pasang Tombol Like Facebook dan Twetter

Seperti diketahui kalau tombol share atau berbagi berguna untuk memudahkan para pengunjung blog yang ingin membagikan artikel yang telah dibacanya ke jaringan mereka. Facebook Like, Twitter Tweet dan Google +1 merupakan layanan berbagi yang populer saat ini. AddThis membuatnya mudah bagi Anda untuk memilih versi terbaik dan menambahkannya ke blog Anda. Anda bisa mendapatkan tombol share dari AddThis ini tanpa perlu mendaftar terlebih dahulu. Namun, bila Anda mendaftar maka Anda akan mendapat AddThis Analytics Summary secara berkala.
Berikut ini langkah-langkah dalam memasang tombol share versi tersebut di Blogger.
1. Masuk ke akun Blogger Anda.
2. Kunjungi AddThis di http://www.addthis.com/
3. Klik Join Now bila ingin mendaftar atau langsung pilih tombol share seperti gambar di bawah ini lalu klik Blogger, WordPress anda more options.

4. Pada menu Options, pilih Platform Blogger.
5. Klik tombol Install Blogger Widget.
6. Kemudian klik lagi tombol Install Blogger Widget.
7. Klik tombol MENAMBAH WIDGET.
8. Selanjutnya pindahkan elemen tersebut ke area di bawah kolom Posting Blog.
9. Klik tombol SIMPAN.
10. Selesai.


Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Pasang Kotak Penelusuran di Blogs

Kotak pencarian merupakan suatu elemen yang dapat memudahkan pengunjung untuk mencari artikel-artikel yang ada di blog tersebut. Dengan memasukkan kata kunci atau keyword lalu mengeklik tombol "Cari" atau menekan tombol "Enter" pada keyboard maka akan muncul link-link artikel yang berhubungan dengan kata kunci tersebut. Bila pada template Blogger Anda tidak tersedia kotak pencarian, Anda dapat menambahkannya sendiri karena fitur ini sudah disediakan oleh Blogger.

Nah, bila Anda ingin menambahkan kotak penelusuran yang didukung oleh Google ini pada blog, silakan simak langkah-langkahnya di bawah ini.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan >> Elemen Laman >> Tambah Gadget.

3. Pilih Kotak Penelusuran.

4. Silakan konfigurasikan widget sesuai keinginan Anda, seperti Judul, Tab yang ingin ditampilkan, lalu klik tombol SIMPAN.



5. Pindahkan elemen ke tempat yang Anda inginkan.

6. Klik tombol SIMPAN.

7. Selesai.
Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Mmebuat Warna Kotak Komentar 
 
Maksud dari judul di atas adalah kita akan memberi warna serta border pada kolom komentar admin sehingga pengunjung dapat dengan mudah membedakan mana komentar admin dan mana komentar pengunjung lain. Warna kotak komentar yang berbeda ini akan terjadi saat kita berkomentar jika kita selaku admin blog telah sign in di Blogger. Contohnya seperti kotak komentar admin di blog ini yang terlihat berbeda dengan komentar lainnya.


Bila tertarik untuk mengaplikasikan trik ini pada template blog Sobat, silakan simak langkah-langkahnya di bawah ini.

1. Masuk ke akun Blogger Sobat.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk berjaga-jaga kalau nanti terjadi kesalahan kita dapat dengan mudah mengembalikan template seperti semula.

4. Beri tanda centang di Expand Template Widget.

5. Cari kode ]]></b:skin>. Tekan Ctrl + F lalu isikan kode untuk mempercepat pencarian.

6. Copy kode di bawah ini lalu paste di atas kode tersebut.

.comment-body-author {
background: #fee6e6; /* Warna Background */
border:2px dotted #d31111; /*Border*/
margin:0;
padding:0 0 0 0px;
}
  • #fee6e6 merupakan warna untuk latar belakang, silakan ganti kode warnanya untuk mengubah warnanya.
  • 2px dotted #d31111 adalah border style dot dengan ketebalan 2 piksel dan berwarna #d31111. Silakan diubah sesuai keinginan Sobat.
7. Cari kode seperti di bawah ini.

<b:if cond='data:comment.authorUrl'>
              <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if>
            <data:commentPostedByMsg/>  
          </dt>

          <dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>

          <dd class='comment-footer'>

8. Tambahkan kode:
<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>
di bawah kode:
<data:commentPostedByMsg/>  
          </dt>
dan kode </b:if> di bawah kode:
<dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>
sehingga hasilnya menjadi seperti di bawah ini.

<b:if cond='data:comment.authorUrl'>
              <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if>
            <data:commentPostedByMsg/>  
          </dt>
<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>
          <dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>
</b:if>
          <dd class='comment-footer'>

9. Klik tombol SIMPAN TEMPLATE.


Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Pasang Update Twitter di Blogs

 Bagaimana cara pasang update Twitter di blog. Nah, buat Sobat-sobat lain yang juga ingin memasang update Twitter di Blogger, silakan simak langkah-langkahnya di bawah ini.

1. Silakan pergi ke halaman http://twitter.com/about/resources/widgets

2. Kemudian klik tab My Website, lalu klik Profil Widget.



3. Selanjutnya isikan username Twitter Sobat pada tab Settings, lalu klik tombol Test Settings untuk melihat pratinjaunya.


4. Untuk mengatur penampilan widget silakan klik tab Preferences, untuk mengatur warna di Appearance sedangkan untuk mengatur ukuran widget di Dimensions. Silakan diatur sesuai keinginan masing-masing. Klik tombol Test Settings untuk melihat preview-nya.

5. Jika sudah selesai semuanya, silakan klik tombol Finish & Grab Code untuk mendapatkan kodenya.


6. Masuk ke akun Blogger Anda.

7. Klik tombol Add to Blogger. (Sobat juga bisa meng-copy paste kodenya secara manual)


8. Klik tombol MENAMBAH WIDGET.

9. Pindahkan elemen Twitter tadi ke tempat yang Sobat inginkan.

10. Klik tombol SIMPAN.


Follow Me @Novi_priell

Edit
Posted by with No comments
 Cara Membuat Daftar Isi Per Label dengan Sroll Box

Untuk membuat daftar isi per label dengan scroll box di sidebar blog, kita dapat menggunakan dua cara. Cara yang pertama adalah dengan membuatnya secara manual. Sedangkan cara yang kedua kita bisa menggunakan sebuah script. Setiap cara memiliki kelebihan dan kekurangannya masing-masing.

Bila kita membuat daftar isi secara manual, maka kita harus memasukkan link dari judul-judul posting satu per satu. Hal ini akan membutuhkan banyak waktu untuk mengerjakannya jika link judul posting yang harus dimasukkan sudah cukup banyak. Namun, dengan cara manual ini tidak begitu memperlambat loading blog.

Sedangkan jika kita menggunakan sebuah script, maka waktu yang diperlukan akan lebih singkat. Namun, pemasangan script ini berpotensi memperlambat loading blog. Script ini saya dapat dari Blog Viky dengan perubahan di bagian scroll box-nya. Dengan script ini kita dapat membuat daftar isi berdasarkan satu label saja atau beberapa label sekaligus. Script ini akan menempatkan posting terbaru pada urutan teratas.

Untuk membuat daftar isi berdasarkan satu label tertentu saja, silakan perhatikan langkah-langkahnya di bawah ini.

1. Setelah Sobat masuk di Blogger, klik Rancangan > Elemen Laman > Tambah Gadget. Kemudian pilih HTML/JavaScript.

2. Berikan judul, lalu copy kode di bawah ini dan paste di Konten.

<div style="overflow:auto; width:auto; height:100px; padding:5px; border:1px solid #e6e4e3;">
<ol>
<script style="text/javascript">
var numposts = 100;
var standardstyling = true;
</script>
<script type='text/javascript' src='http://mr-form.googlecode.com/files/label-post.js'></script>

<ol>
<script src="http://www.klikmunadi.blogspot.com/feeds/posts/default/-/Jejaring%20Sosial?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>
</ol>
</ol></div>
  • width:auto; menunjukkan lebar scroll box akan mengikuti lebar sidebar.
  • height:100px; menunjukkan tinggi scroll box setinggi 100 piksel. Silakan diganti angkanya untuk mengubah tingginya.
  • border:1px solid #e6e4e3; menunjukkan garis keliling (border) scroll box bergaya solid setebal 1 piksel berwarna #e6e4e3. Silakan disesuaikan dengan keadaan template Sobat.
  • <ol> menunjukkan numbered list, kalau ingin menjadi bullet list silakan diganti dengan <ul>.
  • Ganti klikmunadi.blogspot.com dengan alamat blog Sobat.
  • Ganti Jejaring%20Sosial dengan label yang Sobat inginkan. Penulisan label harus sesuai dengan yang tertera di blog. Perhatikan huruf besar-kecilnya dan spasi diganti dengan %20.
3. Klik tombol SIMPAN.

4. Pindahkan elemen tadi ke tempat yang Sobat inginkan.

5. Klik tombol SIMPAN.

Script di atas hasilnya akan menjadi seperti di bawah ini.


Jika ingin menampilkan lebih dari satu label, silakan ditambahkan script untuk labelnya. Misalnya saya akan menampilkan label Alexa dan Link maka script-nya akan menjadi seperti di bawah ini.

<div style="overflow:auto; width:auto; height:100px; padding:5px; border:1px solid #e6e4e3;">
<ol>
<script style="text/javascript">
var numposts = 100;
var standardstyling = true;
</script>
<script type='text/javascript' src='http://mr-form.googlecode.com/files/label-post.js'></script>

<h3>Alexa</h3>
<ol>
<script src="http://www.klikmunadi.blogspot.com/feeds/posts/default/-/Alexa?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>
</ol>
<br/>

<h3>Link</h3>
<ol>
<script src="http://www.klikmunadi.blogspot.com/feeds/posts/default/-/Link?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script>
</ol>
</ol></div>

Hasilnya menjadi seperti di bawah ini.


    Alexa

    1. Tiga Tiga Satu Satu Satu Satu
    2. Cara Daftar dan Pasang Meta Tag Alexa di Blog
    3. Cara Memasang Alexa Site Stats Button di Blogger
    4. Cara Mengatur Blog Menjadi Homepage
    5. Tips Meningkatkan Peringkat Alexa Sebuah Blog
    6. Cara Memasang Alexa Toolbar di Browser Firefox
    7. Seputar Peringkat Alexa
    8. Cara Pasang Alexa Traffic Rank Button

    Link

    1. Cara Membuat Link "klik di sini" di Blogger
    2. Cara Membuat Link Text Menjadi Huruf Miring Saat Disorot Mouse
    3. Cara Membuat Link Saat Berkomentar di Blogger
    4. Cara Membuat Link di Gmail
    5. Cara Membuat Link atau Tombol Reply Komentar
    6. Cara Membuat Tombol Link
    7. Cara Membuat Semua Link Membuka di Tab Baru
    8. Cara Menghilangkan Garis Bawah pada Link di Blogger
    9. Cara Membuat Link Berkedip-kedip
    10. Cara Membuat Link yang Membuka di Dua Tab Baru
    11. Cara Membuat Link yang Membuka di Tab Baru
    12. Cara Membuat Link Banner Membuka Sendiri Saat Tersentuh Kursor Mouse
    13. Cara Membuat Link di Blogger

Cara di atas merupakan cara yang menggunakan script. Jika Sobat tertarik untuk menggunakan cara manual seperti yang saya terapkan pada blog ini, silakan simak langkah-langkahnya di bawah ini. Sebelum mengikuti cara ini, silakan Sobat memasang widget daftar isi karya Abu Farhan seperti yang terpasang di blog ini.

1. Buka daftar isi blog Sobat.

2. Blok posting-posting dari label mana yang akan di ambil. Misalnya saya mengambil label Jejaring Sosial juga seperti contoh menggunakan script. Setelah diblok, lalu klik kanan dan pilih Lihat Kode Sumber Teks yang Dipilih. (Saya menggunakan Firefox 5.0)


3. Copy semua teks yang muncul di jendela Sumber DOM yang Dipilih.

4. Masuk ke akun Blogger Sobat.

5. Klik Rancangan > Elemen Laman > Tambah Gadget.

6. Pilih HTML/JavaScript.

7. Beri judul, paste kode tadi di Konten. Silakan diedit dan hapus kata-kata yang tidak diperlukan (seperti kata "New" dan lain-lain) sehingga susunannya akan menjadi seperti di bawah ini.

<ol><li><a href="http://klikmunadi.blogspot.com/2011/06/cara-buat-facebook-page-dan-pasang-like.html">Cara Buat Facebook Page dan Pasang Like Box di Blog</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/05/cara-membuat-akun-facebook.html">Cara Membuat Akun Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-twitter.html">Cara Membuat Akun Twitter</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-di-salingsapacom.html">Cara Membuat Akun di SalingSapa.com</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/07/cara-menghapus-sebuah-halaman-facebook.html">Cara Menghapus Sebuah Halaman Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/02/salingsapacom-situs-jejaring-sosial.html">Salingsapa.com, Situs Jejaring Sosial Islami</a></li></ol>

8. Kemudian berikan kode untuk scroll box-nya, sehingga hasilnya akan menjadi seperti ini.

<div style="overflow:auto; width:auto; height:100px; padding:5px; border:1px solid #e6e4e3;">
<ol><li><a href="http://klikmunadi.blogspot.com/2011/06/cara-buat-facebook-page-dan-pasang-like.html">Cara Buat Facebook Page dan Pasang Like Box di Blog</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/05/cara-membuat-akun-facebook.html">Cara Membuat Akun Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-twitter.html">Cara Membuat Akun Twitter</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/06/cara-membuat-akun-di-salingsapacom.html">Cara Membuat Akun di SalingSapa.com</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/07/cara-menghapus-sebuah-halaman-facebook.html">Cara Menghapus Sebuah Halaman Facebook</a></li>
<li><a href="http://klikmunadi.blogspot.com/2011/02/salingsapacom-situs-jejaring-sosial.html">Salingsapa.com, Situs Jejaring Sosial Islami</a></li></ol>
</div>

9. Klik tombol SIMPAN.

10. Pindahkan elemen ke tempat yang Sobat inginkan.

11. Klik tombol SIMPAN.

Hasilnya menjadi seperti di bawah ini.

Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Memasang Mega Tab Google di Bloger

Menanggapi pertanyaan Sobat David Prasetiawan pada komentar posting yang berjudul Cara Daftar dan Pasang Meta Tag Yahoo! di Blog yang menanyakan tentang pemasangan meta tag Google di blog, maka pada kali ini saya akan coba membahasnya. Dengan memasang meta tag Google ini pada blog, kita berharap Google dapat mengindeks blog kita dengan baik.

Nah, berikut ini adalah langkah-langkah untuk memasang meta tag Google pada Blogger.

1. Silakan kunjungi halaman Webmaster Tools di http://www.google.com/webmasters/tools/

2. Kemudian Sign In dengan menggunakan akun Google.

3. Selanjutnya klik tombol Tambahkan situs yang dipilih pada blog yang ingin ditambahkan meta tag.



4. Klik segitiga hitam pada link Kelola dan klik link Tambahkan atau hapus pemilik.


5. Selanjutnya klik link Verifikasikan dengan menggunakan metode yang berbeda.


6. Pilih Tambahkan tag meta ke beranda situs Anda kemudian copy meta tag yang diberikan oleh Google.


7. Masuk ke akun Blogger Anda.

8. Klik Rancangan > Edit HTML.

9. Paste kode meta tag tadi di bawah kode <head> sebelum bagian <body> pertama, kalau saya sih biasanya meletakkannya di bawah kode <b:include data='blog' name='all-head-content'/>.

10. Klik tombol SIMPAN TEMPLATE.

11. Kembali lagi ke halaman verifikasi tadi dan klik tombol Verifikasi.



Follow Me @Novi_priell

Edit
Posted by with No comments
Memasang Tombol Follow Me On Twetter

Apakah Sobat mempunyai sebuah akun di Twitter? Bila ya, promosikan saja akun Twitter Sobat dengan memasang tombol Follow Me on Twitter di blog. Tombol Follow ini dapat memudahkan pengunjung yang ingin menjadi follower akun Twitter Sobat.
Tombol Follow yang akan kita pasang ini bentuknya seperti di bawah ini.



Ayo diklik tombol Follow di atas untuk menjadi follower klik_munadi di Twitter. Untuk memasang tombol Follow seperti di atas, silakan ikuti langkah-langkahnya di bawah ini.

1. Silakan kunjungi halaman http://twitter.com/about/resources/followbutton

2. Isikan username Sobat.

3. Pilih warna latar belakang yang akan digunakan.

4. Tentukan apakah Sobat mau menampilkan jumlah follower atau tidak di sebelah tombol.

5. Pilih bahasa yang ingin digunakan.



6. Pratinjau atau preview tombol dapat Sobat lihat di sebelah kanan.


7. Selanjutnya copy kode tombol Follow yang muncul.


8. Paste kode tersebut di blog Sobat. Penempatannya terserah Sobat, apakah pada halaman posting atau di sidebar, yang penting dapat dilihat dengan jelas oleh pengunjung blog.

Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Mmembuat Indent Pada Baris Pertama di Blogs


Ada beberapa cara yang dapat kita lakukan saat membuat posting di Blogger agar tampilan teksnya tampak seperti artikel yang ada di koran atau majalah. Misalnya saja dengan membuat drop cap atau membuat posting menjadi dua kolom. Selain itu, kita juga bisa membuat indent kiri pada baris pertama sebuah alinea atau paragraf. Di MS Word indent jenis ini biasa dikenal dengan istilah "First Line Indent".
Untuk membuat "First Line Indent" ini saat membuat posting di Blogger kita perlu menambahkan kode <div style="text-align: justify; text-indent: 0.5in;">teks atau tulisan</div> pada mode Edit HTML. "Justify" menunjukkan perataan teks akan rata kanan-kiri. "0.5in" menunjukkan jarak indent. Ketikkan alinea atau paragraf di teks atau tulisan.


Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Membuat Lencana Facebok Terbuka di Blogs


Bila kita memasang Lencana Facebook di blog Blogger, maka bila diklik Lencana atau Badge tersebut akan terbuka di tab yang sama. Hal ini akan membuat pengunjung kehilangan halaman blog kita karena tergantikan oleh halaman hasil pengeklikan Lencana tersebut. Agar pengunjung tidak kehilangan halaman blog kita, buat saja Lencana tersebut jika diklik akan terbuka di tab baru.

Bagaimana caranya? Caranya cukup mudah yaitu dengan menambahkan kode Lencana Facebook tersebut dengan kode target="_blank" persis seperti kita membuat link terbuka di tab baru. Kode sebuah Lencana Facebook atau Badge kurang lebih seperti di bawah ini.

<!-- Facebook Badge START --><a href="http://www.facebook.com/people/Klik-Munadi/100002086096239" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;" title="Klik Munadi">Klik Munadi</a><br/><a href="http://www.facebook.com/people/Klik-Munadi/100002086096239" target="_TOP" title="Klik Munadi"><img src="http://badge.facebook.com/badge/100002086096239.1187.982418615.png" style="border: 0px;" /></a><br/><a href="http://www.facebook.com/badges/" target="_TOP" style="font-family: &quot;lucida grande&quot;,tahoma,verdana,arial,sans-serif; font-size: 11px; font-variant: normal; font-style: normal; font-weight: normal; color: #3B5998; text-decoration: none;" title="Make your own badge!">Create Your Badge</a><!-- Facebook Badge END -->

Anda ganti saja semua kode target="_TOP" yang ada di kode Lencana dengan kode target="_blank" agar bila diklik link-linknya akan terbuka di tab baru.


Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Memasang Jadwal Shalat di Blogs
Pada postingan terdahulu di blog ini telah dibahas mengenai pemasangan jadwal sholat di blog. Kali ini blog Klik Munadi akan membahas hal yang serupa dan jadwal sholat tersebut masih bersumber dari Republika. Namun, jadwal sholat yang berikut ini memiliki beberapa perbedaan bila dibanding dengan jadwal sholat dari Republika lainnya.


Ukuran jadwal sholat ini tingginya jauh lebih rendah dari yang sebelumnya. Jadwal sholat ini dilengkapi dengan hari, tanggal, dan tahun serta jam kapan jadwal sholat tersebut diakses. Selain itu, tampilannya disertai dengan pesan sponsor. Jadwal sholat ini memuat waktu sholat untuk 56 wilayah atau kota di Indonesia. Embed dari jadwal sholat tersebut adalah:
<iframe src="http://www.republika.co.id/jadwal_sholat/index.php" scrolling="no" width="300" height="130" frameborder="no" framespacing="0"> </iframe>

Jadwal sholat yang satu ini cocok dipasang di sidebar sebuah blog yang mempunyai lebar 300 piksel atau lebih. Namun, bila ingin tetap menaruhnya di sidebar yang kurang dari 300 piksel, kita dapat menggunakan fungsi scroll untuk menyiasatinya. Misalnya, kita akan memasang jadwal sholat ini pada sidebar yang mempunyai lebar 262 piksel atau kurang dari itu, maka kita apit embed jadwal sholat tersebut dengan kode <div style="overflow:auto; width:100%px;"> dan </div>. Sehingga kodenya menjadi seperti di bawah ini.

<div style="overflow:auto; width:100%px;"><iframe src="http://www.republika.co.id/jadwal_sholat/index.php" scrolling="no" width="300" height="130" frameborder="no" framespacing="0"> </iframe></div>

Maka hasilnya adalah seperti di bawah ini:


Untuk memasangnya di sidebar, silakan masuk ke akun Blogger >> Rancangan >> Elemen Laman >> Tambah Gadget >> HTML/JavasScript. Lalu masukkan kodenya di Konten dan Simpan.


Follow Me @Novi_priell

Edit
Posted by with No comments
Cara Memasang Kalender Di Blogs
Bila sobat ingin memasang sebuah kalender di blog, sobat dapat memanfaatkan beragam situs penyedia kalender gratisan. Mereka menyediakan tampilan kalender-kalender yang menarik untuk dilihat sehingga dapat mempercantik tampilan blog sobat. Salah satu situs yang menyediakan kalender adalah Free Blog Content. Untuk memasang kalender di blog silakan sobat ikuti langkah-langkahnya di bawah ini.

  • Kunjungi situs http://www.free-blog-content.com
  • Pilih kategori kalender yang diinginkan.
  • Klik kanan mouse di area kode kalender yang disukai.
  • Klik Pilih Semua (Select All).
  • Klik kanan mouse di area kode yang telah ter-highlight.
  • Klik Salin (Copy).
  • Masuk ke akun Blogger sobat.
  • Di Dasbor, klik Rancangan.
  • Pilih Elemen Laman.
  • Klik Tambah Gadget.
  • Pada Dasar-dasar pilih HTML/Java Script.
  • Isikan Judul yang diinginkan.
  • Klik kanan mouse di kolom Konten kemudian pilih Tempel (Paste).
  • Klik tombol SIMPAN.
  • Pindahkan Elemen ke tempat yang diinginkan.
  • Klik tombol SIMPAN.
  • Klik Lihat Blog untuk melihat hasilnya.

Follow Me @Novi_priell

Edit
Posted by with No comments
 Cara Membuat Album Foto Pada Blogs

Tips cara membuat album foto pada blogspot ini sebenarnya sudah pernah saya berikan beberapa waktu yang lalu disini. Hanya saja posting yang pertama tersebut membahas bagaimana cara membuat slideshow album foto pada blogspot dengan memanfaatkan situs gallery foto yaitu www.slide.com. Untuk mengetahui trik pembuatan album foto di blog tersebut, pembaca boleh membukanya kembali disini. Blogspot sebenarnya menyediakan gadget yang berfungsi untuk membuat slide album foto pada blog kita. Namun, menurut saya gadget ini lebih sederhana jika dibandingkan dengan slideshow yang kita buat dari www.slide.com, sebab tampilan slide foto yang kita dapatkan dari situs www.slide.com tersebut bisa kita customize sesuai kehendak kita mulai dari tipe slide, ukuran, animasi, dan lain-lain. Meskipun demikian, tidak ada salahnya jika kita mencoba gadget slide album foto blogspot ini, sebab kesederhanaan biasanya indentik dengan kemudahan dalam pengaplikasiannya. Berikut langkah-langkah menambah album foto pada blogger:
  1. Login pada akun Blogspot Anda
  2. Klik link menu Tata Letak pada halaman dasbor. Pastikan Anda berada pada sub tab menu Elemen Halaman
  3. Klik link Tambah Gadget pada bagian dimana pembaca ingin memasang slide album foto tersebut
  4. Akan muncul window Tambahkan Gadget yang berisi daftar gadget yang bisa kita tambah. Silahkan cari dan pilih gadget Tampilan Slide
  5. Berikut pengaturannya:
    Judul :
    Isi dengan nama slide foto Anda.
    Sumber :
    • Album Web Picasa. Album ini merupakan album gambar yang telah Anda masukkan pada pada blogspot pembaca misalnya ketika menulis posting. Silahkan klik http://picasaweb.google.com untuk melihat album Anda.
    • Flickr. Flickr merupakan situs yang menyediakan tempat menyimpan foto dan video. Untuk mendapatkan layanan ini, silahkan daftar atau login menggunakan Yahoo ID Anda di www.flickr.com.
    • Photobucket. Ini hampir sama dengan flickr dimana kita bisa menyimpan foto dan video secara online pada situs tersebut. Untuk mendapatkan layanan ini silahkan register di www.photobucket.com
    • Lainnya. Sumber selain yang 3 diatas.
    Pilihan :
    Memilih apakah berdasarkan kata kunci atau berdasarkan album
    Buka link di jendela baru:
    Centang jika ingin foto dibuka pada jendela baru ketika diklik
  6. Sebagai contoh kita menambah slide foto menggunakan Album Web Picasa
    Judul: beri judul slide album
    Sumber : pilih "Album Web Picasa".
    Pilihan : pilih "Album"
    Nama Pengguna : masukkan ID akun Google pembaca. Misalkan akun Google pembaca adalah kampanye@gmail.com, maka isikan "kampanye"
    Album : pilih album yang terdapat pada Album Web Picasa Anda. Perlu diperhatikan bahwa album yang muncul pada list tersebut adalah album yang diperuntukkan untuk "Public". Untuk melakukan pengaturan tersebut, silahkan masuk terlebih dahulu pada http://picasaweb.google.com (masuk menggunakan akun Google Anda). Klik tab "My Photos", setelah itu klik album yang ingin Anda atur parameternya.
    Klik menu "Edit" kemudian pilih sub menu "Album Properties" sehingga akan muncul jendela "Edit album information".
    Lihat dibagian paling bawah, akan ada pilihan "Visibility for this album". Silahkan pilih "Public". Kemudian klik tombol Save changes
  7. Pratinjau album akan terlihat pada jendela tambah gadget tersebut.
  8. Klik tombol SIMPAN
Untuk melihat contoh hasilnya bisa pembaca lihat disini (tapi maaf, gambarnya hanya 2 dan sama pula, jadinya gak kelihatan deh pergantian slidenya)
Selamat mencoba dan jangan lupa meninggalkan komentar ya


Follow Me @Novi_priell
Langganan: Postingan (Atom)