Dropdown Menu Hover Webtranslate

Malam semua, tadi iseng coba eksperimen buat Dropdown menu "Webtranslate" untuk di pasang di sidebar.. Nggak terasa dari jam 8 malam baru saja selesai.

Saya mau share pada rekan-rekan disini, barangkali ada yang tertarik untuk menggunakannya. Silahkan Copy-Paste script dibawah ini:

HTML:  "Customize --> Edit --> Edit Sidebar --> Paste"

<!-- webtranslate --><center><div id="webtranslate"><img src="http://img262.imageshack.us/img262/8215/family100flags.png" title="Translate My Page Into ..'" border="0"><div><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=en">English</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=de">German</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=fr">French</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=it">Italian</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=es">Spanish</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=ru">Rusian</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=pt">Portuguese</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=no">Norwegian</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=ja">Japanese</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=kr">Korean</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=zh-CN">Chinese</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=hi">Hindi</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=ar">Arabic</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=th">Thai</a><a target="_blank" href="http://translate.google.com/translate?prev=hp&amp;hl=en&amp;u=http://family100.multiply.com&amp;sl=id&amp;tl=tl">Filipino</a></div></div></center><!-- end webtranslate -->

*Note: Edit family100 menjadi ID MP Anda.

Penting !!: Script tsb jangan sampai terputus, nanti tidak berfungsi HOVER-nya.



CSS:  "http://multiply.com/setup/pages/upload-css --> Paste"

/* :::::::::: start webtranslate by: jim | http://family100.multiply.com :::::::::: */
#webtranslate {
width: 130px;
font-family: helvetica;
color: #888;
display: block;
position: absolute;
padding: 5px;
font-size: 12px;
}
#webtranslate div {
background: #000;
border: 1px solid #444;
-moz-border-radius: 5px;
visibility: hidden;
padding: 5px;
width: 120px;
height: 360px;
position: absolute;
z-index: 10000;
font-family: helvetica;
text-align: left;
font-size: 12px;
letter-spacing: 0.5px;
}
#webtranslate:hover div {
visibility: visible;
top: 30px;
position: absolute;
}
#webtranslate a {
background: #000;
border-bottom: 1px ridge #393939;
color: #777;
display: block;
margin: 0;
padding: 4px 12px;
text-decoration: none;
font-weight:normal;
}
#webtranslate a:hover {
background: #273649 url(http://img25.imageshack.us/img25/2487/arrow20.gif) left center no-repeat;
color: #FFFFFF;
padding-bottom: 4px;
}
/* :::::::::: end webtranslate :::::::::: */

*Note:

Font color - background dll, perlu disesuaikan dengan kondisi MP Anda ..
Script diatas juga dapat dimanfaatkan untuk keperluan lain, seperti: Menu - Links, dll. *Anda juga dapat mengganti image-nya  ..


Contoh:

<a target="_blank" href="http://multiply.com/compose/pm?individual=family100">Invitation</a>  --> dst ..

Sebelumnya maaf bila terdapat kekurangan, saya percaya rekan2 senior disini bersedia  membantu memperbaikinya .. Silahkan klik disini untuk melihat contohnya.

Selamat mencoba.

Menyisipi Caption pada Foto di Journal

Hal ini berawal dari note tentang memasang caption pada foto di postingan/journal. Caption adalah tulisan kecil di bawah foto pada blog/journal yang digunakan sebagai keterangan tambahan atau penegasan dari foto yang dimaksud (lihat pada note ini). Sebelumnya, terimakasih yang telah membantu di note tersebut. Secara sederhana, berikut langkah-langkahnya :
Code HTML yang disisipi ke dalam compose box Anda :

<DIV class="boxfotopost gerakkiri titlefotopost"><DIV><IMG src="image address"></DIV> <DIV class="titlefotopost">Tulisan caption atas<BR>Tulisan caption bawah</DIV></DIV>
*)Silahkan ganti highlight yang berwarna kuning.


Berikutnya Code CSS nya yang ditempatkan di akhir Custom CSS Anda :

/*-------start here-------*/

.gerakkiri { 
float:left;
} 
.titlefotopost { 
margin:5px; 
font-size: 10px; 
color:#131313;
font-style: italic;
font-weight: bold;
font-family: Verdana, Arial, sans-serif;
}
.boxfotopost {
background: white;
border-color: transparent; 
border-bottom: 1px solid black;
margin: 5px;
} 

/*-------end here-------*/

! : Secara normal, image akan berada di sebelah kiri. 
Perhatikan pula tiga selector html dan css buatan yang berwarna sama.

LIHAT HASILNYA:

Menyisipi caption foto di postingan journal.

Dear para admin dan member semua...

Berawal dari baca-baca berita di situs portal berita, sempat terlintas ide untuk menyisipi 'caption' pada gambar/foto yang kita insert di compose blog entry. Caption yang saya maksud adalah tulisan di bawah foto yang fungsinya sebagai keterangan ataupun penegasan terhadap gambar yang di maksud. Fasilitas menyisipi caption ini sepertinya belum ada di MP, padahal dalam kondisi tertentu cukup penting. Pertanyaannya, bisakah kita menambahkan caption dari gambar/foto yang kita sisipi tersebut pada postingan kita??? Terima kasih atas bantuannya ya..

Ini screenshot contohnya : YANG DI BLOCK MERAH

Textarea Bergambar

Chatting di site saya menjadi sangat bagus. Tempat untuk ngetiknya jadi bergambar! Cukup dengan kode ini:

textarea {
background: url(gambar untuk backgroundnya);
}

NB: kalau ganti color belum tau.. ntar deh di comment. Ntar itu mungkin background-nya sama kayak di guestbook & tempatnya komen