Selasa

blogspot template

blog template
Belum ada ide posting nih, baru aja menyelesaikan kerjaan/urusan...

tadi malem, karena susah tidur...sambil melamun + 3 gelas indocaffe, saya iseng2 utak atik css buat template blogspot....niat awalnya mau buat beberapa blog saya ,termasuk blog ini ,karena masih kurang sreg gimana caranya ngatur tata letak konten supaya maksimal dan rapi...
tapi karena saya hasilkan 4 buah layout (sampai pagi sih...begadang) , maka saya pikir bisa saya posting disini ,barangkali ada rekan2 yang mau mencoba juga....
langsung saja di bawah ini hasilnya :

Keempat layout-template blogger ini saya beri nama sesuai corak warna pokoknya + angka 7 favorit saya...hehe : merah , soft/lembut , gelap, biru...
dan semuanya memiliki jumlah widget cukup banyak utk ukuran standard , yaitu 4 buah widget di footer , 4 buah widget di sidebar ,2 widget pada header , 1 widget di bawah header + menu navigasi dan search box , spt pd, gambar di atas..

1. red-7-blogger template
download
lihat demo

2. soft-7-blogger template
download

lihat demo

3. dark-7-blogger template
download
lihat demo

4. blue-7-blogger template
download
blue-7 ini demo-nya belum di pasang ,belum sempet , dan karena blm ada blog barunya juga ...bisa di coba langsung aja, tapi corak nya sama dg red-7 , hanya warna header dan footer aja yg dikit beda..

Disain template2 ini meski banyak menganndung efek embos dan shadow, tapi sama sekali tak menggunakan bahan image/gambar ,kecuali gambar pada logo header yang boleh anda masukan sendiri jika mau, juga tak menggunakan java script semuanya css , yang artinya tentu akan punya performance yang baik pada browser (enteng) , dan style-nya saya sesuaikan dengan yang lagi ngetrend sekarang...

Ok, yang minat silahkan coba...gratis....

NOTE :

1- untuk template2 ini ukuraan gambar untuk background image/logo header, yang normal adalah maks :430 x 110 pixels. ,yaitu pada header bagian kiri.
2- ada 3 section yg perlu anda ganti adalah :
-favicon image, ada pada daerah atas kode2 css, sementara ini sy beri url dari yahoo icon...spt di bawah ini, gantilah dengan image host gambar anda

<link href='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' rel='shortcut icon' type='image/x-icon'/>
<style id='page-skin-1' type='text/css'><!--



- menu navigasi, spt di bawah ini

<ul>
<li><a href='#'><b>Home</b></a></li>
<li><a href='#'>Link-1</a></li>
<li><a href='#'>Link-2</a></li>
<li><a href='#'>Link-3</a></li>
<li><a href='#'>Link-4</a></li>
<li><a href='#'>Link-5</a></li>
</ul>
</div>
</div>

- search box , bisa anda ganti dg search adsense anda
<form action="YOUR-SITE/search" id="searchThis" method="get" style="display: inline;">
<input id="searchform" name="q" size="22" type="text">
<input id="sbutt" value="Go" type="submit">
</form>

3-template2 ini dlm formart xml, silahkan di upload file xml-nya atau dg meg-eksplore kode2nya .....Jika ada pertanyaan , silahkan ke blog ini

4- semua nya sudah saya coba sendiri ,spt terlihat dan di beberapa browser serta emiliki performance yg baik ...dan sudah, memakai format kotak komentar versi baru juga.

5, bagi yang mau memodifikasi script css-nya ,maaf pada penyusunan variabel2 css belum di susun rapi dan di beri keterangan (blm sempat) ..tapi sy brasa. tak terlalu masalah..busby seo tes

19 komentar:

  1. Saya pilih yang no 3 (dark-7-blogger template) :)

    BalasHapus
  2. Lha postingan ini, sangat sensasional dibilang nggak ada ide?

    Kemana aja bang?

    BalasHapus
  3. Benerjuga kata Feri, yang dark-7 lebih mantabs

    BalasHapus
  4. hhmmmm, kayaknya milih yg no 3 dech. coz agak sensual gitu (loch) hehehe

    BalasHapus
  5. Waaakkkssssss gak ada ide aja buat template suhu, gimana kalau ide cemerlangnya keluar ya??? aku aja kalo buat templae pasti untuk proyek besar wan hahaha

    BalasHapus
  6. wow..!!! mantabfzh abiz...
    boleh donload nyang no: 1,2,3,4 ya.?? :)
    sekali mantebzhz..!!!

    BalasHapus
  7. Mas iwan sy mo tanya nih gimana cr bikin readmore di template red-7, soalnya saya ingin di halaman depan saya bisa model postingan "readmore".
    Makasih sbelumnya Mas

    BalasHapus
  8. @Faat
    sudah aku posting di link bawah ini ya:
    Bubsy SEO Test - Make Readmore Menu blogspot templates

    klo ada masalh silahkan tinggalkan pesan lagi

    :)

    BalasHapus
  9. Gmana sih caranya bikin post a comment seperti ini??

    BalasHapus
  10. @marfy161
    gampang aja,view aja kode blog ini pada bagian comments,trus copy-paste untuk mengganti comments clog kamu di bawah ini kodenya :
    #comments h4 {
    margin:0;
    font-weight: bold;
    line-height: 1.4em;
    text-transform:uppercase;
    letter-spacing:.2em;
    color: #222222;
    }
    #bg_commentblock {
    width: 490px;
    background: #E7E4DF;
    float: left;
    padding:5px;
    margin:auto;
    border: 1px solid #222222;
    -moz-border-radius-bottomleft:15px;
    -moz-border-radius-bottomright:15px;
    -moz-border-radius-topleft:15px;
    -moz-border-radius-topright:15px;
    }
    #commentblock {
    width: 470px;
    background: #E7E4DF;
    text-align:left;
    padding:5px;
    margin:5px;
    -moz-border-radius-bottomleft:15px;
    -moz-border-radius-bottomright:15px;
    -moz-border-radius-topleft:15px;
    -moz-border-radius-topright:15px;
    }
    #commentblock ol {
    list-style-type: square;
    margin:auto;
    padding:10px;
    }
    .commentdate {
    font-size: 12px;
    padding-left: 5px;
    }
    #commentlist li p {
    margin: 5px;
    line-height: 20px;
    padding: 0px;
    }
    .commentname {
    color: #222222;
    margin: 0px;
    padding: 5px;
    }
    .commentinfo{
    clear: both;
    }
    .commenttext {
    clear: both;
    margin:auto;
    padding: auto;
    width: 460px;
    background: #E7E4DF;
    }
    .commenttext-admin {
    clear: both;
    margin:auto;
    padding:auto;
    width: 460px;
    background: #E7E4DF;
    }

    jadi di mulai dari : #comments h4 sampai .commenttext-admin di blog kamu di hapus di ganti dengan kode di atas , coba aja, dulu kalo ada masalh silahkan tanya lagi kesini , ok
    :)

    BalasHapus
  11. Oke mas Iwan. Thank ya infonya. Ni blog saya www.nagaliu.co.cc

    BalasHapus
  12. Saya uda pake template dark-7, tapi ga bisa masukkan post a commentnya gmana??

    BalasHapus
  13. Gmana cara ganti tulisan LINK1 s.d LINK 4

    BalasHapus
  14. Code comment sudah saya copy, tapi masih ga tampil

    BalasHapus
  15. salam kenal.
    izin pake templatenya om....
    makasih..

    BalasHapus
  16. ADa yang lebih oke g bos templatnya....thnk

    BalasHapus
  17. http://templatefree4u.blogspot.com/ lihat template ku dong and kasi pendapat nya ya ??!!!!!!!

    BalasHapus
  18. pada pinter ya buat template,..salut

    BalasHapus
  19. Master aku da coba tampilanya yang very good bg aku yang masih newbie but kayaknya banyak yng da pake jd aku balikin lg kedafault. So di my tab ku ada gbr yg lucu but.... jg ngeledek ha.. ha..
    Thanks' bro'x. Good Luck.!

    BalasHapus