Membuat tampilan CBOX lebih keren dengan Bingkai


Langsung saja yee,, tanpa basa-basi saya ingin membagi cara bagaimana memberi bingkai pada CBOX dengan Gambar yang lebih cantik J.
Sebelumnya anda lihat terlebih dahulu CBOX yang saya berinama BUKU TAMU di samping kanan atas , cantikkan ??? hehehe...

langkah-langkahnya adalah sebagai berikut :




  • Dahsboard > Tata Letak
  • Cari dimana letak gadget CBOX yang telah anda buat sebelumnya,
  • Setelah ketemu, tambahkan kode dibawah ini kedalam kotak HTML/JavaScriptnya.


<center><div id="edited" style="width:250px; height:190px; background: url(BACKGROUND CBOX) no-repeat left top; padding-top:65px; padding-left:0px; position:relative" align="center">CBOX CODE</div></center> 


  • Perhatikan kode diatas, teks yang berwarna merah dapat anda tukar dengan URL Gambar yang anda pilih, ada beberapa contoh bingkai CBOX yang cantik-cantik lihat dibawah ini



http://i.imgur.com/fISou.png


http://i.imgur.com/aRz7d.png



http://i.imgur.com/gO6N8.png 


http://i.imgur.com/XjGge.png


http://i.imgur.com/sQewp.png 

Gambar di Atas saya ambil dari blog http://fiezamirza.blogspot.com , jadi gambar itu adalah miliknya.

Selain gambar di atas ada lagi gambar yang saya ambil dari blog http://aniannie1.blogspot.com , gambar berikut adalah milik yang punya blog tersebut. untuk menggunakan Bingkai ini, anda harus mengganti Width dan Height nya terlebih dahulu menjadi Widht = 200 px , Height = 370 px agar sesuai dengan gambar yang ada.

http://i.imgur.com/ecGENK7.png


http://i.imgur.com/mSiMKWP.png


http://i.imgur.com/D3tcqSO.png


http://img827.imageshack.us/img827/5499/framefibox1.png

Ok untuk gambar selanjutnya menyusul yaa :)

  • selanjutnya , gantikan teks berwarna biru dengan Script CBOX yang telah anda buat sebelumnya , masih ingatkan di tutorial yang satu ini "Mengubah Warna Latar CBOX"
  • Jika sudah selsai, Simpan perubahan tersebut lalu refresh tampilan blog anda. 


Selamat Mencoba :)

12 comments:

  1. Blognya cantik banget ya dengan kombinasi warna pink,, :)

    ReplyDelete
  2. Makasih kak, caranya gimana kak buat menghias blognya?

    ReplyDelete
    Replies
    1. Banyak2 baca tutotial blog dan memahami kode html/css yang ada de,, harus punya kemampuan desain juga minimal bisa mengkombinasikan warna....

      Delete
  3. Subhanallah...cantik blog Anti....

    ReplyDelete
  4. Kak, boleh nanya gak?? cara buat greeting image yang diatas post seperti gambar assalamualaikum itu kayak gimana? ajarin dong. terimakasih sebelumnya ^_^

    ReplyDelete
  5. Sangat kereeeen. Elegan Banget.. :)

    Happy Download!! ^^ Blogwalking.. Salam Kena Ganl! :))


    Mampir Yak!! http://psychoislam.blogspot.com/


    Download Nasyid | Ebook | Film/Video | Journal | Islam | Psikologi

    ReplyDelete
  6. subhanallah...:)
    kren skali blog nya gan, :)
    postingan nya sangat membantu saya yg baru pemula ini.. :$
    mampir iya http://mursalinautami29.blogspot.co.id/
    masih sangat sederhana blog nya.. :)

    ReplyDelete
  7. wah kerennn....!!! postingan yang cantik. juga bermanfaat.
    visit balik yah blog aku.
    http://4fantasyofworld.blogspot.co.id/

    ReplyDelete