Edit CSS Plurk

Plurk, semacam microblogging site dengan tampilan timeline. Cukup menarik, apalagi sistem karmanya yg bikin ketagihan buat ngupdate dan menaikkan karma. Dengan karma kita bisa ngubah tampilan, ganti icon, ganti background, dll. Yang menarik bagi saya adalah dengan karma lebih besar dari 25, kita bisa ngedit CSS dari halaman plurk ini sehingga menjadi semau kita. SIlahkan cek Gallery Themes plurk di Flickr, banyak banget yang menarik.

Tantangan utama adalah gimana cara ngedit CSS nya plurk. Anda perlu mengerti sedikit tentang CSS untuk bisa ngedit theme plurk ini. Tetapi, saya ada beberapa catatan dari proses ngedit CSS plurk ini yang bisa saya bagi untuk membuat halaman profil plurk anda lebih keren.

Remove Logo Plurk

Bosan dengan tulisan Plurk dan Creature anda? Anda bisa menghapusnya dengan menambahkan kode CSS dibawah

#dynamic_logo { margin-top:-1000px; }

Thanks rief ;)

Custom background

Cukup upload gambar background anda di beberapa file sharing provider semacam tinypic.com — hmm.. kepikiran untuk buat sendiri nih, kemudian tinggal tambahkan kode dibawah.

html,body { background: url("http://i38.tinypic.com/XXXXXXX") no-repeat top left; }

Cukup ganti teks url diatas dengan URL tinypic anda. Eh dengan quote atau tanpa quote ga masalah. Tapi saya lebih prefer pakai quote.

Custom background di timeline

Timeline adalah bagian dimana posting2 dari temen2 anda muncul. Kalau anda ingin ganti background, cukup pastekan kode dibawah

#timeline_holder { background:url("http://i34.tinypic.com/2e6h8no.png") no-repeat top left; border:none; }

Seperti biasa, URL nya ganti dengan gambar anda yah ;). Kalau mau transparan, cukup dengan kode dibawah:

#timeline_holder { background:transparent; }

Dashboard

Dashboard adalah bagian bawah tuh, tempat foto anda, profil anda. Mo dibikin transparan? Tinggal:

#plurk-dashboard { background:transparent;}

OK, sementara itu dulu. Btw, saya juga ingin share kode CSS dari profil plurk saya, mungkin dari sini anda bisa coba2

/* Remove plurk Logo */
#dynamic_logo { margin-top:-1000px; }

/* body background */
html,body { background: #000f50 url("http://i38.tinypic.com/2iufjat.jpg") repeat-x top left; }

/* transparent everything*/
#timeline_holder { background:url("http://i34.tinypic.com/2e6h8no.png") no-repeat 20px 50px; border:none; }
#timeline_bg div { border:none; }
#bottom_line { background: transparent; border:none; }
.day_bg .div_inner { background: transparent; border:none; }
#top_login { border:none; }

/* time font */
.bottom_start, .bottom_end { color:#001779;  }
.bottom_line_bg, #filter_tab .off_tab, #filter_tab a { background:#00061F; border:0px none !important; }

/* post textbox */
#input_big { background:#00061F; border:none !important; color:#eee !important; padding:5px; }

/* dashboard */
#plurk-dashboard { background:#00061F; border:1px solid #00146B;  color:#ccc;}
#plurk-dashboard a { font-weight:bold;  }

Hasilnya bisa anda lihat di profil saya

17 Comments | [Put comments]

  1. gravatar jaylangkung - July 31, 2008

    wadwoohhh bahasa tingkat tinggi.. hikss hiks gak isok ngartek no akuww :(
  2. gravatar silent - July 31, 2008

    eh, bukan -1000, tapi : #dynamic_logo { margin-top:-10000px; }. Kalo cuman -1000px mah tetep aja keliatan kalo pake layar 1280.
  3. gravatar Jauhari - July 31, 2008

    Mantep mantep :D
  4. gravatar warmorning - July 31, 2008

    saya baru nyoba sign up, daaan masih bingung, makasih pencerahannya mas :D
  5. gravatar ferdhie - July 31, 2008

    @warmorning: Plurk adalah blogging site. Eh coba2 posting aja deh ;)
  6. gravatar Riri Audiya - August 1, 2008

    tetep setia sama Kronologger
  7. gravatar Bagas - August 1, 2008

    Karmaku dari kamerin gak pernah lebih dari 10 :D
  8. gravatar ferdhie - August 2, 2008

    @bagas: usermu opo le?
  9. gravatar nengbiker - August 4, 2008

    ozawanya ilang
  10. gravatar Fajar Saptono - August 13, 2008

    bagus2... keren
  11. gravatar benazio - September 6, 2008

    thanks thanks yaa hohoo lagi dong hoho
  12. gravatar r.hartiningtyas - September 10, 2008

    wahh .asik . aku ada plurk . belum lama make nya . aku bingung dengan timelinenya. maksudny, fungsi timeline itu apa ya ? dan bagaimana mempergunakannya ?
  13. gravatar eone - December 11, 2008

    wah . . .bagus2. makasih ilmunya ya. . .
  14. gravatar clara - April 12, 2009

    kok ga bisaa :'(

  15. gravatar ferdhie - April 12, 2009

    yg ngga bisa yg mananya?

  16. gravatar nova13 - February 26, 2010

    coba dulu gan....!

  17. gravatar laila utsukushii - January 20, 2012

    cara ganti warna'a gimana??

Reply to Comment #comment:5426 by jaylangkung