Thursday, December 17, 2009

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.



CSS

Wednesday, December 16, 2009

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.

Tuesday, December 15, 2009

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






Saturday, December 12, 2009

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

Sunday, November 22, 2009

Tips n Trick Meng-upload Background untuk Theme

Sebelum ke langkah-langkahnya, saya akan sedikit review tentang upload Photo ke Multiply dibandingkan ke imageshack, flickr, photobucket, dll.

Keunggulan:
1. Untuk dipasang di Multiply (lagi), saya kita lebih cepat karena loading cuma 1 arah;
2. Umurnya relatif lebih lama dan aman tersimpan. Biarpun album di-delete atau account di-cancel sekalipun, gambar tetap exist. Tidak ada istilah gambar tidak muncul, atau karena account-nya lama tidak aktif seperti di photobucket.

Kekurangan:
1. Untuk free account, Multiply membatasi sampai ukuran 1200px (saya kira cukuplah untuk layout/base theme apapun);
2. Untuk photo page, URL image link memang lebih panjang.

Langkah selanjutnya:
1. Upload gambar ke photo page... Save as Draft bila tidak perlu di share/publish;


2. Untuk ukuran kurang dari 500px, langsung Klik Thumbnail... klik kanan, kemudian klik Copy Image Location


3. Untuk ukuran lebih dari 500px, Klik Zoom In dulu...


4. Hati-hati, jangan keliru copy URL dari address bar!


5. Dari sini... hampir sama dengan Step-2... Klik kanan, klik kanan lalu Copy Image Location


6. Paste URLs tersebut ke CSS...

* Browser yang digunakan Mozilla Firefox

-CMIIW-

Cara Pasang Jempol (Thumbs-up/down)

Sedikit terinspirasi dari facebook...


1. Suka

kodenya:
<img src="http://images.multiply.com/common/smiles/thumbs_up.png"> <a href="http://juriglagu.multiply.com/">an·an</a> likes this.
hasilnya:
an·an likes this.

2. Tidak suka
kodenya:
<img src="http://images.multiply.com/common/smiles/thumbs_down.png"> <a href="http://juriglagu.multiply.com/">an·an</a> does not like this.
hasilnya:
an·an does not like this.


*Keterangan:

Selamat berkreasi!

Thursday, November 19, 2009

Tips n Trick Quotes

I. For Newbie


A. Quote (mengutip komentar sebelumnya)
        1. Klik reply (biasanya ada di kanan atas comment box)


        2. Centang Quote original message
        3. Tulis komentar anda...
        4. Klik


        6. Hasilnya seperti ini

  
B. Quote Part (mengutip sebagian komentar)

        1. Klik reply (biasanya ada di kanan atas comment box)
        2. Un-centang dulu Quote original message
        3. Block/sorot kata/kalimat dari komentar sebelumnya
        4. Centang lagi Quote original message
        5. Tulis komentar anda...
        6. Klik


        7. Hasilnya seperti ini

   

C. Quote Post (mengutip seluruh/sebagian isi blog dan sebagainya)

        1. Klik reply (biasanya ada di kanan bawah post)


        2. Langkah selanjutnya sama dengan cara di atas...



II. For Advance


Quote Script (memanipulasi komentar dari mana/siapa pun)
        1. Salin kode HTML di bawah ini *credit to sikathabis
<div class="quotet"><div class="quotea"><a href="http://User-ID.multiply.com">User-ID</a> said</div><img src="http://images.multiply.com/common/misc/quote-start.gif" align="left"><i>Comment</i> <img src="http://images.multiply.com/common/misc/quote-end.gif"></div>
        2. Tempel di Comment Box       
        3. Kata-kata yang dihighlight kuning ganti dengan yang anda inginkan
        4. Klik
        5. Hasilnya seperti ini
User-ID said
Comment


Selamat mencoba, semoga bermanfaat.

3 Kata Depan/Akhir yang Berbeda di Guestbook

Langsung aja ya.....


misal-nya, anda menginginkan nama sebelum ID anda *tentu saja di guestbook anda sendiri*  menjadi : "Boss" atau apalah sesuka anda.

.replyboxstamp a[href="http://ID kamu.multiply.com"]:BEFORE {
content:"Boss ";
text-decoration:;
text-transform:;
}


lalu teman yg khusus bagi anda
misalnya : "Sahabatku" dll.

.replyboxstamp a[href="http://ID temanmu.multiply.com"]:BEFORE {
content:"Sahabatku ";
text-decoration:;
text-transform:;
}


lalu yg satu lagi buat semua orang (baca : tidak termasuk sahabat anda dan anda) yg komen di GB anda menjadi:
 "Thanks" dsb.


div.replyboxstamp a:BEFORE {
content:"Thanks ";
}












NB: kalau mau ada kata akhir-nya semua kata BEFORE yg di css itu diganti
dengan kata AFTER
ketauan lagi buru2

Friday, November 13, 2009

Live (Recent Updates)

Rating:
Category:Other
Mungkin masih banyak yang belum melihat perbedaan Live di Inbox (Panorama View).

Karena itu saya coba membuat animasi sederhana untuk menggambarkannya:

A = New Post (bila ada postingan baru)


B = New Reply (bila ada yang berkomentar)


Semoga bermanfaat.

Wednesday, November 11, 2009

Memasang Tags di Bagian Samping Blog

Setelah multiply membolehkan memasang "hiasan blog" di bagian kanan halaman MP, ada banyak pernak-pernik yang bisa kita pasang di sana. Salah satunya adalah Tag blog kita.

Penjelasan tentang TAG bisa dibaca di sini.

Di MP tag nya cuma muncul di halaman home. Nah, kalau di wordpress atau blogspot, biasanya orang memasang tagnya di samping. Keuntungannya kalau kita memasang Tag di samping, tag itu akan selalu terlihat di setiap halaman.


Gimana cara memindahkan TAG ke samping?
Pertama, seleksi tag yang ada di halaman home. Klik kanan, pilih View selection source (browsernya pake firefox).


Setelah itu akan muncul jendela baru. Seleksi semuannya (dari <div class... sampai ...</div>). Lalu copy.


Setelah itu, kembali ke halaman MP. Klik Costumize my site. Terus klik edit di bagian bawah headshot. Setelah itu akan muncul kotak Edit sidebar. Nah kita isi deh dengan kode yang tadi kita copy. Trus klik OK. Klik Done.

Tuesday, November 10, 2009

Tips Menghilangkan Tanggal pada Guestbook

sekedar bagi2 tips, bwt yg pingin jadi misterius kapan aktif, dls.
maksud nya tulisan yg kaya gini(misalnya) : wrote on Nov 9
langsung aja yah...
ni CSS-nya :



.replyboxstamp {
color:#888888;
float:none;
font-size:12px;
font-weight:normal;
margin-bottom:5px;
padding:0;
text-align:left;
display: none;

Friday, November 6, 2009

Posisi Iklan Sekarang Pindah

Sekarang posisi Iklan yang biasanya ada di Rail, berpindah ke paling atas [header]
Berikut screenshootnya:


Klik untuk memperbesar gambar

Dan sebagai gantinya.. Sekarang kita bisa Edit Sedebar, berikut screenshootnya:



Edit Sidebar


NB: Screenshoot ini menggunakan free account, kemungkinan ada perbedaan pada premium account.

Thursday, October 22, 2009

Zawgyi (Myanmar Font)

Anda punya kontak dari negara Myanmar?
bingung tulisannya jadi persegi atau tanda tanya semua??

မဂၤလာပါ

If you see "Min Ga Lar Par" letters in the above box
you don't need to install Zawgyi font because you already have it.

Kalau belum, anda bisa download & install font *attachment dibawah ini...
*klik kanan » Save Link As

semoga bermanfaat!

Download: here

Monday, October 5, 2009

Perubahan Pada Setting Threaded

Sekarang kalau pakai setting threaded, komentar baru akan muncul secara otomatis tanpa harus page reload. dan ketika ada komentar baru yang disubmit ke postingan tersebut dan anda masih membuka postingan itu(gak di close), akan muncul notifikasi seperti ini:


dan jika notifikasi tersebut di klik, maka anda akan ditujukan ke komentar baru tersebut dan komentar tersebut akan memiliki border merah seperti berikut:



menurut saya ini improvement yang bagus dari Multiply.. MAJU TERUS!

Saturday, October 3, 2009

Panorama View

Rating:★★★★
Category:Other




Review-nya dikit aja ya :)


  • Layar dibagi menjadi 3 frame:

    1. Panel paling kiri untuk manajemen inbox.

    2. Bagian tengah untuk daftar posting.

    3. Paling kanan untuk menampilkan isi.



  • Pada bagian isi (frame paling kanan) tidak terdapat judul posting (judul
    album). Demikian juga pada saat foto ukuran sedang ditampilkan (lihat
    gambar
    2
    ). Untuk kembali menampilkan indeks foto (halaman album), klik lagi judul
    album yang ada di frame tengah.

  • Thumbnail foto yang ada di frame tengah, bila diklik akan terbuka
    halaman reguler pada jendela yang sama, walaupun setting inbox aktif pada
    pilihan “Open Links In: New browser window.”

  • Horizontal scrollbar tidak muncul pada resolusi 1280x1024 atau 1280x960.

    Scrollbar baru muncul pada resolusi 1024x768. Namun, anehnya, scroll pada
    bagian isi (panel kanan) malah tidak berfungsi menampilkan bagian yang tidak
    tersembunyi. Layar tidak tergulung walaupun ada scrollbar. Pada panel
    tengah, scrollbar juga tidak berpengaruh apa-apa, hanya menggeser layar
    untuk menampilkan bagian yang kosong.

    Tampilan menjadi semakin tidak nyaman pada resolusi 800x600.

  • Halaman foto ukuran besar (zoom-in) dimodifikasi menjadi lebih indah
    (lihat gambar 5)





Gambar 1 Album foto pada monitor 1280x1024





Gambar 2 Halaman foto pada monitor 1280x1024





Gambar 3 Album foto pada monitor 1024x768





Gambar 4 Album foto pada monitor 800x600





Gambar 5 Halaman foto ukuran besar yang bisa diakses dari panorama view


Wednesday, September 16, 2009

New Privacy Settings

Sekarang pengaturan Homepage, My Profile & Chat Bar menjadi satu halaman
untuk aksesnya klik my account » Privacy


Wednesday, September 2, 2009

Multiply Chat (Meebo)

Hampir di semua major browsers fasilitas ini bisa digunakan
Internet Explorer Firefox Opera Google Chrome Safari
kecuali Mozilla Firefox 2, dan mungkin Opera Mini dari HandPhone

dari situ kita bisa langsung chat ke semua contacts multiply (yang online)
*sekarang Online status di rail dan mini profile semua dihilangkan

juga bisa connect ke (add account dari)

dengan terlebih dahulu daftar ke Meebo (untuk yang belum punya account)

selain itu, kita juga add dari yang lainnya dengan mengklik


akan muncul lebih banyak pilihan lagi, mulai dari Yahoo! sampai Zorpia


selamat mencoba!

Tuesday, September 1, 2009

Export Contacts

Untuk melihat Nama & Email dari semua contacts kita sekarang, menjadi Excel Worksheet
berbeda dengan Find Users, kalau itu untuk gunanya mencari yang belum menjadi contact.

Caranya:
Klik Export as CSV File

Hasilnya:
seperti berikut...
First Name,"Last Name","Email"
an_an," teman anaknya pak bambang","juriglagu@*****.com"

semoga bermanfaat.

Saturday, August 29, 2009

Friday, August 28, 2009

Add a Comment Label Indonesian

Di copy seluruhnya dari journal saya yang ini. Bagi yang sudah baca, dibaca lagi juga ngga' apa-apa (^_^). Hanya ingin berbagi dengan sahabat MP-ers lainnya.



Pernah suatu ketika saya berpikir, "Kapan Multiply support bahasa Indonesia?" Mungkin suatu saat nanti. Ya semoga saja suatu saat nanti Multiply tersedia dalam banyak bahasa, dan bahasa Indonesia termasuk salah satunya. Amin.

Multiply
INDONESIA

Dari pada nunggu lama-lama, kenapa ngga' kita ganti sendiri aja?

Lha, emang bisa?

Ohh, bisa banget..

Caranya?

Kalau dibilang, sebenarnya bukan mengganti bahasa, akan lebih tepat jika disebut modifikasi elemen. Multiply membolehkan para anggotanya untuk memodifikasi semua elemen kecuali bagian Logo, Iklan, dan Copyright [setahu saya hanya 3 itu, mohon koreksinya]

Nah, sebagai sample, saya akan melakukan perubahan bahasa Multiply [baca: elemen, red], pada bagian Add a Comment Label. Seperti yang bisa anda lihat pada gambar berikut:

Pada gambar diatas, tertulis "Add a Comment".

Dan akan saya rubah menjadi "Komen di Sini!"
Perhatikan gambar dibawah ini:

Caranya pun cukup sederhana, bagi anda yang sudah lama bermain CSS mungkin masih ingat tentang kode CSS berikut:

.user_id_signouttd:before {
content:" >> Please insert your password.";
}

Nah, saya pun mencoba untuk mengembangkan kode tersebut, dan ternyata memang bisa.
Anda tinggal mencari kode untuk elemen yang ingin dirubah [warna merah], dan kemudian memodifikasi kode-kodenya.

Berikut ini kode CSS yang saya gunakan untuk merubah bahasa Multiply:

[contoh gambar di atas]



/* Copyright © 2009 IBRA */
/* http://laptopmini.multiply.com */
/* don't remove credits */

span.addreplylabel {
visibility:hidden;
}
span.addreplylabel:before {
content:"Komen di Sini!";
visibility:visible;
}


Perhatikan pada bagian visibility, yang pertama hidden, berfungsi menyembunyikan elemen asli. Dan yang kedua visible memaksa agar :before tidak ikut disembunyikan, agar nantinya bisa tampil pada halaman blog anda.

Silahkan anda berkreasi... Hidupkan Multiply INDONESIA
Semoga bermanfaat.