Melengkungkan Sudut Template Blogger


Bismillah.. Alhamdulillah... Sekiranya hari ini kita dapat berjumpa kembali dengan ku, hari ini aku akan sedikit membagi pengalaman dariku yang sudah aku pelajari, yaitu bagaimana sih membuat sudut pada template pada blogspot yang awalnya kotak siku kemudian di ubah menjadi lengkung, memang ini sedikit tips yang kurang berguna tapi jika sobat ingin mencobanya dan mempraktekannya di blog sobat untuk mempercantik templatenya silakan ikuti saja Tutorial yang aku berikan ya sob, karena caranya cukup mudah.



Seperi yang tertera pada gambar di atas, itu awal blog ku memiliki sudut yang siku - siku kemudian aku merubahnya menjadi lengkung dengan menambahkan CSS Rounded Corner ,pada CSS Body.

Tidak panjang lebar ayo kita coba memodifikasinya.

1. Login » Blogger
2. Rancangan » Edit HTML
3. Kemudian cari kode #wrapper biasanya terdapat di kumpulan CSS berkut di Blog Sobat.

#wrapper{width:960px;padding:10px 0 0 0;margin:0 auto;overflow:hidden;background:#fff;
4. Kemudian Masukan salah satu CSS Rounded Corner di dalam kurung {Masukan di dalam sini}

Seperti penempatan CSS Rounded Corner yang ada di blogku.
#wrapper{width:960px;padding:10px 0 0 0;margin:0 auto;overflow:hidden;background:#fff;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-khtml-border-radius: 7px;}

Salah satu CSS Rounded Corner yang ku pakai di Blogku.
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-khtml-border-radius: 7px;

Catatan
Semakin besar ukuran pada Px, semakin besar pula lengkungannya.
Untuk jenis CSS Rounded Corner; yang lainnya bisa cek di sini




5. Jika sudah selesai silakan klik SIMPAN TEMPLATE atau jika masih ingin meliha preview template sobat klik PRATINJAU

Alhamdulillah, sudah selesai tutorial di atas, silakan sobat coba sendiri, Selamat Mencoba :)

21 Responses to "Melengkungkan Sudut Template Blogger"

  1. mantaaaab tutorialnya gan, support & keep write

    ReplyDelete
  2. Ane dah pake sob di header sama di sidebar,lanjutkan teruz....

    ReplyDelete
  3. @Showga : pastinya sob.. :D

    @Musa : okes sob, di bookmark aja.. hehe

    ReplyDelete
  4. Beghh dasarr haratt nagh heheh kalah dagh blog qw ~

    ReplyDelete
  5. @Muhammad Rudy:
    Ngeblog itu kdd sistem kalah menang, yg penting bisa memberikan solusi satu sma lain,.. hehe

    ReplyDelete
  6. makasih udh mengunjungi BaBlogLo...
    oh ya artikel diatas bisa dicoba di BaBlogLo tuh...hihihihi

    ngmg2 soal temple BaBloglo...
    tu dasar templetnya adalah punya Viemonsta Networks,
    cari aja di google mas...
    tapi klo yang sekarang ne udah mega rombak templetnya 90%, jadi yang tersisa dari yang asli cuma font sama warna aja mas..

    ReplyDelete
  7. Tutorial yang mudah di ikuti. Bisa dicoba nih.

    ReplyDelete
  8. @Mega:
    Makasih mega, tar dh aku cari .. buat koleksi aja sih :D

    ReplyDelete
  9. wah thanks sob informasi templatenya ini , dr blog ente ada 8 bookmark yg ane simpan.. 4 diantaranya sudah dipraktekkan :) terima kasih lho ... keep blogging mengenai tutor2ini semoga bisa bantu saya :) terima kasih yah

    ReplyDelete
  10. mantap ne artikelnya,, ane perlu ne sob ,, makasi udah share :)

    ReplyDelete
  11. wah urang banjar jua kah dangsanak?? salam kenal dulu nah hehe

    ReplyDelete
  12. blognya bagus sekali, gaya blog agan adl blog minimalis...tdk ada iklan & tdk banyak widget, saya suka & support blog agan :d

    ReplyDelete
  13. Alhamdulillah berhasil sobat tipsnya...makasih

    ReplyDelete
  14. keren tipsnya gan.. salam kenal gan!! berkunjung ke blog gua ya!!

    ReplyDelete
  15. Mantanb Gan..di coba elmunya ya ^_*

    ReplyDelete
  16. wah, keren yah, ehehee...
    kalo saya pake radus utk hover search bar aja, yg lain masih standard aja, ehehee

    makasih infonya ^^

    ReplyDelete