Memasang ≥ 2 Gambar dalam Background

Memakai satu buah gambar dalam background mungkin sudah biasa. Sekarang kita bisa memakai lebih dari satu gambar untuk dijadikan background.

Caranya sederhana, yaitu dengan menambahkan beberapa URL gambar yang dipisahkan dengan tanda koma pada elemen background-image.

background-image: url(URL_ke-1), url(URL_ke-2), ..., url(URL_ke-n);

n = jumlah gambar, banyaknya bisa berapa saja.

Penulisan pada bagian background-position dan background-repeat mengikuti urutan pada background-image. Cara penulisannya juga sama, yaitu dipisahkan dengan tanda koma (jangan lupa diakhiri tanda titik koma [;]).

Yang harus diperhatikan disini adalah urutannya. Konsepnya seperti gambar berikut.

URL_ke-1 berada di posisi paling depan, dan URL ke-n berada di posisi paling belakang. Jadi, jika kita memasang gambar yang paling besar di URL_ke-1 maka gambar di urutan berikutnya jelas tidak akan tampak karena tertutup dengan gambar besar yang disimpan di URL_ke-1.

Contohnya:

Gambar ke-1 (URL_ke-1):
Gambar ke-2 (URL_ke-2):

Kode CSS:

background-image: url(http://icons.iconarchive.com/icons/noctuline/morning-pleasure/128/Coffee-Photoshop-icon.png), url(http://everydayicons.jp/download/patterns/p21-1.jpg);
background-repeat: no-repeat, repeat;
background-position: bottom center, top left;
width: 250px;
height: 200px;

Hasilnya:

Tips:

• Urutan pemasangan besarnya gambar dari URL_ke-1 sampai URL_ke-n lebih baik dari yang paling kecil ke yang paling besar.
• Format gambar yang digunakan .png atau gambar yang transparan, terutama untuk di URL posisi awal-awal. Tujuannya agar terlihat lebih menarik saja. hehe..

Sekian penjelasan untuk memasang banyak gambar pada background atau bisa disebut 'multiple background'. Mohon maaf bila penjelasannya kurang jelas dan tidak dimengerti ^^;

Semoga bermanfaat dan selamat berkreasi! :D


Sumber gambar:

• http://everydayicons.jp/download/patterns/p21-1.jpg
• http://icons.iconarchive.com/icons/noctuline/morning-pleasure/128/Coffee-Photoshop-icon.png

Trick Meng-edit/delete Journal (Blog Entries)

Teman-teman yang bingung untuk meng-edit/delete journal bisa coba cara-cara berikut:

A. Cara Pertama, Gunakan Panorama View...

B. Cara Kedua, Gunakan URL Shortcut...

Misalkan BLOG » http://juriglagu.multiply.com/journal/item/2571/

• Untuk menyunting [edit] » http://juriglagu.multiply.com/journal/compose/2571/
• Sedangkan untuk menghapus [delete] » http://multiply.com/mail/item/delete/juriglagu:journal:2571

Semoga bermanfaat ^_^

Multiply - Home Page Content

http://multiply.com/setup/pages/content

Hampir sama seperti Media Locker, fungsinya untuk lebih mudah me-manage banyak post(s), tapi khusus konten yang muncul di Home Page saja. Jadi kita tak perlu lagi klik Customize My Site lalu Edit satu-satu box(es), tinggal klik saja tabs yang ada di situ...

Semoga bermanfaat!

Membuat Shortcut Smiley/Emoticon Sederhana

  Berikut tips sederhana untuk membuat shortcut smiley di kotak reply hingga nantinya akan berubah menjadi bentuk gambar. Karena berbasis CSS, hanya berlaku di halaman reguler (halaman mail inbox dan mobile tidak kelihatan).
Berikut kodenya (upload CSS) :

/*--------START HERE--------*/
like:after {
background: url("http://images.multiply.com/common/smiles/thumbs_up.png") no-repeat scroll center center transparent;
color: transparent;
content: "suka";
font-size: 10px;
padding: 5px 0px 8px;
}
dislike:after {
background: url("http://images.multiply.com/common/smiles/thumbs_down.png") no-repeat scroll center center transparent;
color: transparent;
content: "unlike";
font-size: 10px;
padding: 5px 0px 8px;
}
/*---------END HERE---------*/

 

Jadi, saat ingin menampilkan tanda jempol (thumb up atau thumb down) di akhir komentar, cukup dengan mengetik <like> atau <dislike> di kotak komentar maka akan muncul gambarnya.

<like>
<dislike>

   
Ps. Kode ini bisa juga dikembangkan dengan smiley/emoticon yang lainnya. Silahkan Praktek Disini.

Cara Memberi Penilaian dengan Bintang [Rating]

Mengukur tingkat kesukaan ataupun peluang tidak cuma bisa dilakukan di kolom REVIEW. Asalkan fitur HTML -nya aktif, maka kode ini bisa diletakkan dimana saja.

--------------------------------------------------------------

● Contoh 1:  " Mood saya hari ini "


● Contoh 2:   Peluang Juara UEFA Champions League 2010-2011




   

   

 


--------------------------------------------------------------


Caranya :  Cukup gunakan opsi 3 pilihan kode bintang berikut ini.

1 ●  Full Star.
   Code:   <img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews.png>

2 ●  Half Star.
   Code:   <img src=http://multiply.com/mu/speedstars/image/1/photos/61/500x500/30/reviews-half-by-SS.png?et=3POX5%2B0wtqcdIMDytPcNNQ&nmid=322623464>

3 ●  Empty Star.
   Code:   <img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews-grey.png>


--------------------------------------------------------------

● Choose one (pilih salah satu). Copy, lalu Paste secara berulang-ulang (Repeat).
● Susunlah dengan teratur. Total rating bisa 5, 10 atau terserah.

--------------------------------------------------------------

Example Rating 2/5

- Rumus : Code1Code1Code3Code3Code3

- HTML yg muncul: <img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews.png><img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews.png><img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews-grey.png><img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews-grey.png><img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews-grey.png>

- Hasilnya: 


--------------------------------------------------------------

Example Rating 3½  ⁄ 5

- Rumus : Code1Code1Code1Code2Code3

- HTML yg muncul: <img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews.png><img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews.png><img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews.png><img src=http://multiply.com/mu/speedstars/image/1/photos/61/500x500/30/reviews-half-by-SS.png?et=3POX5%2B0wtqcdIMDytPcNNQ&nmid=322623464>
<img src=http://images.multiply.com/multiply/icons/clean/24x24/reviews-grey.png>

- Hasilnya: 


--------------------------------------------------------------
 

[Do not Allow to be Resized] Mengunci Ukuran Kotak Komentar/Guestbook di Multiply

Sedikit mengulang dari http://trickmp.multiply.com/notes/item/548

Untuk yang belum tau... biasanya di pojok kanan bawah ada bulatan kecil lima butir
yang gunanya untuk meninggikan atau memendekan ukuran kotak komentar.

Nah untuk menguncinya bisa gunakan Custom CSS seperti berikut ini...

Enter Custom CSS here:

.replybox textarea {
height:77px !important;
}

Keterangan:

• angka 77 perkiraan saya ukuran default-nya, bisa ditambah atau dikurangi sesuai keinginan Anda;
• sedangkan !important fungsinya sebagai pemaksaan agar ukurannya tetap segitu;
• jadi kalo ditarik ke atas atau ke bawah, ukuran tingginya tidak akan berubah
  (di site yang menggunakan CSS ini saja, kalau di tempat lain atau inbox via panorama pastinya berubah juga)

Selamat mencoba, semoga bermanfaat.