Tooltips

Assalamu'alaikum teman-teman!! Maaf ya, beberapa hari ini aku emang hiatus dan cuma sekedar cek blog doank.. Tapi InsyaAllah hari ini enggak. Ada waktu satu jam untuk nulis tutorial and others. Sekarang ini tutorial. Tutorial untuk menambah tooltips. Ada yang tau apa itu tooltip?

Perhatikan ya, bagaimana tooltips itu bekerja. Tentu kamu ada cursor kan?? Sentuh cursor itu ke tulisan di bawah ini :

Hover Disini

Ada tulisan apa di situ? 'Viaholic', tentu saja. Gimana cara buatnya? Mau kan? Yok, kita coba.


For Classic & Skin Template

• Dashboard > Template > Edit HTML
• Cari kode </head>
• Copy kode di bawah ini : taruh di ATAS kode tadi

<script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>

• Cari kode </style>
• Copy dan paste kode di bawah ini, DIATAS kode yang kamu cari tadi

#s-m-t-tooltip {
background: #FFFFFF;
font-size: 12px;
line-height: 12px;
font-family: Delius;
letter-spacing: 2px;
text-transform: lowercase;
color: #000;
text-align: left;
padding: 5px 10px 5px 10px;
display: block;
border-radius: 5px;
margin: 24px 14px 7px 12px;
border: 2px solid #BDBDBD;
 -moz-box-shadow: 0 0 0px 2px #CCCCCC;
  -webkit-box-shadow: 0 0 0px 2px #CCCCCC;}

• Save template.

For Designer and Denim Template

• Dashboard > Tata Letak > Add Gadget > HTML/JavaScript
• Copy kode di bawah ini dan paste di situ

<script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>

• Save tanpa judul.
• Kemudian ke Template > Edit HTML > cari kode ]]></b:skin
• Copas kode di bawah ini di ATAS kode tadi

#s-m-t-tooltip {
background: #FFFFFF;
font-size: 12px;
line-height: 12px;
font-family: Delius;
letter-spacing: 2px;
text-transform: lowercase;
color: #000;
text-align: left;
padding: 5px 10px 5px 10px;
display: block;
border-radius: 5px;
margin: 24px 14px 7px 12px;
border: 2px solid #BDBDBD;
 -moz-box-shadow: 0 0 0px 2px #CCCCCC;
  -webkit-box-shadow: 0 0 0px 2px #CCCCCC;}

Keterangan :
Blue : Warna background
Aqua : Warna border
Fuchsia : Warna shadownya