Blogger Purworejo Community

Kamis, 03 Januari 2013

membuat link berubah warna bila di sentuh mouse

jika kita menyorot semua link yang ada di blog dengan kursor mouse, link tersebut bakalan berubah warna atau jadi warna-warni. Selain itu trik ini juga bisa membuat tampilan blog kita jadi lebih menarik...

Caranya pun mudah anda tinggal ikuti langkah-langkah berikut:

1.Login ke blogger.com
2.Pilih menu Design Klik Add a Gadget Pilih HTML/JavaScript
3.Masukkan JavaScript di bawah ini
<script src="http://zezen.googlecode.com/files/rainbowlink.js" type="text/javascript"></script>

4.Klik Save

 Nah sekarang bisa anda lihat sendiri blog anda menjadi menarik

Efek salju pada blog

Di tutorial sebelumnya saya telah membahas mengenai cara agar daun berguguran di blog dan kini saya akan membahas mengenai efek salju bertaburan, Berikut langkahnya :

1. Login ke blogger.
2. Masuk ke Rancangan dan pilih Tata Letak
3.Tambah Gadet > HTML javascript
4.pastekan kode kode berikut di HTML javascript :

Kode Untuk Salju Yang berwarna Putih

<script src="http://dapurtutorial.googlecode.com/files/Hujan-salju.js"></script>

Kode Untuk Salju Yang berwarna Merah

<script src="http://dapurtutorial.googlecode.com/files/Hujan-salju-tes.js"></script>

Kode Untuk Salju Yang berwarna Biru

<script src="http://dapurtutorial.googlecode.com/files/Hujan-salju-Biru.js"></script>

Kode Untuk Salju Yang berwarna Hijau

<script src="http://dapurtutorial.googlecode.com/files/Hujan-salju-hijau.js"></script>

Kode Untuk Salju Yang berwarna Kuning

<script src="http://dapurtutorial.googlecode.com/files/Hujan-salju-Kuning.js"></script>

Kode Untuk Salju Yang berwarna Pink

<script src="http://dapurtutorial.googlecode.com/files/Hujan-salju-Pink.js"></script>

5.Simpan

Nah demikian postingan dari saya semoga bermanfaat

Cara buat daftar isi

Daftar isi merupakan halaman yang berisi daftar artikel-artikel diblog kita dengan lengkap. Jadi pengunjung bisa lebih leluasa menjelajah isi blog kita Langsung saja kita pelajari cara membuat daftar isi:

 LANGKAH 1

1. Login ke blogger.
2. Masuk ke Rancangan dan pilih Edit HTML
3. Letakkan kode di bawah ini, di atas kode ]]></b:skin>
#dafis-acc{ font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#333; background:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S-KAWJugl3I/AAAAAAAAEBg/bY_3UzrECSg/d/bg5.gif) repeat-y scroll left center #E7F7FB; padding:2px 0; border:1px solid #339DC6; } .dafis-label{ background:url(http://lh6.ggpht.com/_xcD4JK_dIjU/S-KAVk09KSI/AAAAAAAAEBc/Tqfaca2nwmo/d/bg4.gif) repeat-x scroll 0 0 #E1F4FB; font-weight:bold; line-height:1.4em; overflow:hidden; white-space:nowrap; vertical-align: baseline; margin: 1px 3px; outline: none; cursor: pointer; text-decoration: none; padding: 2px 10px; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.3); border:1px solid #2F94BA; } .dafis-label:hover{ background:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S-KAVlLiuVI/AAAAAAAAEBU/Hd-n_8N7qak/d/bg2.gif) repeat-x scroll 0 0 #E1F4FB; color:#003366; } .dafis-daf ol{ margin:0 0 0 30px !important; padding:0 !important; } .dafis-daf ol li{ background-color:#C9E9F4; line-height:1.5em; margin:1px 3px !important; white-space:nowrap; text-align:left; border:1px solid #339DC6; } .dafis-daf ol li a{ text-decoration: none !important; color:#333 !important; display:block; padding-left:10px; } .dafis-daf ol li a:hover{ background: #7BC4DF; border-left: 5px #333 solid; padding-left: 5px; text-shadow: 0 1px 1px rgba(0,0,0,.3); }

4. Selenjutnya cari kode </head>, , lalu letakkan kode dibawah ini diatas kode .</head>,
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'/>

5. Simpan template.


 LANGKAH 2

 1. Klik menu Posting, kemudian masuk ke Entri baru. Masukkan kode di bawah ini pada postingan, caranya seperti membuat postingan seperti biasa tetapi dalam mode HTML.
<div style="border: 1px solid rgb(204, 204, 204); height: 225px; margin: auto; overflow: auto; padding: 3px; text-align: left; width: 100%;"><br /> <script src="http://litehoster.mobie.in/file/js/datar.isi.js"></script><script src="http://artikelsederhan.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script></div>

Ubah http://artikelsederhan.blogspot.com/ dengan nama blog sobat

 2.Klik Publikasikan

 selesai deh...semoga tips n trik dari saya bermanfaat, maju terus blogger indonesia

Cara membuat kotak script pada postingan

Kotak JS sangat membantu dalam menghemat halaman postingan apalagi kalau JSnya sangat panjang jika menggunakan kotak script maka JS yang panjang akan menjadi pendek. Berikut langkah cara pembuatannya:

1. Login Blogger kamu > Dashboard > New Entri (Menulis Postingan baru)
2. Kemudian pilih yang HTML 
3. Coba masukkan javascript di bawah ini

<div style="background-color: #edecec; border: 1px solid rgb(102,204, 255); display: block; padding: 15px; text-align: left;">
www.cofeemix.com</div>


4.Publikasikan

Efek Daun Berguguran di Blog

Rasanya blog kita terlihat alami saat daun berguguran di blog, apalagi kalau di tambah efek salju bertaburan, namun itu semua perlu langkah-langkahnya agar daun bisa berguguran di blog, berikut langkah-langkahnya : 

1.Login ke blogger
2.Masuk ke Rancangan -- Elemen Laman
3.Tambahkan gadjet lalu pilih HTML Javascript
4.Masukkan kode dibawah ini:
<script src='http://blogtrikdantips-blogspot.googlecode.com/files/daun.js'/></script>
5.Simpan gadjet lalu lihat hasilnya

cara membuat widget user online

Who's Among Us adalah salah satu widget yang nggak kalah penting, who's Among Us ini berfungsi sebagai pemberitahu berapa USERkah yang online pada web tersebut, Nah sekarang kita langsung saja mempelajari Cara pasang widget user online 

1.Pilih widget yang kalian inginkan. klik di sini
     di sini ada 5 jenis widget yang bisa kalian pilih tergantung selera kalian, di sini saya memilih "the classic widget"
2.klik script yang ada, maka akan otomatis tercopy.
3.Kemudian loggin ke blogger kalian, masuk pada Template, Edit HTML, Lanjutkan, centang "expand                 widget"
4.Kemudian paste script tersebut di bawah kode ]]></b:skin>
5.Simpan Template

Sekian info dari saya semoga bermanfaat bagi kita semua, maju terus blogger indonesia