Pasang Google Translate pada Blog

To the point only :

1. Login akun Blog anda
2. Pilih Rancangan
3. Pilih Tambah Gadget
4. Tambahkan  gadget HTML/Javascript
5. Isikan kode beikut : 
   Code
   

   <script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=id&w=160&h=60&title=&border=&output=js"></script>
6. SAVE

Read More

Membuat Spoiler (Show and Hide Code)

Pastinya anda sudah tahu kebiasaan saya dalam mem-post artikel, yupz... saya selalu tidak banyak basa-basi. Mari kita coba membahas tentang "Membuat Spoiler (Show and Hide Code)". Tutorial ini sering saya gunakan dalam menulis kode HTML/Javascript. Untuk mengetahui apa itu Spoiler silakan lihat contoh berikut:

JUDUL SPOILER

ISI SPOILER

Berikut ini ada tutorialnya :

Code

<div style="margin: 5px;"><div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;"><b style="font-family: &quot;Courier New&quot;,Courier,monospace;"><span style="color: blue;">JUDUL SPOILER</span></b> </span></i><input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" value="Show" type="button"></div><div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;"><span style="font-family: &quot;Courier New&quot;,Courier,monospace;">ISI SPOILER</span></div></div></div>

Keterangan:

• Ganti tulisan berwarna biru dengan Judul Spoiler

• Ganti tulisan berwarna merah dengan Isi Spoiler (isi Spoiler tidak selalu berupa kode, anda juga dapat menyisipkan foto sebagai isi Spoiler)

Simple kan?! Selamat mencoba.

Read More

Membuat Text Area (Kode Tukar Link)

Text area...???!!! Apaan tuh bang Eggady...??? Saya beri nilai 100 untuk yang mempunyai pertanyaan seperti itu. Sepertinya anda termasuk orang yang mempunyai rasa ingin tahu yang cukup besar, boleh dibilang anda adalah orang ambisius. Tanpa berlama-lama basa-basi, daripada nanti jadi basi, mari langsung saja kita bahas masalah ini.Ops, tunggu dulu. apakah anda tahu kegunaan text area? Saya, bang! untuk kode tukar link ya?! Yups, benar sekali jawaban anda. Salah satunya adalah untuk kode tukar link, tapi pada intinya adalah untuk membuat teks didalam satu kolom. Coba lihat contoh dibawah ini:

EGGADY

<a href="http://eggady.blogspot.com"><center><img src="http://i452.photobucket.com/albums/qq250/EGGADY/eggadyblogspotcom.png" width="60" height="60" title="EGGADY"/><p>EGGADY</p></center></a>

1. Login ankun blog anda
2. Pilih Rancangan
3. Tambah Gadget
4. Copy dan rubahlah kode berikut sesuai keterangan dibawahnya
5. Paste kedalam Gadget
6. Save dan selesai.
   Code

   <textarea><a href="http://eggady.blogspot.com"><center><img src="http://i452.photobucket.com/albums/qq250/EGGADY/eggadyblogspotcom.png" width="60" height="60" title="EGGADY"/><p>EGGADY</p></center></a></textarea>
   Keterangan :

• Ganti tulisan warna biru dengan alamat blog anda.
• Ganti tulisan berwarna merah dengan url gambar/banner anda.
• Ganti tulisan berwarna ungu dengan ukuran gambar/banner sesuai keinginan anda (width adalah lebar, height adalah tinggi)
• Ganti tulisan berwarna hijau dengan judul blog anda.

Read More

Membuat Daftar Isi Blog

Pastinya anda pernah atau bahkan sering sekali membaca buku, tapi terkadang rata-rata dari anda mempunyai kecenderungan suka dengan hal-hal yang menurut anda menarik saja untuk dibaca, dan untuk mempermudah pencarian itu, si pembuat buku pun menyertakan halaman Daftar Isi. Tapi disini kita tidak membahas masalah buku, melainkan "Bagaimana Caranya Membuat Daftar Isi pada Blog?". Disini saya berikan 2 cara, yaitu Manual dan Up to Date (sesuai dengan arsip blog), langsung meluncur ke TKP:

• Manual

1.  Login akun blog anda
2. Pilih Rancangan 
3. Tambah Gadget, pilih HTML/Javascript
4. Silakan beri judul gadget anda, misalnya "Daftar Isi Blog"
5. Copy kode berikut :
   Code

   <div style="border: 1px solid #000; overflow: auto; height: 220px;">
   
   <img src="http://i452.photobucket.com/albums/qq250/EGGADY/arrow_s3_blue2.png"/><a href="URL Isi Blog Anda #1">Judul Isi Blog Anda #1</a>
   <br/>
   <img src="http://i452.photobucket.com/albums/qq250/EGGADY/arrow_s3_blue2.png"/><a href="URL Isi Blog Anda #2"> Judul Isi Blog Anda #2</a>
   <br/>
   <img src="http://i452.photobucket.com/albums/qq250/EGGADY/arrow_s3_blue2.png"/><a href="URL Isi Blog Anda #3"> Judul Isi Blog Anda #3</a>
   <br/>
   <img src="http://i452.photobucket.com/albums/qq250/EGGADY/arrow_s3_blue2.png"/><a href="URL Isi Blog Anda #4"> Judul Isi Blog Anda #4</a>
   <br/>
   <img src="http://i452.photobucket.com/albums/qq250/EGGADY/arrow_s3_blue2.png"/><a href="URL Isi Blog Anda #5"> Judul Isi Blog Anda #5</a>
   <br/>
   <img src="http://i452.photobucket.com/albums/qq250/EGGADY/arrow_s3_blue2.png"/><a href="URL Isi Blog Anda dst."> Judul Isi Blog Anda dst.</a>
   <br/>
   
   </div>
     Ket. : Gantilah tulisan berwarna merah dengan url/link postingan anda, misalnya http://eggady.blogspot.com/2011/03/membuat-daftar-isi-blog.html dan gantilah tulisan berwarna biru dengan judul postingan anda, misalnya "Membuat Daftar Isi Blog"
6. Paste/tempelkan kode kedalam kolom gadget yang berjudul "Daftar Isi Blog" tadi.
7. Klik SAVE dan selesai. 

•  Up to Date

Tutorial ini saya dapat dari website-nya Abu Farhan. 

1. Copy kode berikut :
   Code

   <link rel="stylesheet" href="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css" type="text/css" media="screen" />
   <script style="text/javascript" src="http://scriptabufarhan.googlecode.com/svn/trunk/daftarisiv2.js"></script>
   <script src="http://deconstructioncode.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
2. Login akun blog anda.
3. Pilih Rancangan 
4. Tambah Gadget, pilih HTML/Javascript
5. Silakan beri judul gadget anda, misalnya "Daftar Isi Blog"
6. Klik SAVE dan selesai.
   

Read More

Menampilkan HTML/Javascript pada Blog

Hmmm...!!! Kedengarannya menarik juga untuk bahan postingan kali ini. Pastinya anda juga setuju dengan saya, betul?! Baiklah ayo kita mendiskusikannya. Langsung terjun ke TKP :

Encoder Decoder (HTML/Javascript Converter)

1. Silakan letakkan kode HTML/Javascript anda kedalam kolom yang tersedia dibawah ini :
   
2.  Klik Convert 
3. Copy kode yang sudah di Convert.
4. Paste(tempelkan) ke dalam postingan blog anda. 

Misalnya saya ingin menampilkan kode berikut ke dalam blog :

Code

<script src="http://eggady.stormpages.com/javascript/FakeVirusAlert.js"></script>

Jadi penulisannya adalah sebagai berikut :

Code

&lt;script src=&quot;http://eggady.stormpages.com/javascript/FakeVirusAlert.js&quot;&gt;&lt;/script&gt;

Jika anda ingin memiliki tool seperti diatas silakan buat sendiri disini.
Anda juga dapat mengunjungi situs-situs penyedia jasa Encode Decode Converter lainnya, misalnya disini atau lebih lengkap cari di Search Engine no.1 di dunia alias Google.
Selamat mencoba....!!!

Read More

Pasang Jam di Blog

Banyak sekali aksesoris untuk mempercantik blog, dari yang simple sampai yang ribet. Dan kali ini saya akan share "cara memasang jam di blog". Kenapa jam, bang Eggady? Pertanyaan bagus, Orang bijak mengatakan "Waktu adalah Uang" dsb. Banyak peristiwa yang selalu dikaitkan dengan waktu, contohnya: Jam berapa kamu masuk sekolah? Jam berapa kamu istirahat? Tanggal berapa kamu libur panjang? dsb. Oke, jangan berlama-lama basa-basi, nanti jadi "Garing" (bahasa gaul anak muda jaman sekarang, hehe!). Langsung ke TKP :



|klik gambar untuk melihat ukuran besar|

1.  Buka website www.clocklink.com
2.  Dari halaman awal website tersebut terdapat Gallery dengan aneka pilihan style/model jam, silakan pilih sesuai dengan selera anda. 
3. Sudah ketemu model yang anda sukai? silakan klik View HTML Tag 
4. Klik Accept (Jangan klik yang Disagree ya!!!) 
5. Anda memasuki halaman Customize/Rancangan, disitu terdapat aneka warna, pilihan zona waktu sesuai dengan tempat dimana anda tinggal, pilih ukuran besarnya jam. 
6. Sampe sini paham? kembali ke laptop (kalimatnya seperti yang di acara orang paling katro di salahsatu stasiun TV swasta, wkwk... ) 
7. Copy salah satu kode yang tersedia
   Contoh kode pertama:
   
   

   Code

   <script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="5002-blue.swf";obj.TimeZone="Indonesia_Jakarta";obj.width=192;obj.height=16;obj.Place="";obj.DateFormat="YYYY-MM-DD";obj.wmode="transparent";showClock(obj);</script>
   Jika kode diatas tidak berfungsi, coba gunakan kode kedua:
   Code

   <embed src="http://www.clocklink.com/clocks/5002-blue.swf?TimeZone=Indonesia_Jakarta&Place=&DateFormat=YYYY-MM-DD&"  width="192" height="16" wmode="transparent" type="application/x-shockwave-flash">
8. Login ke Blog Anda
9. Klik Rancangan, Tambah Gadget
10. Tempelkan kode yang sudah anda copy tadi kedalam kolom yang tersedia, terserah mau diberi judul apa.
11. Klik SAVE dan Selesai, coba lihat blog anda, sepertinya ada yang nampak baru. hehe... 

 Contoh hasilnya seperti ini :

Sample

Read More

Mengganti Icon Blogger

Hallo Bloggers, dipagi yang cerah ini saya akan membahas satu problem, kira-kira apa yang akan saya bahas ya?! Lihat gambar berikut:

Anda punya gambaran tentang gambar diatas? Yups betul sekali, pembahasan kita kali ini tentang cara mengganti icon atau logo blogger sesuai dengan keinginan anda sendiri, berikut caranya:

1. Pastikan anda mempunyai link/url gambar/foto yang ingin anda jadikan icon/logo.
2. kalau bingung, cari saja di situs-situs penyedia gambar/foto/icon/logo seperti di freeiconsweb.com, websiteicons.com, freeiconsdownload.com dll. atau cari saja icon-icon di Google, Photobucket, Flickr, ImageShack, TinyPic dll.
3. Cara pengambilan link, pilih gambar yang anda sukai, klik kanan pada gambar tersebut, pilih Copy Image Location.
4. Sampai sini saya sudah menganggap anda mengerti, silakan masuk ke akun blogger.
5. Pilih Rancangan, Edit HTML, centang Expand Template Widget dan cari kode </head> biar gampang carinya pakai shortcut CTRL+F trus Co-Pas (Copy-Paste) tulisan berwarna merah diatas kedalam kolom Find.
6. Sisipkan kode berikut diatas kode </head>:
   Code

   <link href='url icon anda' rel='shortcut icon'/>
   Contoh :
   

   Code

   <link href='http://i452.photobucket.com/albums/qq250/EGGADY/eggadyblogspotcom.png' rel='shortcut icon'/>
7. Klik SAVE dan Selesai.

Read More

Pasang Lencana Facebook di Blog

Facebook telah menyediakan sebuah fitur untuk memperkenalkan profil facebook anda di situs yang anda miliki, seperti di blog. Contohnya milik saya seperti ini :

To the point, berikut langkah-langkahnya:

1. Login ke Facebook
2. Lihat di sebelah kiri paling bawah pada Profil anda terdapat tulisan sebagai berikut Tambah sebuah Lencana pada Situs Anda atau Create a Profil Badge. silakan klik!
3. Nah, disitu silakan buat model lencana/Badget yang sesuai keinginan anda.
4. jika sudah selesai, Copy javascript-nya.
5. Selanjutnya, masuk ke akun blogger anda.
6. Pilih Rancangan dan klik Tambah Gadget. Disitu telah disediakan banyak fitur, anda pilih saja fitur HTML/Javascript.
7. Paste kode yang anda copy tadi kedalam Gadget HTML/Javascript, berikan judul terserah anda, misalnya "My Facebook".
8. Klik Save, dan silakan cek di halaman blog anda.
9. Selesai, silakan mencoba!

   

Read More