Saturday, August 20, 2011

Membuat Efek Link Warna Pelangi

Membuat Efek Link Warna Pelangi - trik ini menarik banget, sebab semua link yang ada di blog kita bakalan jadi warna-warni kalo disorot ama kursor mouse. Trik ini juga bisa ngebuat tampilan blog kita jadi cantik ‘n lebih terlihat dinamis . .
 
 
 
 
Caranya:
 Login dulu ke blogger.com
 Pilih menu Design
 Klik Add a Gadget
 Pilih HTML/JavaScript
 Masukkan JavaScript di bawah ini . . .

<script src="http://agungxzeg.googlecode.com/files/rainbowlink.js" type="text/javascript"></script>

 Klik Save

 Sekarang coba liat blognya deh, terus sorot link pake mouse .. adakah yang berubah??? Eapz, kalo link menjadi warna-warni ketika disorot pake mouse, itu berarti triknya udah sukses. source

Cara Membuat Link

Cara Membuat Link - urgghhhhh... malem ini posting apaan ea???
bingung.. tapi daripada blog gw jadi kosong, mending gw coba nulis tentang hal yang simpel tapi merupakan salah satu elemen penting dalam dunia blogging.. elemen penting ini biasa kita sebut dengan "link" ..

Ok .. lets begin ..
Apa itu link?? Menurut gw sih link itu adalah suatu tautan yang digunain buat menuju website lain atau halaman lain suatu website. Link bisa berupa teks maupun gambar.
bingung ea?? Haha… kalo pengen tau pengertian yang sebenarnya dari link, sobat blogger bisa cari di google, yahoo atau situs penyedia informasi lainnya ..

gimana sih cara ngebuat link??? ..
yang perlu kita gunain adalah satu script HTML untuk link ..
Ini scriptnya:

<a href="url tujuan">teks yang akan tampil sebagai link</a>

Link yang dibuat dengan script diatas akan terbuka di tab yang sama dengan tab yang lagi kita gunain kalo di klik. Terus gimana caranya biar link yang kita buat bisa terbuka di tab baru kalo di klik?? ..
Kita tinggal tambahin kode aja di script diatas ..
Ini kodenya: target="_blank"

Kalo udah ditambahin, hasilnya jadi kaya gini:

<a href="url tujuan" target="_blank ">teks yang akan tampil sebagai link</a>

Catatan:
 Teks yang berwarna hijau bisa diisi dengan url tujuan link
 Teks yang berwarna merah adalah teks yang akan ditampilkan sebagai link

Ternyata cara ngebuat link itu ga sulit ea!?? ..

Sory banget kalo posting gw ini kesannya jadi kaya ngeguruin.. sumpah suer deh, bukan itu maksud gw ..
 gw cuma pengen berbagi ilmu aja ama sobat blogger semua .. source

Menambahkan Scroll Button di Arsip Blog

Menambahkan Scroll Button di Arsip Blog - Pernah ga ngeliat satu web/blog yang arsip blognya banyak banget???
Terus coba perhatiin deh apa yang terjadi ama tampilan arsip blognya !!! yupz… tampilannya jadi berjejer sangat panjang ke bawah ‘n memberikan kesan yang engga rapi buat yang ngeliat blog tersebut. Ini bukan merupakan suatu hal yang aneh, sebab arsip blog bawaan standar memang di rancang tampil seperti itu.

Buat ngakalinnya, kita cukup nambahin scroll button aja di arsip blog tersebut. Apa efeknya buat blog kita?? Penambahan scroll button sangat berguna, sebab arsip blog dapat dilihat secara bergantian dengan cara ng-drag scroll button tersebut sehingga arsip blog tidak akan memakan ruang di side bar blog kita.

Udah ah … kayaknya terlalu banyak basa-basi, nih gw kasih tau cara buat nambahin scroll buttonnya . . .

 Login dulu ke blogger.com
 Pilih menu "Design"
 Klik "Edit HTML"
 buat jaga-jaga kalo terjadi kesalahan, sebaiknya backup dulu template yang kita gunain, caranya klik "Download Full Template"
 Beri tanda centang pada "Expand Template Widget"
 Cari kode ini <div id='ArchiveList'> (supaya lebih gampang, tekan ctrl+f ‘n masukan kode yang dicari)
 Kalo udah ketemu, copy/paste kode di bawah ini tepat sebelum kode <div id='ArchiveList'>

<div style='overflow:auto; width:ancho; height:100px;'>

 Kalo udah, tambahin kode </div> di atas kode <b:include name='quickedit'/>

Supaya lebih jelas, coba perhatiin beberapa kode yang ada dibawah ini deh !!

<div style='overflow:auto; width:ancho; height:100px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:include name='quickedit'/>

 Klik "Save Template"

Catatan:
 Teks warna merah adalah posisi dimana kode harus diletakkan
 Teks warna hijau adalah ukuran dari tinggi kotak arsip blog yang udah kita tambahin scroll button. source

Cara Membuat Teks Warna Pelangi (Rainbow Text)

Cara Membuat Teks Warna Pelangi (Rainbow Text) - Masih pengen ngomongin tentang cara ngehias blog nih. . .
Setelah sebelumnya gw share tentang cara Membuat Efek Link Warna Pelangi, sekarang gw mau coba share tentang Cara Membuat Teks Warna Pelangi (Rainbow Teks).

Teks Warna Pelangi???
Eapz.. Ternyata bukan hanya link, tapi teks juga dapat kita modifikasi agar terlihat cantik.
Hmmmmm... Masih bingung ea??
coba liat contohnya dibawah ini deh!!
AGUNG X-ZEG INDRAGUNA'S WORLD

Tertarik??
Untuk membuat teks warna pelangi seperti contoh di atas, kita hanya perlu menggunakan script/kode di bawah ini . . .

<b>
<script>
var text="AGUNG X-ZEG INDRAGUNA'S WORLD"
var speed=50
if (document.all||document.getElementById){
document.write('<span id="highlight">' + text + '</span>')
var storetext=document.getElementById? document.getElementById("highlight") : document.all.highlight
}
else
document.write(text)
var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")
var r=1
var g=1
var b=1
var seq=1
function changetext(){
rainbow="#"+hex[r]+hex[g]+hex[b]
storetext.style.color=rainbow
}
function change(){
if (seq==6){
b--
if (b==0)
seq=1
}
if (seq==5){
r++
if (r==12)
seq=6
}
if (seq==4){
g--
if (g==0)
seq=5
}
if (seq==3){
b++
if (b==12)
seq=4
}
if (seq==2){
r--
if (r==0)
seq=3
}
if (seq==1){
g++
if (g==12)
seq=2
}
changetext()
}
function starteffect(){
if (document.all||document.getElementById)
flash=setInterval("change()",speed)
}
starteffect()
</script>
</b>
 Sepertinya engga usah dijelasin panjang lebar lagi, gw yakin sobat blogger udah tau apa yang harus dilakuin dengan kode di atas. source

Cara Menghilangkan Navigation Bar di Blog

Menghilangkan Navigation Bar di Blog - Navigation Bar (Navbar) adalah salah satu fasilitas yang dimiliki oleh Blogspot/Blogger, bentuknya kotak kecil memanjang secara horizontal di bagian paling atas blog.. itu tuh.. yang ada di bagian paling atas blog ini.!!
Pernah mikir buat ngilangin navigation bar di blog kita engga??? ..kalo gw sih pernah.. bahkan pernah nyoba…
 
 
Hmmm.. mau tau caranya???
Gampang ‘n simpel sih.. tapi cukup manjur lah ..
Caranya:
 Login dulu ke blogger.com
 Pilih menu Design
 Klik Edit HTML
 Cari kode ini /* Variable definitions (supaya lebih mudah, tekan ctrl+f)
 Copy/paste script di bawah ini tepat di atas kode /* Variable definitions

#navbar-iframe {display: none !important;}

 Klik Save

udah selesai tuh caranya.. coba cek deh blognya, udah ilang apa belom navbarnya!!??

Sekarang yang jadi pertanyaan adalah, boleh ga sih ngilangin navbar blogger.com???? Apa ngilangin navbar itu ga melanggar TOS (Term Of Service) dari blogger.com sehingga blog kita bakalan di blacklist atau lebih parahnya di banned??? …
Gw ga tau pasti mengenai hal ini.. tapi buat jadi bahan pertimbangan, coba blogwalking deh.. banyak blogger yang di blognya engga ada navbarnya..
Apakah ini berarti ngilangin navbar di bolehkan??? … Gw masih tetep ga tau..
 
Sebenernya digunain atau engganya trik buat ngilangin navbar di atas tergantung keyakinan sobat blogger semua.. kalo kalian yakin ngilangin navbar blog itu aman, ea lakuin aja … kalo engga yakin, ea ga usah dilakuin.. toh tanpa ngilangin navbar juga blog kita masih bisa keliatan cantik kan?? … source

Cara Pasang Energy Saving Mode dengan Gambar

Cara Pasang Energy Saving Mode dengan Gambar - Sebenernya pagi ini engga ada niat buat posting.. tapi berhubung ada visitor yang nanya tentang cara pasang energy saving mode dengan gambar seperti yang gw pasang di blog ini, ea udah deh gw mutusin buat posting aja, lagian udah lama juga kan gw engga update postingan di blog ini!??

Langsung aja deh, buat pasang energy saving mode dengan gambar, sobat blogger bisa ngikutin langkah-langkah dibawah ini . . .

Langkah pertama
1. Login Ke Blogger.com
2. Pilih Menu "Design"
3. Klik "Edit HTML"
4. Cari Kode </head> (biar gampang, pake ctrl+f)
5. Copy/Paste kode dibawah ini tepat di atas kode </head>

<!-- agungxzeg -->
<script language='javascript' src='http://agungxzeg.googlecode.com/files/agungxzegscreensaver11.js' type='text/javascript'></script>
<!-- agungxzeg -->


6. Klik Save Template"

Langkah kedua
1. Masuk ke menu "Page Elements"
2. Klik "Add a Gadget"
3. Pilih "HTML/JavaScript"
4. Masukkan kode di bawah ini

<style type='text/css'>
div#energysaving, div#energysaving * { -moz-border-radius: 0; -webkit-border-radius: 0; border: 0; background: url(url gambar sobat blogger) no-repeat center center fixed black; }
div#energysaving p span {display:none;visibility:hidden;}
</style>


5. Klik "Save"

 Setau gw sih ada dua cara buat pasang energy saving mode dengan gambar. pertama, dengan edit JavaScript terus di pasang dengan cara biasa. kedua, dengan langkah-langkah seperti yang gw posting di atas. tapi menurut gw pribadi, cara di atas adalah cara yang paling gampang buat pasang energy saving mode dengan gambar. source

Cara Memasang AddThis Share Button di Blog

Cara Pasang AddThis Share Button di Blog - Memasang share button memang menguntungkan bagi pemilik blog. Kenapa gw bilang menguntungkan?? Sebab dengan memasang share button akan lebih memudahkan para pengunjung untuk berbagi informasi menarik yang ada di blog kita. Selain itu, memasang share button adalah salah satu cara promosi blog yang paling efektif karena kita dapat langsung berbagi informasi di berbagai media sosial seperti facebook, twitter dan berbagai media sosial lainnya.
Sebenarnya blogger.com sudah menyediakan fasilitas share button sendiri. Tapi buat gw pribadi share button bawaan blogger.com kurang memuaskan karena hanya dapat mengakses beberapa media sosial aja. maka dari itu, kali ini gw mau coba share tentang Cara Pasang AddThis Share Button Di Blog.

Kenapa AddThis share button?? Alasannya simpel sih, AddThis share button yang disediakan oleh addthis.com mempunyai nilai unik sendiri (menurut gw). Bentuknya yang kecil dan dapat mengakses ke banyak media sosial, mungkin ini yang menjadi nilai plus yang utama. Selain itu, kita dapat memilih jenis AddThis share button yang kita inginkan. Ups... ampir lupa, AddThis share button juga udah banyak dipake di banyak website/blog loh. Hal ini membuktikan AddThis share button udah diakui oleh banyak pihak.

Hmm... tertarik buat masang AddThis share button di blog???
coba ikuti langkah-langkah dibawah ini !!

Langkah pertama
1. Silahkan Masuk ke addthis.com
2. Kemudian pilih jenis tombol yang diinginkan dan Pilih "No, just give me the button"
3. Klik "Get Your Button" dan Copy Script yang diberikan

Langkah Kedua
1. Login ke blogger.com
2. Pilih menu "Design"
3. Klik "Edit HTML"
4. Buat Jaga-jaga, back up dulu template sobat blogger
5. Beri tanda centang pada "Expand Template Widget"
6. Cari kode <div class='post-header-line-1'> (untuk header) atau kode <div class='post-footer'> (untuk footer). kalo engga ada, coba cari kode yang mirip dengan kedua kode tersebut !!
7. Letakkan kode share button yang didapat dari addthis.com tadi setelah salah satu kode di atas (poin no. 6)
8. Klik "Save Template"
Bukan hanya AddThis share button yang disediakan oleh addthis.com, cara pemasangan share button yang lainnya pun akan sama dengan langkah-langkah di atas. Tapi dikarenakan sharing kali ini gw fokusin sama AddThis share button yang disediakan oleh addthis.com, maka langkah-langkahnya gw sesuaikan. source