Sumer Toe Art Tutorial ♥♥

Hello. Everyone up for summer?! :) I've made a tutorial. Hehe hope you guys will like it. ♥
Materials needed:

• Lime green nail polish
• Aqua blue nail polish
• Yellow nail polish
• Orange nail polish
• White nail polish
• Base coat
• Top coat
• Gold nail glitter
• Sticks / Toothpick

1. Put the base coat, as usual. :)

2. Apply the lime green. I am using Elianto's nail enamel. Be sure that your grown nails are still visible. This serves as your guide. In my nail polish's case, and in my nail's case, I coated it 2x because my nails are very opaque. See the circled part.

3. Apply french tip. It doesn't need to be perfect. As long as it's visible, it's fine. I made a 2-coated tip here.

4. Apply dots. It depends on you on how you will design it. I made it this way to keep it simple. :) I used 2 summer colors, but it's actually by your choice.


4. Apply the gold nail glitter. Now in this part, you might worry about your while tip to be yellow-ish. It's super fine because that's really what we're aiming for.

oops, didn't mean to damage my nail art. haha ♥♥

and simply apply your top coat. Then you're done! ♥
Hope you liked my nail art tutorial. Enjoy!! ♥♥
-Clai

Oprek Variable Definitions Blog

Postingan ini masih berhubungan dengan mempercepat loading blog dengan cara mudah pada postingan sebelumnya. Cara tersebut bisa saya katakan mudah tetapi cukup signifikan untuk meningkatkan loading blog tetapi cara tersebut tidak akan berfungsi apabila komponen file css masih menggunakan komponen Variable Definitions sebagai definisi2 dari file css tersebut. Hal ini baru saya ketahui saya coba aplikasikan cara mempercepat loading blog tersebut ke blog saya yang juga menggunakan Variable Definitions sebagai definisi file css. Apa hasilnya?? Blog saya menjadi berantakan alias trik tersebut tidak berfungsi. Hal ini tidak saya temukan pada blog saya yang lain yang tidak menggunakan Variable Definitions sebagai definisi file css seperti pada blog Just a Blog ini dan blog Blogger Template by ireng_ajah. Trik tersebut berjalan normal dan cukup signifikan dalam mengurangi ukuran blog.

Bagaimana jika mau menggunakan trik itu tetapi Variable Definitions masih ada??

Variable definitions menurut saya adalah nilai untuk mendefinisikan file css yang ada baik itu untuk warna, font, ukuran font, dll.

Penulisan Variable Definitions pada file css menggunakan awalan "$" (tanpa tanda petik). Misalnya untuk warna link blog:

<variable name="linkcolor" description="Link Color" type="color" default="#384" value="#000000">

Untuk penulisan file css menjadi

a:link {
color:$linkcolor;
text-decoration:none;
}

linkcolor (value="#000000") pada Variable Definitions tersebut sebagai definisi warna untuk Link Blog. Penulisan pada css untuk link menjadi color:$linkcolor;

Apabila Variable definitions tersebut mau diterjemahkan langsung ke file css-nya, maka penulisan pada file css menjadi :

a:link {
color:#000000; (sama dengan value pada Variable definitions)
text-decoration:none;
}

* perhatikan warna biru dan merah


Untuk menterjemahkan Variable definitions yang lain langsung ke file css, tinggal samakan saja pada variabel name-nya dan valuenya. Melihat penterjemahan langsung Variable definitions ke file css yang saya lakukan pada blog saya, ada beberapa file css yang perlu ditambahkan kode baru. Yang sering saya temui yaitu pada font.

Jika masih menggunakan Variable definitions, penulisan font pada css akan seperti ini :

font: $bodyfont;

Tetapi jika langsung pada file css-nya, biasanya saya menuliskannya menjadi :

font: 14px arial; atau menjadi

font-size:14px;
font-weight:bold;
font-family:arial;

Untuk manfaat dan kerugian menggunakan Variable definitions atau menterjemahkan langsung ke css, saya sendiri aslinya gak terlalu paham, hehehehehe... Tetapi jika ingin menggunakan trik mempercepat loading blog dengan cara mudah, Variable definitions tersebut harus diterjemahkan dulu ke file css-nya.

Selain itu juga, trik mempercepat loading blog ini juga tidak akan berfungsi untuk template yang menggunakan tambahan file css dibawah kode ]]></b:skin> seperti pada blog saya free blogger template ajah

]]></b:skin>

<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<---- file css ada disini ---->

</b:if>
</style>

File css pada bagian tersebut cukup di kompres saja dan tidak perlu menggunakan link eksternal. Links eksternal file css hanya untuk file css yang berasa diatas kode ]]></b:skin>


Terimakasih unuk sobat Blogging sehingga saya jadi tau soal ini.

Mempercepat Loading Blog

"Sebuah cara yang mudah untuk mempercepat loading blog dengan hanya memindah penempatan suatu file tetapi cara ini mempunyai efek yang cukup signifikan untuk meningkatkan loading blog"

Blog yang berat bisa membuat tidak nyaman pengunjung yang datang. Banyak cara yang bisa dilakukan untuk mempercepat. Jika sebuah web ato menggunakan WordPress, bisa saya katakan lebih mudah mengaplikasikan trik-trik mempercepat loading blog. Akan tetapi saya pribadi menggunakan Blogpost yang gratisan sebagai media untuk ngeblog. Kebanyakan postingan yang membahas mempercepat loading blog khususnya untuk Blogpsot yang saya temui berkutat pada masalah seperti :
1. compress file css, javascript
2. penggunaan widget2 yang tidak perlu lebih baik tidak usah dipakai
3. script2 pemutar musik, animasi, flash/multimedia
4. penggunaan image/banner

Ada hal yang kurang dan menurut saya, hal tersebut penting karena sangat bermanfaat dan efeknya dalam mempercepat loading blog termasuk signifikan. Jika sobat lihat kode blog ini lewat view page code, akan tampak bahwa diatas kode ]]></b:skin> tidak ada deretan susunan file css template ini. Kenapa?? karena file css template ini sudah saya ganti menjadi sebuah linknya saja dimana file css tersebut saya upload ke Google Site dan saya hanya mengkopi link file tersebut dan menaruhnya bersama kode javascript seperti pada gambar dibawah ini.

Perhatikan yang saya garis bawah merah (klik gambar untuk memperbesar)

Awalnya saya mencoba setelah melihat demo2 WordPress theme yang hanya mencantumkan link file css. Terus saya coba untuk mengaplikasikan ke blog ini. Kemudian iseng ngetes kecepatan loading blog saya menggunakan tool dari seocentro, dan hasilnya ternyata bagus untuk blog saya alias berat blog berkurang. Saya coba untuk blog saya yang lain, Blogger Template by ireng_ajah juga sama. Ada pengurangan berat yang cukup signifikan dengan cara tersebut.

Berikut ini hasil perbandingan sesudah dan sebelum menggunakan cara tersebut pada Just a Blog dan Blogger Template by ireng_ajah.

1. Just a Blog

Screenshot loading blog Just a Blog dengan file css diatas kode ]]></b:skin>

Screenshot loading blog Just a Blog dengan file css yang diambil hanya linknya saja.

2. Blog Tree Blogger Template

Screenshot loading blog Free Blogger Template dengan file css diatas ]]></b:skin>

Screenshot loading blog Free Blogger Template dengan file css yang diambil hanya linknya saja.

Perhatikan yang saya garis bawah merah (klik gambar untuk memperbesar)

Just a Blog yang awalnya 99847 bytes menjadi 93366 bytes (berkurang 6000an bytes)

Blogger template by ireng_ajah yang awalnya 61747 bytes menjadi 53911 bytes (berkurang 7000an bytes)

Suatu penurunan berat blog yang cukup signifikan, bukan??


Bagaimana caranya??

Cukup cut dan paste file css blog sobat ke Notepad. Jangan lupa filenya di simpan dalam bentuk .css. Kalo sudah, upload dan kopi url file css tersebut. Perlu diperhatikan juga web file hostingnya cari yang sudah terbukti akan hal koneksi. Jangan sampai ketika dikunjungi malah tidak bisa mengakses blog gara2 koneksi web file hostingnya tidak stabil, apalagi sering macet. Kalo saya memakai fasilitas dari Google Site untuk segala urusan upload file2 saya.

Jika sudah, letakkan url file css tersebut di bawah kode ]]></b:skin>
dengan susunannya seperti ini :

<link href='URL-FILE-CSS' rel='stylesheet' type='text/css'/>

Repotnya jika memakai cara diatas adalah ketika mau edit2 blog karena harus buka dulu file cssnya dan upload lagi tapi saya pikir gak terlalu jadi masalah karena ngedit2 blog juga gak tiap hari ini, hehehehehhee...

(emang tiapa hari apa yang mau di edit reng..??)

Selain trik diatas, hal sepele tetapi bermanfaat dalam meningkatkan loading blog yaitu dalam hal penulisan link alamat web/blog. Diusahakan untuk setiap link alamat web/blog yang ada di blog sobat untuk memakai tanda "/" (tanpa tanda kutip) alias garis miring pada akhir link alamat web/blog tersebut. Misalnya

http://blogcenti.blogspot.com/

Tanda "/" pada akhir alamat itu sebagai identitas untuk web server bahwa link tersebut langsung menuju kesasar alamat tersebut. Biasanya link2 tersebut menjadi link pada menu blog atau link blog lain yang tukeran link.

Untuk trik dan tips meningkatkan loading blog yang lain, bisa mengunjungi alamat ini dimana salah satunya seperti trik diatas.


Tapi kecepatan loading blog seringkali terbentur akan tampilan blog. Kadang untuk mengejar tampilan blog yang bagus, indah, tidak lagi peduli akan kecepatan blog. Selera tiap blogger emang berbeda tetapi jika kecepatan dan keindahan blog berjalan beriringan, bukankah itu sesuatu yang lebih baik??


Update tanggal 17-01-2010

Ada yang ketinggalan tentang cara untuk mempercepat loading blog. Jika blog sobat menggunakan file css atau file javascript untuk widget blog sobat dimana file tersebut ditempatkan dibawah kode ]]></b:skin>, misalnya untuk widget related post, tabview, slider image atau yang lain, usahakan file2 tersebut berada dalam satu alamat web file hosting yang sama. Kenapa?? Karena dengan file hosting yang berbeda, bisa jadi alamat server file hosting tersebut juga berbeda dan jika koneksi salah satunya sedang bermasalah, tentunya juga akan menggangu loading blog kita. So, akan lebih baik jika file2 tersebut berasa dalam 1 alamat.

Disamping itu juga, jika suatu widget mempunyai beberapa kode file, misal slideshow1.js, slideshow2.js, ada baiknya file2 tersebut digabung menjadi 1, misalnya menjadi slideshow.js

Ada penurunan ukuran blog lagi setelah saya menggabungkan file javascript untuk menu accordion jika dibandingkan hasil pada postingan mempercepat loading blog padahal sudah ada tambahan 5 postingan


Update tanggal 23-01-2010

Apabila template blog sobat masih menggunakan Variable Definitions untuk file css-nya, maka trik ini tidak akan berfungsi. Untuk keterangan lebih lanjut soal Variable Definitions, ada pada postingan ini


Update 28-03-2010

Just a Blog dan Free Blogger Template Ajah sebagai contoh diatas sudah ganti template lagi tetapi masih menggunakan cara diatas


Note :
- Sudah susah2 ngutak-ngutik blog supaya kecepatan blog lebih baik tetapi jika kecepatan akses yang akses blog kita termasuk lemot, jangan salahkan yang punya blog lho.. hehehehehehehe...

- Gambar di atas diambil sebelum postingan ini (ya iyalah.. piye tho kowe ki reng..??)

Cek Kolom Komentar Dengan Tes Komentar

Membuat template itu sebisa mungkin bisa berfungsi dengan baik di semua browser yang umum digunakan, baik itu pake Mozilla Firefox, Google Chrome, Internet Explorer, Opera maupun Safari (5 browser ini yang biasa saya gunakan untuk mengecek kevalidan dari template yang saya buat).

Disamping itu juga, ukuran template juga harus sesuai ketika template tersebut digunakan.
Salah 1 untuk mengecek ukuran template pada kolom komentar yaitu dengan melakukan tes komentar pada tempate tersebut. Ukuran tinggi kolom komentar pada template2 bawaan blogger adalah 410px.

Sebelum saya posting ini, saya coba cek template buatan saya untuk testing komentar. Saya login Blog make Mozilla Firefox. Template yang jadi bahan tes untuk komentar adalah Template Petak Umpet. Ukuran kolom komentar sudah saya edit n ganti menjadi 250px dengan settingan komentar yaitu Embedded below post dan Show word verification for comments? adalah Yes. Sebagai admin (dalam posisi login), tes komentar pada tempate berjalan baik dan tidak ada hambatan baik itu ketika komentar dengan akun Blog maupun Name/URL bahkan Anonymous. Postingan komentar juga langsung terpublish saat itu juga dan tanpa verifikasi kode dulu.

Kemudian saya coba pake browser Google Chrome dan melakukan tes komentar lagi pada template yang sama, yaitu Template Petak Umpet memakai Name/URL. Apa yang terjadi?? Kolom komentar menjadi seperti dibawah ini. Ada kode verifikasi dan yang "lebih aneh" buatku tampak kolom komentar mempunyai scroll. (untuk IE juga sama)

Screenshot 1. Kolom komentar ukuran 250px

Lalu saya kembali ke Mozilla dan saya ganti ukuran tinggi komentar dari 250px ke 400px dan hasilnya seperti ini ketika saya coba komentar dalam posisi tidak login pake browser Google Chrome

Screenshot 2. Kolom komentar ukuran 400px

Sebenarnya gak masalah juga jika tampilan kolom komentar seperti pada screenshot 1 karena selera tiap blogger berbeda. Disamping itu, dengan screenshot 1, juga bisa mengirit tempat pada template seperti pada gambar di bawah ini.

Screenshot 3. Tampilan awal komentar ukuran 250px

Screenshot 3. Tampilan awal komentar ukuran 400px

Tetapi jika Blogger yang bersangkutan adalah blogger yang suka dengan tampilan "bersih" tanpa ada scroll, bisa tidak merasa nyaman untuk dirinya dan juga untuk pengunjung yang akan memberi komentar di blognya

Kejadian seperti diatas hanya terjadi jika settingan komentar di setting berada di bawah postingan dan ada verifikasi kode kalo mau kasih komentar.

Jika sobat telanjur memilih dan suka settingan komentar berada dibawah postingan dengan verifikasi kode dulu tetapi tidak ingin tampilannya seperti pada screenshot 1, sobat tinggal ganti ukuran tinggi komentar menjadi 400px. Caranya :

- Masuk ke Layout, trus edit HTML.
- Jangan lupa centang Expand Widget Templates
- Cari kode di bawah ini

<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>

- Ganti ukuran yang berwarna merah sesuai keinginan sobat.
- Simpan

Cara ini juga bisa untuk mengatasi kolom komentar dimana harus pencet TAB pada keyboard untuk masuk ke button Poskan Komentar

* Ukuran tinggi 400 adalah ukuran minimal komentar tidak mempunyai scroll dengan browser Firefox. IE maupun Chrome. (saya coba pake 380, Firefox dan Chrome beres tapi IE tidak)

Tutorial Lanjutan Pilihan Kode Untuk Membuat Widget Blog Dari Muncul Menjadi Menghilang

Ada yang terlupa dari postinganku kemarin tentang membuat widget dari muncul menjadi menghilang. Seumpama sobat ingin menambahkan widget yang bisa menghilang saat Kategori Post/Label diklik atau membaca artikel postingan secara keseluruhan, ada baeknya sobat memberi judul widget tersebut. Hal ini untuk memudahkan dalam hal mencari kode widget tersebut.

Berikut ini langkah2 menambahkan widget yang dapat menghilang.

1. Login ke blog sobat

2. Klik pada Layout, Page Element dan klik Add a Gadget

3. Pilih HTML/Script. Jangan lupa untuk memberi judul supaya mudah untuk mencari kode widgetnya.

4. Save


Langkah selanjutnya :

5. klik pada Edit HTML

6. Jangan lupa centang pada Expand Widget Templates

7. cari kode widget tadi. Untuk mempermudah, pencet tombol Ctrl + F atau F3 dan ketikkan judul widget tadi

8. berikut ini adalah contoh widget blog ku yang judulnya Blog Sobat-ku

<b:widget id='HTML5' locked='false' title='Blog Sobat-Ku' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<h2 class='title'><data:title/></h2>

<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

** Perhatikan yang berwarna merah. Itu adalah judul widget yang sobat buat tadi.

9. Kalo sudah ketemu, klik disini untuk lebih lanjut.

Pilihan Kode Untuk Membuat Widget Blog Dari Muncul Menjadi Menghilang

Kepanjangan gak ya judulnya?? Bener gak ya judulnya??hehehhe..Lha aku bingung mau kasih judul apa ale gak tau definisi postingan ini intinya apa tapi kalo sobat baca mpe slese postingan ini, sobat akan mengerti apa maksutnya Pilihan Kode Untuk Membuat Widget Blog Dari Muncul Menjadi Menghilang

Seperti yang kita tau, sekarang banyak macam2 template untuk blog dan salah satunya adalah Magazine Style Template seperti Arthemia Template yang aku gunakan ini, Zinmag Remedy, dll. Ciri khusus pada Magazine Style Template adalah ada widget yang akan hilang apabila kita membaca artikel postingan secara keseluruhan atau hanya ketika Kategori Postingan/Label diklik. Sebagai contoh, template yang aku gunakan ini. Widget BROWSE CATEGORIES akan hilang apabila sobat mengklik Kategori Postingan/Label pada blog ini atau membaca artikel postingan secara keseluruhan.

Bagaimana widget tersebut bisa hilang?? Tentunya ada kode khusus. Nahh..Dari brosing2 mencari kode tersebut dan dari liat2 kode HTML pada template Magazine Style yang aku gunakan, ternyata ada dua jenis kode dan masing2 kode berbeda waktu kerjanya dalam menghilangkan suatu widget.

Terus..apa aja kodenya?? Katanya ada dua..

1. Kode pertama

<b:if cond='data:blog.pageType == &quot;index&quot;'>

widget yang akan dihilangkan

</b:if>


2. Kode ke dua

<b:if cond='data:blog.url == data:blog.homepageUrl'>

Widget yang ingin di hilangkan

</b:if>


Bedanya dimana??

- beda penulisan kodenya,halah..wis jelas nek kui,wkekekekkeee...
- Pada kode pertama, widget baru akan menjadi hilang apabila sobat membaca artikel secara keseluruhan (READMORE..) dan belum hilang ketika sobat mengklik Kategori Postingan/Label. Sebagai contoh bisa bisa liat widget Blog Sobat-Ku di blog ini. Widget tersebut baru hilang ketika sobat membaca artikel postingan secara keseluruhan (mengklik Lanjutin bacanya..) dan belum hilang ketika Kategori Postingan/Label diklik.

- Pada kode ke dua, widget akan hilang WALAUPUN sobat atau pengunjung cuma mengklik Kategori Postingan blog. Sebagai contoh bisa diliat disini. Pada widget dengan judul Demo Tabview Versi I (ShadeTabs) saat tampilan URL awal (home), widget tersebut masih ada tetapi kalo sobat klik Kategori Postingan/Label, widget tersebut akan hilang.

So..beda cara kerja antara kedua kode tersebut terletak pada saat sobat/pengunjung blog mengklik Kategori Postingan/Label

Untuk penempatan kodenya sendiri, sama. Tinggal sobat tentukan sendiri apakah widget sudah hilang saat Kategori Postingan diklik atau berharap baru hilang saat membaca seluruh postingan (Readmore).

Caranya??

Aku gak tau secara persis kode sebuah widget diawali n diakhiri dengan kode apa, tapi biasanya seperti ini,hehehehehe..

Berikut ini adalah kode asli suatu widget (Add HTML/Script pada Page Element) :


<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>


** Perhatikan kode yg berwarna merah


1. Apabila sobat ingin memakai kode yang pertama, maka kode widget akan menjadi seperti berikut :

<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<h2 class='title'><data:title/></h2>

<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>


Save

**Perhatikan kode yang berwarna merah


2. Apabila sobat ingin memakai kode yang ke dua, maka kode widget akan menjadi seperti berikut :

<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<h2 class='title'><data:title/></h2>

<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>


Save

**Perhatikan kode yang berwarna merah


Tinggal diliat deh hasilnya..


Yupp..begitulah perbedaan cara kerja kedua kode tersebut dalam menghilangkan suatu widget. Ehmm..pilih salah satu atau mau mengkombinasikan keduanya??

(Akhirnya slese juga..huhh...capek juga ya ngetiknya..)

Terimakasih

Highlighter Scroller Sebagai Mini Post

Highlighter Scroller ?? Gak tau juga gimana neranginnya. Pokok nya itu lah.. Highlighter Scroller bisa dijadikan sebagai mini post, menu blog, atau mungkin sebagai blogroll. Aku dapat script ini dari Javascriptkit. Dari keterangan, script ini tinggal masukin dimana sobat mau nempatin Highlighter Scroller nya. Mudah bukan??
Sebelumnya sih aku coba utak-utik lewat Edit HTML tapi berhubung aku gak paham dengan yg namanya kode-kode, jadinya aku gak tau harus ditaruh dimana,heheheheee...

Langkah-langkah membuat Highlighter Scroller :

1. Masuk ke Page Element
2. Add elemen HTML
3. Copat kode yg ada dibawah ini, dan SAVE

Berikut ini adalah kode script nya :


<script type="text/javascript">

//CONFIGURE MESSAGES AND VARIABLES
var tickercontents=new Array()
tickercontents[0]='Looking for template?? Visit <a href="http://dhe-gallery.blogspot.com" target="_blank">Dhe-Gallery</a>!'
tickercontents[1]='You can get <a href="http://moneylocker.blogspot.com" target="_blank">Free Money</a> from many programs here !'
tickercontents[2]='Get your <a href="http://azthemes.blogspot.com" target="_blank">Professional Theme</a>,high quality and SEO Support'
tickercontents[3]='<a href="http://blogcenti.blogspot.com">Just a Blog</a>Apa ayng ku lihat, ku dengar, dan ku rasa !'

var tickerwidth="160px"
var tickerheight="80px"
var fontcss="font: bold 14px Verdana; color:black"
var tickdelay=3000 //delay btw messages
var highlightspeed=2 //2 pixels at a time.
var highlightcolor="#9ff9ff"
var backdroptextcolor="#1e0e0e"

////Do not edit pass this line////////////////

document.write('<style>#highlighterbg a{color:'+backdroptextcolor+'}</style>')
document.write('<div style="position:relative;left:0px;top:0px; width:'+tickerwidth+'; height:'+tickerheight+';'+fontcss+'">')
document.write('<span id="highlighterbg" style="position:absolute;left:0;top:0; width:'+tickerwidth+'; height:'+tickerheight+';padding: 4px"></span><span id="highlighter" style="position:absolute;left:0;top:0;clip:rect(auto auto auto 0px); background- width:'+tickerwidth+';height:'+tickerheight+';padding: 4px"></span>')
document.write('</div>')

var currentmessage=0
var clipbottom=1

function changetickercontent(){
msgheight=clipbottom=crosstick.offsetHeight
crosstick.style.clip="rect("+msgheight+"px auto auto 0px)"
crosstickbg.innerHTML=tickercontents[currentmessage]
crosstick.innerHTML=tickercontents[currentmessage]
highlightmsg()
}

function highlightmsg(){
//var msgheight=crosstick.offsetHeight
if (clipbottom>0){
clipbottom-=highlightspeed
crosstick.style.clip="rect("+clipbottom+"px auto auto 0px)"
beginclip=setTimeout("highlightmsg()",20)
}
else{
clipbottom=msgheight
clearTimeout(beginclip)
if (currentmessage==tickercontents.length-1) currentmessage=0
else currentmessage++
setTimeout("changetickercontent()",tickdelay)
}
}

function start_ticking(){
crosstickbg=document.getElementById? document.getElementById("highlighterbg") : document.all.highlighterbg
crosstick=document.getElementById? document.getElementById("highlighter") : document.all.highlighter
crosstickParent=crosstick.parentNode? crosstick.parentNode : crosstick.parentElement
if (parseInt(crosstick.offsetHeight)>0)
crosstickParent.style.height=crosstick.offsetHeight+'px'
else
setTimeout("crosstickParent.style.height=crosstick.offsetHeight+'px'",100) //delay for Mozilla's sake
changetickercontent()
}

if (document.all || document.getElementById)
window.onload=start_ticking

</script>

<a href="http://javascriptkit.com">JavaScript Kit</a> | <a href="http://blogcenti.blogspot.com">Just a blog</a>


Hasilnya akan seperti ini. Lihatdemo

Keterangan : Ganti sesuaikan dengan selera sobat
- warna merah = ganti dengan text atau link sobat
- warna biru = lebar dan tinggi Highlighter Scroller
- warna biru tua = jenis dan ukuran font
- warna hijau = warna background dan warna link url

Jika ingin menambahkan text atau link di Highlighter Scroller, sobat tinggal tambahkan seperti contoh berikut :

tickercontents[3]='<a href="http://blogcenti.blogspot.com">Just a Blog</a>Apa ayng ku lihat, ku dengar, dan ku rasa !'

Ket : angaka yg di cetak tebal,merupakan no urut text dan link sobat. Ganti sesuai dengan no urut.