Sunday, January 31, 2010

Membuat daftar isi otomatis pada Posting

Jenis daftar isi kali ini sebenarnya sudah ada pada posting sebelumnya membuat daftar isi otomatis, Tapi setelah saya mencoba teryata untuk jenis yang pertama cukup membuat loading blog menjadi agak berat sehingga dengan sedikit modifikasi agar loading blog jadi ringan daftar isi diletakkan pada posting. ada juga cara agar loading blog kita jadi lebih ringan yaitu dengan mengatur widget yang kita tampilkan pada halaman utama dan pada sub halaman kamu bisa baca di mengatur widget untuk tampil di halaman utama dan sub halaman

Untuk kode script yang dipakai sama dengan jenis yang pertama.

Kita langsung ke TKP saja biar jelas
Langkah Pertama

  • Login ke akun Blogger kamu.
  • Dari halaman dashboard, pilih Edit HTML.
  • Pada halaman Edit HTML, centang "Expand Template Widget", cari kode ]]></b:skin>
  • Copykan script berikut dan letakkan di atas kode ]]></b:skin> tersebut.
  • Tekan Control F atau F3 untuk mencarinya.

#toc { border: 0px solid #8A4B08; background: transparent; padding:2px; width:495px; margin-top:10px;}

.toc-header-col1, .toc-header-col2,

.toc-header-col3 { background: #8A4B08; color: transparent; padding-left: 5px; width:250px;}

.toc-header-col2 { width:75px;}

.toc-header-col3 { width:125px;}

.toc-header-col1 a:link, .toc-header-col1 a:visited,

.toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link,

.toc-header-col3 a:visited { font-size:100%; text-decoration:none;}

.toc-header-col1 a:hover,

.toc-header-col2 a:hover,

.toc-header-col3 a:hover { font-size:100%; text-decoration:underline; color:#3D3F44;}

.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 { padding-left: 5px; font-size:100%; background: transparent;}
Keterangan : 
  • Warna hijau menunjukan kode warna yang bisa kamu ganti sesuai dengan warna blog kamu.

Simpan Template.


Langkah Kedua
  1. Klik New posting seperti biasanya.
  2. Klik pada New Posting - Edit HMTL
  3. Copy and paste kode dibawah ini
<div id="toclink">
<div style="text-align: center;">
<span style="font-size: large;"><b><a href="javascript:showToc();">LIHAT DAFTAR ISI</a></b></span></div>
</div>
<script src="http://sites.google.com/site/kibagusnet/x-design/blogtoc.js">
</script>
<script src="http://kibagus-homedesign.blogspot.com/feeds/posts/default?alt=json-in-script&amp;max-results=999&amp;callback=loadtoc">
</script>

<div style="text-align: left;">
<div id="toc">
</div>

Tips :
  • Klik LIHAT DAFTAR ISI Untuk melihat seluruh posting
  • Klik Post Title.........., melihat posting sesuai urutan abjad A - Z atau Z - A
  • Klik Post Date........., melihat posting sesuai urutan Tanggal Lama - Baru atau Baru - Lama
  • Klik Post Label........, melihat posting secara Keseluruhan
  • Klik Post Jenis Label, melihat posting pada label tertentu

Keterangan :
  • Untuk keterangan warna merah bisa kamu hapus / kamu ganti dengan kata kata kamu sendiri
  • Ganti  kode >LIHAT DAFTAR ISI< dengan kata kata kamu sendiri.
  • Ganti  kode http://kibagus-homedesign.blogspot.com/feeds/posts/default dengan URL kamu sendiri.
  • Sebelum kamu simpan beri label pada posting dan atur tanggal posting 1 bulan yang lalu/lebih, tujuannya agar posting baru "daftar isi" ini tidak kelihatan pada halaman utama saat kamu simpan dan publish.
  • Simpan dan Publish.
Langkah ketiga
  1. Klik Page Element
  2. Klik Add Gadget
  3.   AddGadget
  4. Klik plus button (+) for HTML/JavaScript. (img)

    HTML
  5. Copy and paste kode dibawah ini

<a href="http://bestdesignroom.blogspot.com/2009/12/all-posting.html" target="_blank">Daftar Isi</a>

( Ganti URL dengan Alamat posting daftar isi kamu sendiri )
Pasang Kode tersebut pada posisi yang tepat, akan lebih baik bila kamu pasang menjadi satu bagian dengan menu utama kamu, biar tampil keren seperti kamu lihat pada blog ini. ( sederhana tapi keren......! )

Simpan dan lihat hasilnya.
________________________________________
Selamat mencoba...!
Sukses selalu buat kamu semua....!

Friday, January 29, 2010

Tips Membuat BLog yang Menarik dan Berkualitas bagi Pemula


ring
Menjadi seorang Blogger bukanlah sesuatu yang sulit dan menakutkan, pada awalnya mungkin bagi yang belum pernah akan sedikit mengalami kesulitan karena banyaknya hal hal lain selain menulis yang harus diketahui mulai dari template, widget, advertise, promosi, dll yang mau tidak mau akan selalu menjadi bagian dari blog itu sendiri.

Pada kesempatan ini saya mencoba menulis bagaimana cara Membuat BLog yang Menarik dan Berkualitas bagi Pemula, sebenarnya ini lebih dari pengalaman pribadi saya yang baru menjadi blogger sejak kurang lebih pertengahan tahun 2009, saya sendiri tidak tahu apakah saya sudah layak disebut blogger atau belum. tapi yang terpenting adalah kita harus terus belajar dan belajar.

Berikut Hal - hal mendasar yang perlu dilakukan :
  1. Kamu harus punya Email, kalau belum punya bisa daftar disini Google Mail 
  2. Daftarkan untuk mulai, yang paling banyak dipakai adalah Blogger.com dan WordPress.com, ikuti langkah langkah yang ada. ( mengenai detail pendaftaran dan cara posting akan dibahas pada kesempatan yang lain )
  3. Pilihlah template bagi blog kamu, disarankan untuk memilih template default yang sudah disediakan.
  4. Sebelum kamu mulai untuk Posting, hal yang harus kamu lakukan adalah memilih Tema ( judul ) yang akan kamu angkat bagi blog kamu, contohnya : tema budaya, memasak, flora dan fauna, personal, arsitektur, bisnis on line, dan hal hal lain yang sesuai dengan keinginan kamu.
  5.  Pemilihan Tema menjadi sangat penting karena blog yang bagus adalah blog dengan karakter dan Identitas yang jelas, kalau tema yang kamu angkat terlalu luas dan banyak akan membuat blog kamu menjadi tidak jelas dan bisa dikatakan tidak punya karekter dan identitas yang jelas.
  6. Untuk membuat blog menjadi multi informatif kamu bisa menentukan beberapa sub-tema yang menjadi bagian dari blog dengan tetap menonjolkan Tema Utama yang ada.
  7. Jadikanlah blog kamu menjadi blog yang informatif dalam pengertian mudah diaskes, dengan pengaturan posting dan menu yang tidak rumit sehingga bagi pembaca yang mengunjungi blog kamu menjadi betah.
  8. Jadikanlah blog kamu menjadi blog yang interaktif dalam pengertian memberi kemudahan bagi pengunjung untuk ikut berpartisipasi dengan komentar atau saran.
  9. Berilah tempat layak bagi Blogger yang lain untuk meramaikan blog kamu dengan media Link Exchage, karena untuk mempromosikan blog kamu agar banyak pengunjung link Exchange merupakan cara yang mudah dan murah.
  10. Carilah template yang sesuai dengan selera dan karakter kamu, cukup banyak template yang bisa kamu pakai cukup melakukan search di komputer kamu ketik "template blog" kamu tinggal pilih dan download template yang kamu sukai.
  11. Rajinlah mengunjungi blog yang lain terutama yang sudah terkenal dan senior, kamu bisa mencari inspirasi untuk design blog kamu dengan melihat bagaimana cara pangaturan posting dan widget yang bagus.
  12. Pasanglah link di blog kamu ( media Link Exchage ) apabila kamu merasa bahwa blog tersebut bisa kamu jadikan refensi walaupun blogger yang bersangkutan tidak memasang link blog kamu.
  13. Jangan pernah takut untuk melakukan experiment ( bongkar pasang blog ), saya sendiri sudah berkali kali melakukan bongkar pasang bahkan sampai sekarang masih sering, yang terpenting jangan sampai terima bongkar tapi tidak bisa pasang.
  14. Dan yang utama adalah rajinlah posting agar blog kamu menjadi semakin berisi dan berkualitas.
 Nah itulah sedikit Tips untuk membuat blog yang bagus dan menarik, mungkin masih banyak Tips yang lain bisa kamu cari pada blog sahabat yang ada, yang terpenting jangan pernah berhenti untuk belajar.

Bagi yang punya saran yang lain bisa menulis pada kolom komentar, agar kita bisa saling berbagi satu sama lain, terimakasih sebelumnya...!!!

Happy blogging ...
sukses selalu buat kamu semua...!

Thursday, January 28, 2010

Jasa Design Rumah Tinggal dan Perkantoran

Design Rumah Tinggal dan Perkantoran

Menerima jasa design rumah tinggal dan perkantoran On - Line Via Email :
Rincian kesepakatan dan product :

Jasa Design Type 1
  • Denah Bangunan
  • Tampak Bangunan ( depan, samping kanan / kiri, Belakang )
  • Biaya jasa design Rp. 7.500,- / m2

Jasa Design Type 2
  • Denah Bangunan
  • Tampak Bangunan ( depan, samping kanan / kiri, Belakang )
  • Detail Struktur Bangunan
  • Detail Potongan
  • Biaya jasa design Rp. 20.000,- / m2
    _________________________________________________
    Product design

    Gambar standart Acad  ( ukuran kertas A4/A3 )
    • Denah
    • Tampak depan samping dan belakang
    • Potongan bangunan
    • Detail konstruksi ( struktur bangunan )
    Untuk Rencana Anggaran Biaya, Gambar 3 Dimensi (SketchUp), Spesifikasi dan Volume material yang dipakai merupakan opsi tambahan yang akan dikenakan biaya tambahan ( optional - harga nego )
    _________________________________________________

    Bila berminat silakan menghubungi lewat Email
    Email - hdideas05@gmail.com

    Data awal yang dibutuhkan :
    1. Kebutuhan Ruang
    2. Data ukuran lahan
    3. Keterangan batas-batas fisiknya & situasi sekelilingnya
    4. Foto lahan, contoh rumah atau ruangan yang ingin dibuatkan desainnya ( optional )
    5. Data lainnya yang dianggap perlu


    Terima kasih.

    Wednesday, January 27, 2010

    Konsep Greeen Building antara Impian dan Kenyataan


    Pemanasan global saat ini menjadi isu penting dunia. Untuk mengantisipasinya, telah dikembangkan konsep ramah lingkungan dalam berbagai aspek kehidupan termasuk dalam bidang konstruksi dan bangunan melalui konsep green building. kepedulian terhadap isu pemanasan global (global warming) perlu diwujudkan dalam tindakan nyata, baik dalam skala kecil yaitu tindakan sehari-hari maupun dalam skala besar, seperti membangun gedung berkonsep hijau yang ramah lingkungan.

    Banyak orang memiliki pemahaman berbeda-beda tentang arsitektur hijau. Ada yang beranggapan besaran volume bangunan (koefisien dasar bangunan/KDB) harus lebih kecil dari koefisien dasar hijau (KDH) pada total luas lahan. Perbandingan KDB (50-70 persen) dan KDH (30-50 persen) yang seimbang diharapkan mampu mewujudkan hunian ideal dan sehat secara konsisten.

    Keterbatasan lahan mendorong optimalisasi setiap jengkal lahan dan fungsi setiap ruang. Tidak ada ruang yang terbuang atau mati. Ketersediaan lahan hijau dikembangkan optimal di halaman depan, samping, belakang, serta teras balkon depan, dan tengah/samping. Taman merupakan bagian dari penghijauan rumah yang bertujuan memperbaiki kualitas lingkungan kota, mendinginkan udara sekitar rumah, mendapatkan pemandangan alam, dan ruang bermain. Tidak sekadar hijau.

    Riuhnya pengembang berkomitmen tinggi pada lingkungan terutama tampak pada negara-negara yang secara ekonomi lebih maju. Di Amerika Serikat, sejumlah kota bahkan sudah memberi imbuhan wajib bagi pengembang untuk mengkonstruksikan bangunannya berdasarkan pendekatan ramah lingkungan. Datanglah ke beberapa kota, di antaranya di Washington, Chicago, dan Boston, kemudian lihatlah bagaimana gedung-gedung peraih langit bersahabat dengan lingkungan.

    Di sejumlah teras bangunan tampak menyembul tanaman aneka jenis. Lalu di lantai tertentu dibuat lantai dengan konstruksi lebih kokoh agar di situ dapat dijadikan areal tanaman dengan pohon lima meter. Datanglah pula ke beberapa kota lain seperti Wellington, Melbourne, Tokyo, Yokohama, Kyoto, Kopenhagen, Wina, Singapura dan sebagainya.

    Menariknya, ramah lingkungan tidak lagi diidentikkan dengan menanam sebanyak mungkin pohon dan rumput termasuk di atap dan teras-teras gedung. Tidak pula selalu dicirikan dengan membuat sumur resapan, dan kolam penampung air hujan.

    Ramah lingkungan ditunjukkan dengan mereduksi penggunaan listrik hingga 40 persen. Caranya menggunakan bohlam yang lebih mahal tetapi tahan lama dan wattnya amat kecil. Atau mesin pendingin AC yang akan menurunkan kerakusan AC menyedot energi.

    Upaya menjadikan green building di Indonesia sudah banyak terdengar. Bahkan banyak gedung perkantoran, pusat perbelanjaan, sekolah yang mengklaim sebagai green building. Tapi tahukah Anda, standar apa yang digunakan untuk menunjukkan suatu gedung patut dikategorikan ramah lingkungan?

    Sampai saat ini belum ada standart yang jelas mengenai apa yang disebut dengan Green Building. Bagaimanapun juga harus ada standart yang jelas yang bisa dipakai dan dijadikan ukuran pada setiap proses pembangunan yang ada di Indonesia, karena tanpa itu akan banyak muncul klaim mengenai Green Building yang belum tentu sesuai dengan apa yang diharapkan.


    Konsep green building ini jika diterapkan dengan baik tentunya tidak akan lagi kasus bahwa penghematan energi yang mengharuskan para pekerja perbankan cuti di hari Sabtu dan Minggu serta keharusan sektor industri yang merubah jam kerja menjadi hari libur. Konsep ini telah menghadirkan sebuah solusi yang cukup jitu bagi program penghematan energi.

    Sunday, January 24, 2010

    Blog Award Diakhir bulan january 2010

    Mendapatkan award adalah sesuatu yang menyenangkan dan membuat saya lebih bersemangat, untuk itu saya ucapkan terima kasih buat teman teman yang telah mendukung blog saya yang sederhana ini dan saya minta maaf mungkin dalam beberapa hari ini tidak begitu aktif karena banyaknya kesibukan yang cukup banyak menyita waktu.

    Award ini saya dapat dari sahabat Jho dengan Freshinpirasi-nya

    Jumlah award yang diberikan ada 4 buah jenis ( Terimakasih sahabat ), ini adalah award tersebut :







     dan yang terakhir adalah Award dengan backlink :



    Award diatas akan saya teruskan sebagai rasa terima kasih kepada para sahabat-sahabat baik saya diantaranya :

    All about Google
    Astaga.com lifestyle on the net
    www.aneh81.co.cc
    Belajar Forex
    Blog Tutorial Untuk Pemula
    Blogging in My Style
    BLOG PROJECT
    Blogging Tutorial, Free Templates and Sites Info
    code-code-an {Dokumentasi tutorial dan desain weblog}
    Internet Marketing and Online Business Sharing
    JUAL LAGU & PV JEPANG
    Josie's Window - Home family health environment
    My Experience
    My own Piano
    nowGoogle.com Adalah Multiple Search Engine Popular
    ngajak ngakak koleksi humor gambar sms video lucu
    On Line
    Siak Bunga Raya
    the bata bata......ARCHITECTURE & DESIGN
    kapanmaju
    archv3nture
    media.bumikupijak
    Nophie center
    xchanger
    kluwan lover
    auto-runs
    ruangsc


    ____________________________________________
    Kalau sahabat berkenan silakah mengambil awardnya boleh memilih salah satu atau semuannya. tetapi jika sahabat ambil award yang berbacklink maka mempunyai aturan sendiri yaitu sahabat diwajibkan untuk mencantumkan link-link dibawah ini :
    ____________________________________________
    1. seksologic
    2. all in 4 u
    3. omzen
    4. amin
    5. Rifkymedia
    6. Check this out
    7. Rezhaxite
    8. Aciid21
    9. Fresh Inspirasi
    10. Home Design Ideas

    Peraturannya :

    Sebelum kamu meletakkan link di atas, kamu harus menghapus peserta nomor 1 dari daftar. Sehingga semua peserta naik 1 level. Yang tadi nomor 2 jadi nomor 1, nomor 3 jadi 2, dst. Kemudian masukkan link kamu sendiri di bagian paling bawah (nomor 10). Tapi ingat, kalian semua harus fair dalam menjalankannya. Jika tiap penerima award mampu memberikan award ini kepada 5 orang saja dan mereka semua mengerjakannya, maka jumlah backlink yang akan didapat adalah 1.953.125. Nah, silahkan copy paste saja, dan hilangkan peserta nomor 1 lalu tambahkan link blog/website kamu di posisi 10. Ingat, kamu harus mulai dari posisi 10 agar hasilnya maksimal. Karena jika kamu tiba-tiba di posisi 1, maka link kamu akan hilang begitu ada yang masuk ke posisi 10.

    Ketika kamu berada di Posisi 10, jumlah backlink = 1 Posisi 09, jumlah backlink = 5 Posisi 08, jumlah backlink = 25 Posisi 07, jumlah backlink = 125 Posisi 06, jumlah backlink = 625 Posisi 05, jumlah backlink = 3,125 Posisi 04, jumlah backlink = 15,625 Posisi 03, jumlah backlink = 78,125 Posisi 02, jumlah backlink = 390,625 Posisi 01, jumlah backlink = 1,953,125

    Dan semuanya menggunakan kata kunci yang kamu inginkan. Dari sisi SEO kamu sudah mendapatkan 1,953,125 backlink dan efek sampingnya jika pengunjung web para downline kamu mengklik link itu, kamu juga mendapatkan traffik tambahan.

    Terimakasih semuanya...
    Have a nie day.....!

    Friday, January 22, 2010

    Mengatur Widget untuk tampil di halaman utama atau sub halaman

    Permasalahan yang paling banyak terjadi pada Blogger adalah penggunaan widget yang cukup banyak sehingga loading menjadi berat dan blog menjadi penuh baik berupa scrip atau image.

    Untuk itu ada cara untuk mengatasi hal tersebut yaitu :  
    • Dengan cara mengatur widget agar sebagian tampil pada halaman utama dan sebagian pada sub halaman.
    Kita langsung ke TKP saja biar jelas
    Langkah Pertama

    • Login ke akun Blogger kamu.
    • Dari halaman dashboard, pilih Edit HTML.
    • Pada halaman Edit HTML, centang "Expand Template Widget", cari kode bawah ini


    <b:widget id='HTML17' locked='false' title='My favorite' type='HTML'>
    <b:includable id='main'>
    Kode 1 sisipkan di sini
      <!-- only display title if it's non-empty -->
      <b:if cond='data:title != &quot;&quot;'>
        <h2 class='title'><data:title/></h2>
      </b:if>
      <div class='widget-content'>
        <data:content/>
      </div>

      <b:include name='quickedit'/>
    Kode 2 sisipkan di sini 
    </b:includable>
    </b:widget>

    Tips :
    • Sebelum itu kamu harus memberi nama/judul pada widget kamu, supaya waktu mencari script tidak kebingungan karena tanpa nama/judul widget yang akan muncul hanya nomer saja - <b:widget id='HTML17' locked='false' title='My favorite' type='HTML'> - warna merah adalah nomer widget, warna hijau adalah nama/judul widget.
    •  Bila kamu tidak menginginkan nama/judul widget, maka kamu bisa menghapus setelah selesai menlakukan trick ini.

    Berikut Kode yang harus kamu sisipkan :
    • Widget tampil dihalaman utama/depan
    Kode 1
    <b:if cond="data:blog.url == data:blog.homepageUrl">

    Kode 2
    </b:if>
    • Widget tampil di Sub halaman
    Kode 1
    <b:if cond='data:blog.pageType == "item"'>

    Kode 2
    </b:if>

    Setelah selesai simpan dan lihat hasilnya.
    Selamat mencoba.....
    Semoga bermanfaat..!

    Thursday, January 21, 2010

    Daftar isi







    Blogger Style Inspirasi dan Kreasi 

    Tips :
    • Klik LIHAT DAFTAR ISI Untuk melihat seluruh posting
    • Klik Post Title.........., melihat posting sesuai urutan abjad A - Z atau Z - A
    • Klik Post Date........., melihat posting sesuai urutan Tanggal Lama - Baru atau Baru - Lama
    • Klik Post Label........, melihat posting secara Keseluruhan
    • Klik Post Jenis Label, melihat posting pada label tertentu
    Sign up for PayPal and start accepting credit card payments instantly.

    Wednesday, January 13, 2010

    Membuat Variasi Marquee - teks bergerak

    Marquee merupakan kode HTML yang berfungsi untuk membuat teks berjalan, penggunaan cara ini cukup mudah dan sederhana.
    Langkah pertama

    1. Klik Page Element
    2. Klik Add Gadget
    3.   AddGadget
    4. Klik plus button (+) for HTML/JavaScript. (img)

      HTML
    5. Copy and paste kode dibawah ini

    Kode Script 1 bergerak ke arah kanan






    Hasilnya :

    ISI TEKS KAMU

    Kode Script 2 bergerak ke arah kiri






    Hasilnya :

    ISI TEKS KAMU

    Kode Script 3 bergerak ke arah kanan dan kiri bolak Balik






    Hasilnya :

    ISI TEKS KAMU

    Kode Script 4 bergerak ke arah atas






    Hasilnya :

    silahkan tunjuk ke sini


    Keterangan :

    • BGCOLOR="warna" --> Untuk mengatur warna background (latar belakang) teks
    • DIRECTION="left/right/up/down" --> Mengatur arah gerakan teks
    • BEHAVIOR="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan
    • Scroll --> teks bergerak berputar
    • Slide--> teks bergerak sekali lalu berhenti
    • Alternate --> teks bergerak dari kiri kekanan lalu balik lagi
    • TITLE='pesan" --> Pesan akan muncul saat mouse berada di atas teks
    • SCROLLMOUNT="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya.
    • SCROLLDELAY="angka" --> Untuk mengatur waktu tunda gerakan dalam mili detik
    • LOOP="angka|-1|infinite" --> Mengatur jumlah loop
    • WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen.
     Selamat mencoba..!

    Membuat Link Blog berwarna Pelangi


    Membuat tampilan blog agar lebih menarik merupakan trik yang bisa dipakai untuk mempercantik tampilan blok kita. Salah satu trik yang ada adalah membuat warna pelangi pada link pada saat mouse kita arahkan pada link tersebut.

    Langkah Pertama

    • Login ke akun Blogger kamu.
    • Dari halaman dashboard, pilih Edit HTML.
    • Pada halaman Edit HTML, centang "Expand Template Widget", cari kode </head> pada script template blog kamu. Tekan Control F atau F3 untuk mencarinya.
    • Copykan script berikut dan letakkan di Bawah kode </head> tersebut.



    Simpan dan lihat hasilnya.

    Kode ini bisa dipakai apabila kita ingin membuat link blog berwarna pelangi secara keseluruhan, tapi bila kamu ingin membuat link berwarna sesuai dengan blog kamu. kamu tidak perlu pakai cara ini.

    Semoga bermanfaat.

    Tuesday, January 12, 2010

    Membuat TabView dengan Kombinasi SLide Show


    Tab View dengan Slide Show ( biasanya disebut dengan Tab Content ) ini berguna bagi kamu yang ingin menambahkan berbagai content tapi kamu tidak ingin blog kamu menjadi kelihatan penuh karena prinsip dalam membuat blog/website apabila terlalu banyak yang ditampilkan akan membuat pembaca menjadi bosan dan malas selain dari isi blog/website kamu yang berkualitas.

    Mungkin teman teman pernah melihat jenis Slide ini pada beberapa Website contohnya Kompas.com. Trik ini aku dapat dari blog sahabat -blog spot tutorial-, sekarang ikuti langkah langkah berikut :

    Kita langsung ke TKP saja biar jelas
    Langkah Pertama

    • Login ke akun Blogger kamu.
    • Dari halaman dashboard, pilih Edit HTML.
    • Pada halaman Edit HTML, centang "Expand Template Widget", cari kode ]]></b:skin> pada script template blog kamu. Tekan Control F atau F3 untuk mencarinya.
    • Copykan script berikut dan letakkan di atas kode ]]></b:skin> tersebut.

    .indentmenu{
    font: bold 11px Arial;
    width: 100%; /*leave this value as is in most cases*/

    }

    .indentmenu ul{
    margin: 2px;
    padding: 0;
    float: left;
    /* width: 80%; width of menu*/
    background: transparent;
    }

    .indentmenu ul li{
    display: inline;
    }

    .indentmenu ul li a{
    float: left;
    margin: 2px;
    color: #000; /*text color*/
    padding: 5px 11px;
    text-decoration: none;
    border: 1px solid #ccc;
    }

    .indentmenu ul li a:hover{
    background:#ddd;
    }

    .indentmenu ul li a:visited{
    color: white;
    }

    .indentmenu ul li a.selected{
    color: white !important;
    padding-top: 6px; /*shift text down 1px*/
    padding-bottom: 4px;
    border: 1px solid #000000;
    background:#000000;
    }

    .tabcontentstyle{ /*style of tab content container*/
    border: 1px solid gray;
    width: 450px;
    margin-bottom: 1em;
    padding: 10px;
    }

    .tabcontent{
    display:none;
    }

    @media print {
    .tabcontent {
    display:block !important;
    }
    }

    Langkah Kedua
    • Copas kode dibawah ini dan letakkan di atas kode </head> :

    <script type='text/javascript'>
    //<![CDATA[
    //** Tab Content script v2.0- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
    //** Updated Oct 7th, 07 to version 2.0. Contains numerous improvements:
    // -Added Auto Mode: Script auto rotates the tabs based on an interval, until a tab is explicitly selected
    // -Ability to expand/contract arbitrary DIVs on the page as the tabbed content is expanded/ contracted
    // -Ability to dynamically select a tab either based on its position within its peers, or its ID attribute (give the target tab one 1st)
    // -Ability to set where the CSS classname "selected" get assigned- either to the target tab's link ("A"), or its parent container
    //** Updated Feb 18th, 08 to version 2.1: Adds a "tabinstance.cycleit(dir)" method to cycle forward or backward between tabs dynamically
    //** Updated April 8th, 08 to version 2.2: Adds support for expanding a tab using a URL parameter (ie: http://mysite.com/tabcontent.htm?tabinterfaceid=0)

    ////NO NEED TO EDIT BELOW////////////////////////

    function ddtabcontent(tabinterfaceid){
    this.tabinterfaceid=tabinterfaceid //ID of Tab Menu main container
    this.tabs=document.getElementById(tabinterfaceid).getElementsByTagName("a") //Get all tab links within container
    this.enabletabpersistence=true
    this.hottabspositions=[] //Array to store position of tabs that have a "rel" attr defined, relative to all tab links, within container
    this.currentTabIndex=0 //Index of currently selected hot tab (tab with sub content) within hottabspositions[] array
    this.subcontentids=[] //Array to store ids of the sub contents ("rel" attr values)
    this.revcontentids=[] //Array to store ids of arbitrary contents to expand/contact as well ("rev" attr values)
    this.selectedClassTarget="link" //keyword to indicate which target element to assign "selected" CSS class ("linkparent" or "link")
    }

    ddtabcontent.getCookie=function(Name){
    var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
    if (document.cookie.match(re)) //if cookie found
    return document.cookie.match(re)[0].split("=")[1] //return its value
    return ""
    }

    ddtabcontent.setCookie=function(name, value){
    document.cookie = name+"="+value+";path=/" //cookie value is domain wide (path=/)
    }

    ddtabcontent.prototype={

    expandit:function(tabid_or_position){ //PUBLIC function to select a tab either by its ID or position(int) within its peers
    this.cancelautorun() //stop auto cycling of tabs (if running)
    var tabref=""
    try{
    if (typeof tabid_or_position=="string" && document.getElementById(tabid_or_position).getAttribute("rel")) //if specified tab contains "rel" attr
    tabref=document.getElementById(tabid_or_position)
    else if (parseInt(tabid_or_position)!=NaN && this.tabs[tabid_or_position].getAttribute("rel")) //if specified tab contains "rel" attr
    tabref=this.tabs[tabid_or_position]
    }
    catch(err){alert("Invalid Tab ID or position entered!")}
    if (tabref!="") //if a valid tab is found based on function parameter
    this.expandtab(tabref) //expand this tab
    },

    cycleit:function(dir, autorun){ //PUBLIC function to move foward or backwards through each hot tab (tabinstance.cycleit('foward/back') )
    if (dir=="next"){
    var currentTabIndex=(this.currentTabIndex<this.hottabspositions.length-1)? this.currentTabIndex+1 : 0
    }
    else if (dir=="prev"){
    var currentTabIndex=(this.currentTabIndex>0)? this.currentTabIndex-1 : this.hottabspositions.length-1
    }
    if (typeof autorun=="undefined") //if cycleit() is being called by user, versus autorun() function
    this.cancelautorun() //stop auto cycling of tabs (if running)
    this.expandtab(this.tabs[this.hottabspositions[currentTabIndex]])
    },

    setpersist:function(bool){ //PUBLIC function to toggle persistence feature
    this.enabletabpersistence=bool
    },

    setselectedClassTarget:function(objstr){ //PUBLIC function to set which target element to assign "selected" CSS class ("linkparent" or "link")
    this.selectedClassTarget=objstr || "link"
    },

    getselectedClassTarget:function(tabref){ //Returns target element to assign "selected" CSS class to
    return (this.selectedClassTarget==("linkparent".toLowerCase()))? tabref.parentNode : tabref
    },

    urlparamselect:function(tabinterfaceid){
    var result=window.location.search.match(new RegExp(tabinterfaceid+"=(\\d+)", "i")) //check for "?tabinterfaceid=2" in URL
    return (result==null)? null : parseInt(RegExp.$1) //returns null or index, where index (int) is the selected tab's index
    },

    expandtab:function(tabref){
    var subcontentid=tabref.getAttribute("rel") //Get id of subcontent to expand
    //Get "rev" attr as a string of IDs in the format ",john,george,trey,etc," to easily search through
    var associatedrevids=(tabref.getAttribute("rev"))? ","+tabref.getAttribute("rev").replace(/\s+/, "")+"," : ""
    this.expandsubcontent(subcontentid)
    this.expandrevcontent(associatedrevids)
    for (var i=0; i<this.tabs.length; i++){ //Loop through all tabs, and assign only the selected tab the CSS class "selected"
    this.getselectedClassTarget(this.tabs[i]).className=(this.tabs[i].getAttribute("rel")==subcontentid)? "selected" : ""
    }
    if (this.enabletabpersistence) //if persistence enabled, save selected tab position(int) relative to its peers
    ddtabcontent.setCookie(this.tabinterfaceid, tabref.tabposition)
    this.setcurrenttabindex(tabref.tabposition) //remember position of selected tab within hottabspositions[] array
    },

    expandsubcontent:function(subcontentid){
    for (var i=0; i<this.subcontentids.length; i++){
    var subcontent=document.getElementById(this.subcontentids[i]) //cache current subcontent obj (in for loop)
    subcontent.style.display=(subcontent.id==subcontentid)? "block" : "none" //"show" or hide sub content based on matching id attr value
    }
    },

    expandrevcontent:function(associatedrevids){
    var allrevids=this.revcontentids
    for (var i=0; i<allrevids.length; i++){ //Loop through rev attributes for all tabs in this tab interface
    //if any values stored within associatedrevids matches one within allrevids, expand that DIV, otherwise, contract it
    document.getElementById(allrevids[i]).style.display=(associatedrevids.indexOf(","+allrevids[i]+",")!=-1)? "block" : "none"
    }
    },

    setcurrenttabindex:function(tabposition){ //store current position of tab (within hottabspositions[] array)
    for (var i=0; i<this.hottabspositions.length; i++){
    if (tabposition==this.hottabspositions[i]){
    this.currentTabIndex=i
    break
    }
    }
    },

    autorun:function(){ //function to auto cycle through and select tabs based on a set interval
    this.cycleit('next', true)
    },

    cancelautorun:function(){
    if (typeof this.autoruntimer!="undefined")
    clearInterval(this.autoruntimer)
    },

    init:function(automodeperiod){
    var persistedtab=ddtabcontent.getCookie(this.tabinterfaceid) //get position of persisted tab (applicable if persistence is enabled)
    var selectedtab=-1 //Currently selected tab index (-1 meaning none)
    var selectedtabfromurl=this.urlparamselect(this.tabinterfaceid) //returns null or index from: tabcontent.htm?tabinterfaceid=index
    this.automodeperiod=automodeperiod || 0
    for (var i=0; i<this.tabs.length; i++){
    this.tabs[i].tabposition=i //remember position of tab relative to its peers
    if (this.tabs[i].getAttribute("rel")){
    var tabinstance=this
    this.hottabspositions[this.hottabspositions.length]=i //store position of "hot" tab ("rel" attr defined) relative to its peers
    this.subcontentids[this.subcontentids.length]=this.tabs[i].getAttribute("rel") //store id of sub content ("rel" attr value)
    this.tabs[i].onclick=function(){
    tabinstance.expandtab(this)
    tabinstance.cancelautorun() //stop auto cycling of tabs (if running)
    return false
    }
    if (this.tabs[i].getAttribute("rev")){ //if "rev" attr defined, store each value within "rev" as an array element
    this.revcontentids=this.revcontentids.concat(this.tabs[i].getAttribute("rev").split(/\s*,\s*/))
    }
    if (selectedtabfromurl==i || this.enabletabpersistence && selectedtab==-1 && parseInt(persistedtab)==i || !this.enabletabpersistence && selectedtab==-1 && this.getselectedClassTarget(this.tabs[i]).className=="selected"){
    selectedtab=i //Selected tab index, if found
    }
    }
    } //END for loop
    if (selectedtab!=-1) //if a valid default selected tab index is found
    this.expandtab(this.tabs[selectedtab]) //expand selected tab (either from URL parameter, persistent feature, or class="selected" class)
    else //if no valid default selected index found
    this.expandtab(this.tabs[this.hottabspositions[0]]) //Just select first tab that contains a "rel" attr
    if (parseInt(this.automodeperiod)>500 && this.hottabspositions.length>1){
    this.autoruntimer=setInterval(function(){tabinstance.autorun()}, this.automodeperiod)
    }
    } //END int() function

    } //END Prototype assignment

    //]]>
    </script>

    Simpan template kamu dan ikuti langkah selanjutnya.

    Langkah ketiga
    1. Klik Page Element
    2. Klik Add Gadget
    3.   AddGadget
    4. Klik plus button (+) for HTML/JavaScript. (img)

      HTML
    5. Copy and paste kode dibawah ini
    <div style="float:left;margin:0px 10px 0px 0px;padding:0px;height:350px;">

    <div id="pettabs" class="indentmenu">

    <ul>
    <li><a href="#" class="selected" rel="tab1">1</a></li>
    <li><a href="#" rel="tab2">2</a></li>
    <li><a href="#" rel="tab3">3</a></li>

    </ul>
    <br style="clear: left"/>
    </div>

    <div style="width:100%;text-align:justify;padding: 5px; margin-bottom:1em">

    <!--Awal tab 1-->
    <div id="tab1" class="tabcontent">
    <a href="http://bestdesignroom.blogspot.com/search/label/Rumah%20Tradisional">
    <img border="0" style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" alt="Tradisional" width="150" src="http://lh6.ggpht.com/_wC8_9aR_6uE/Sog_btxTWsI/AAAAAAAAA-g/aehk5VGIqkg/s128/11.JPG?imgmax=800" height="150" title="Rumah Tradisional"/></a>

    <p><h3><a href="http://bestdesignroom.blogspot.com/search/label/Rumah%20Tradisional">Rumah Adat / Tradisional Apakah masih layak dipertahankan ?</a></h3></p>
    Indonesia kaya dengan ragam rumah adat, keunikan, keragaman dan di tinjau dari sisi arsitektur maupun konstruksi terbukti mampu bertahan terhadap beragam bencana khususnya gempa dibanding dengan bangunan modern, Rumah Adat bisa kita gunakan sebagai sumber Inspirasi untuk tetap berkreasi tanpa ketinggalan jaman.
    </div>

    <!--Awal tab 2-->
    <div id="tab2" class="tabcontent">
    <a href="http://www.lipi.go.id/">
    <img border="0" style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" alt="LIPI" width="150" src="http://lh6.ggpht.com/_wC8_9aR_6uE/S0WyvB9wA1I/AAAAAAAACC0/Pha0ijzQGc0/s128/LIPI.jpg?imgmax=800" height="150" title="LIPI"/></a>
    <p><h3><a href="http://www.lipi.go.id/">Lembaga Ilmu Pengetahuan Indonesia</a></h3></p>
    Terwujudnya kehidupan bangsa yang adil, cerdas, kreatif, integratif dan dinamis yang didukung oleh ilmu pengetahuan dan teknologi yang humanistik.
    </div>

    <!--Awal tab 3-->
    <div id="tab3" class="tabcontent">
    <a href="http://www.lpjk.org/index.php">
    <img border="0" style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" alt="LPJK" width="150" src="http://lh6.ggpht.com/_wC8_9aR_6uE/S0WyvAo44BI/AAAAAAAACC4/CkdDxaMgaE0/s128/lpjk.jpg?imgmax=800" height="150" title="LPJK"/></a>
    <p><h3><a href="http://www.lpjk.org/index.php">Lembaga Pengembang Jasa Konstruksi</a></h3></p>
    Terwujudnya struktur usaha jasa konstruksi yang kokoh dan andal serta iklim usaha yang kondusif, transparan, efisien, beretika profesi dan beretika bisnis.
    </div>
    </div>

    <script type="text/javascript">

    var mypets=new ddtabcontent("pettabs")
    mypets.setpersist(true)
    mypets.setselectedClassTarget("link")
    mypets.init(2000)
    </script></div>

    <div style="font-size: 90%; text-align: right; text-shadow: 2px 2px 2px rgb(173, 173, 173);"><a href="http://bestdesignroom.blogspot.com/" target="_blank" title="Tabview Widget">HDesign-comm</a></div>

    Keterangan :
    • height:350px, tinggi tab menu, disesuaikan dengan lebar template kamu
    • width:100%,  Lebar tab menu, menyesuaikan dengan lebar template kamu
    • tab1,  Tampilan tab menu, 1 s/d dst.. bisa diganti sesuai denga isi content, misalnya : Top posting, Shoutbox, recent comment, dll ( kamu bisa menambah sesuai dengan kebutuhan yang penting lebar template kamu cukup )
    • Warna kuning merupakan isi tab, berturut turut adalah Alamat URL tujuan, Lebar Image, URL Image, Tinggi Image, Title Tab 1, URL tujuan, Isi content. Bisa kamu ganti dengan punya kamu sendiri.
    <!--Awal tab 1-->
    <div id="tab1" class="tabcontent">

    ISI TAB DENGAN KODE HMLT atau NON HTML

    </div>

    • Untuk mengatur kecepatan slide, perhatikan kode dibawah ini,  kode "mypets.init(2000)", angka 2000 menunjukan kecepatan slide bisa kamu ganti sesuai dengan kebutuhan.
    <script type="text/javascript">

    var mypets=new ddtabcontent("pettabs")
    mypets.setpersist(true)
    mypets.setselectedClassTarget("link")
    mypets.init(2000)

    </script></div>

    Ok.. Selamat mencoba..!

    Semoga bermanfaat....!!

    Wednesday, January 6, 2010

    Bangunan Tua Jejak Sejarah dan Budaya Bangsa


    Kantor Pos Yoyakarta

    Indonesia, dengan letaknya yang strategis dan kekayaan alamnya yang berlimpah, mengundang berbagai transaksi perdagangan dari Eropa, Arab, India dan China. Posisi ini menjadikan Indonesia pusat perdagangan yang ramai dan pelabuhan yang sibuk. Tempat bertemu dan berlebur berbagai kultur dan jamaknya etnisitas menambah kaya sejarah bangsa. Indonesia adalah sebuah bangsa yang mempunyai banyak potensi untuk menjadi yang maju dan besar.

    Bangunan-bangunan yang berkualitas berhasil menjadi koneksi antara visi kreatornya, impian sang pengguna atau orang yang tinggal di dalamnya menyatu dengan alam sekitarnya, dilatarbelakangi konseptual environmental metafisika, teologi dan filosofi merupakan hasil arsitektural awal yang menunjukan kemakmuran dan kesejahteraan manusia. Ditambah dengan nilai historisnya, menjadikan bangunan-bangunan tua kekayaan negara yang tak ternilai. Bangunan-bangunan tua mendapat kehormatan dan perhatian khusus di negara-negara maju lainnya atas konsiderasi fundamental. 


    Sudah menjadi tugas kita sebagai generasi muda untuk dapat melestarikan peninggalan besejarah tersebut. tapi kita lihat sekarang justru banyak sekali yang tidak terurus bahkan dibongkar. Menjadikan  tua dengan perpaduan modern merupakan keharusan terkait dengan perawatan yang membutuhkan cukup banyak biaya.

    Bank Indonesia Solo
    Yang terpenting adalah kita sebagai bangsa yang besar harus mampu melestarikan budaya luhur bangsa yang merupakan peninggalan bersejarah yang tidak tergantikan.

    Program restorasi atau  pemugaran bangunan tua merupakan agenda nasional untuk menjaga orisinalitas dan perawatan peninggalan sejarah bangsa. Peringatan dan perayaan sejarah tidak selamanya terlukiskan indah penuh kemenangan, di dalamnya juga terkandung sejarah yang hitam dan penuh perjuangan menjadikan arsitektur bangunan tua mendapat tempat yang sangat istimewa pada kemajuan bangsa.
     
    Bank Indonesia Yogyakarta 
    Anak bangsa yang terbuai dengan mimpi dengan sendiri telah menjadi musuh terbesar bagi dirinya. Sibuk berjuang untuk menjadi yang terbaik sehingga lupa akan akar-akar yang menjadikannya. Sejarah ada karena tidak semua harus kita jalani sendiri. Dengan adanya kesadaran untuk belajar dari masa lampau, kita baru bisa membangun sejarah baru yang lebih baik, tanpa harus mengulang yang lama

    Kultur yang rapuh dibangun tanpa jati diri dan kesadaran untuk belajar dari masa lalunya. Bangunan tua yang bercerita tentang masa lalu, sekarang dan masa depan tentang sebuah bangsa sedang menunggu untuk diselamatkan dari kerapuhannya.


    Lawangsewu Semarang





    Tuesday, January 5, 2010

    Background dan Animasi Blog

    fun

    Keinginan untuk punya blog yang bagus, terkenal dan profesional tentu jadi impian kita semua, termasuk saya. Tapi untuk meraih itu teryata tidaklah mudah apalagi sampai bisa menghasilkan keuntungan.

    Tapi menjadi seorang blogger/penulis teryata menyenangkan selain kita bisa tambah pengetahuan juga bisa menambah wawasan dan yang lebih dari itu adalah persahabatan antara sesama blogger, walaupun tidak bisa bertemu secara langsung.

    Untuk membuat blog kita jadi lebih menarik salah satunya adalah dengan memberi tambahan animasi dan latar / background yang menarik selain isi Blog itu sendiri.

    Ini adalah beberapa macam background dan animasi yang bisa kamu pasang diblog kamu.

    hello

    Photobucket Photobucket Photobucket


    Photobucket Photobucket

    link1

    Cara merubah background :
    • Login ke akun Blogger kamu.
    • Dari halaman dashboard, pilih Edit HTML.
    • Pada halaman Edit HTML, centang "Expand Template Widget"
    • Cari kode 
    background: #3B0B0B url(http://ALAMAT URL BACKGROUND KAMU.gif) no-repeat scroll 0 0

    atau

    background: #3B0B0B
    Keterangan :
    • #3B0B0B = warna dasar blog kamu sesuai lokasi script ( halaman utama, posting, side colom atau footer ), sesuaikan dengan warna blog dan kreasi kamu, untuk kode warna ambil di sini Kode Warna.
    • Untuk kode script background: #3B0B0B kamu tinggal menambah kode url(http://ALAMAT URL BACKGROUND KAMU.gif) no-repeat scroll 0 0 dibelakangnya.
    • http://ALAMAT URL BACKGROUND KAMU.gif = ganti dengan alamat URL backgroud kamu
    • no-repeat = pengulangan gambar, untuk backgroud kamu ubah menjadi repeat artinya berulang sehingga gambar background menjadi penuh. ( untuk background yang dibuat agar berulang dengan arah mendatar 1 baris ubah menjadi repeat-x arah vertikal repeat-y )
    • scroll 0 0 = posisi gambar dipakai bila tidak berulang no-repeat, artinya posisi di atas
    • Untuk yang ingin menyimpan pada directory sendiri silakan klik kanan - save image ke PC kamu - upload image pada tempat penyimpanan kamu sendiri ( bisa pakai pikasa.com / photobucket.com / website lain ), kemudian ambil alamat URL image tersebut.
    Baiklah itulah beberapa trick untuk background, semoga bermanfaat
    bila kamu ingin mencari background dan animasi yang cocok buat blog kamu silakan klik dibawah ini

    Menambah Widget Kolom

    Kadang kita ingin menambah tampilan blog kita tapi kolom widget yang ada kurang sesuai dengan keinginan kita, ada 2 cara untuk mengatasi hal ini :
    1. Mengganti Template yang lebih sesuai
    2. Menambah Kolom widget
    Berikut trik blogger menambah widget kolom
    Langkah Pertama
    • Login ke akun Blogger kamu.
    • Dari halaman dashboard, pilih Edit HTML.
    • Pada halaman Edit HTML, centang "Expand Template Widget", cari kode ]]></b:skin> pada script template blog kamu. Tekan Control F atau F3 untuk mencarinya.
    • Copykan script berikut dan letakkan di atas kode ]]></b:skin> tersebut..
      Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.
      Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

      /* -- Widgetc -- */

      #Widgetc {
      width:850px;
      clear:both;
      margin:0 auto;
      float:center;
      padding:10px 0;
      color:#333;
      background:#ffffff;
      border-top:#ffffff;
      border-bottom:#ffffff;
      }

      #Widgetc a:link {
      color:#006699;
      text-decoration:none;
      }

      #Widgetc a:hover {
      color:#c06000;
      text-decoration:underline;
      }

      #Widgetc a:visited {
      color:#808080;
      text-decoration:none;
      }

      #Widgetc h2 {
      color:#000000;
      padding:10px 0 2px 0;
      margin:0 0 10px 0;
      border-bottom:1px dotted #333;
      font-size:11px;
      font-weight:bold;
      line-height:1.4em;
      text-transform:uppercase;
      }

      #Widgetc ul {
      padding:0;
      margin:0;
      color:#333;
      }

      #Widgetc ul li {
      list-style-type:none;
      border-bottom:1px dotted #333;
      background: url("http://i864.photobucket.com/albums/ab206/kibagus/animation/Checkmark.gif") no-repeat 0px .17em; padding-left:17px;
      margin-top:2px;
      }

      #Widgetc1 {
      width:260px;
      float:left;
      padding-left:15px;
      }

      #Widgetc2 {
      width:260px;
      float:left;
      padding:0 20px 0 20px;
      }

      #Widgetc3 {
      width:260px;
      float:right;
      padding-right:15px;
      }

      Catatan :
      1. Ganti kode yang berwarna KUNING sesuai dengan lebar template blog kamu.
      2. Untuk variabel width di kode #Widgetc harus sesuai dengan lebar template blog kamu.
      3. Untuk variabel width di kode #Widgetc1, #Widgetc2, dan #Widgetc3 dapat kamu ubah dengan lebar yang kamu inginkan, tapi harus memperhatikan point nomor 2.
      4. Ganti kode yang berwarna MERAH sesuai dengan blog dan kreasi kamu.
      5. Khusus untuk kode background: url("http://i864.photobucket.com/albums/ab206/kibagus/animation/Checkmark.gif") no-repeat 0px .17em; padding-left:17px; merupakan kode untuk menambahkan icon dalam teks kamu jika menggunakan metode penomoran, baik angka maupun icon. Kalau kamu kurang suka silakan hapus kode tersebut atau ganti url dalam tanda kurung dengan icon kamu sendiri.
      6. #Widgetc { width:850px;}= lebar template kamu 850px
      7. Trik perubahan variabel width dalam kode #Widgetc1, #Widgetc2, #Widgetc3 adalah dengan memperhatikan lebar (padding) yang terpakai yakni 15px (#Widgetc1), 20px + 20px (#Widgetc2), 15px (#Widgetc3). Jadi total lebar yang telah digunakan adalah 70px.
      8. Sisa lebar (width) adalah 850px-70px = 780px.
      9. Sekarang tinggal memvariasikan 780px ke dalam 3 kolom. Sebagai contoh untuk membuat 3 kolom sama lebarnya, maka lebar (width) dalam kode #Widgetc1, #Widgetc2, #Widgetc3 masing-masing sebesar 260px.
      Langkah Kedua

      cari Kode <div id='footer-wrapper'> atau yang mirip, Copy Kode berikut diatas kode tersebut.
      ( letak di atas footer, dengan posisi 3 kolom sejajar ) atau
      cari Kode <div id='footer-wrapper'> atau yang mirip, Copy Kode berikut dibawah kode tersebut.
      ( letak di bawah footer, dengan posisi 3 kolom sejajar )


      <div id='Widgetc'>
      <b:section class='Widgetc' id='Widgetc1' preferred='yes'/>
      <b:section class='Widgetc' id='Widgetc2' preferred='yes'/>
      <b:section class='Widgetc' id='Widgetc3' preferred='yes'/>
      </div>

      * Jangan lupa disimpan.

      Sekarang coba kamu klik Lay Out --> Page Element.
      Note  =====>
      • Perlu diperhatikan bahwa penambahan kolom widget ini bisa ditambah dan dikurangi sesuai kebutuhan mulai dari 1, 2 s/d .. dst sesuai dengan lebar template blog kamu.
      • Posisi dan widget kolom yang baru ini juga bisa kamu letakan dimana saja atas/bawah/samping serta bisa juga satu diatas dan dua dibawah, kamu tinggal copy paste kode script kedua sesuai dengan letak widget yang kamu inginkan.
      <div id='Widgetc'>
      <b:section class='Widgetc' id='Widgetc1' preferred='yes'/>
      ...dst ( kamu isi sesuai dengan jumlah kode yang ada di script pertama / jumlah colom yang kamu inginkan dengan catatan lebar template blog memenuhi )
      </div>

      contoh, 1 widget colomn ( width:.....px Widgetc1, script pertama disesuaikan )
      <div id='Widgetc'>
      <b:section class='Widgetc' id='Widgetc1' preferred='yes'/>
      </div>

      contoh, 2 widget colomn ( width:.....px Widgetc2 dan Widgetc3, script pertama disesuaikan )
      <div id='Widgetc'>
      <b:section class='Widgetc' id='Widgetc2' preferred='yes'/>
      <b:section class='Widgetc' id='Widgetc3' preferred='yes'/>
      </div>

      ( bisa kamu letakkan satu diatas dua dibawah atau tiga dibawah semua tinggal kamu atur lebar colomn dan posisi script kedua )

      Sekarang kamu akan melihat ada tampilan widget baru di bawah template blog kamu dan sudah bisa menambah beberapa gadget didalamnya.
      Selamat Mencoba..!

      Sunday, January 3, 2010

      Tukar Link perlu apa tidak ?

      Bertukar link adalah salah satu sarana yang efektif untuk mendatangkan pengunjung ke website anda dan merupakan sarana promosi gratis yang saling menguntungkan.

      Bukan saja pengunjung yang berasal dari rekanan anda saat bertukar link, tetapi ranking search engine anda juga akan meningkat dan memudahkan orang untuk menemukan website anda dan ini otomatis akan menambah pengunjung ke website maupun blog anda. 

      Tukar link adalah salah satu sarana agar blog kita bisa cepat dapat dikenal dan juga sebagai sarana menjalin komunikasi serta persahabatan antara sesama blogger..

      Sebenarnya aturan main dalam bertukar link tidak ada, yang ada adalah etika dan ketentuan yang tidak tertulis.

      Kalau menurut aku  bila kita ingin link Blog/Website kita  dipasang di Blog/Website orang lain sudah menjadi kewajiban kita untuk memasang link orang lain di blog kita agar terjadi proses saling menguntungkan, walaupun sebenarnya yang lebih penting dari itu semua adalah adanya komunikasi dan persahabatan sesama Blogger. Adalah sesuatu yang sia sia bila kita hanya menuntut link kita dipasang tapi kita sendiri tidak perduli dengan link orang lain. 

      Nah..! bila teman-teman ingin bertukar link itu adalah sekelumit pandangan akan makna dari tukar link. bila kamu ingin bertukar link silakan kasih komentar nanti link-nya akan aku pasang. ( bisa berupa teks atau baner dan kamu juga harus pasang punyaku, sebenarnya tidak ada sanksi bila kamu tidak pasang link punyaku tapi apa kamu tega..? ).

      Bila ada yang belum ada tempat/sarana untuk tukar link bisa lihat disini Cara membuat tampilan link exchange , bila kamu suka bisa pakai punyaku tapi kamu juga bisa membuat sendiri dengan kreasi kamu.

      contoh tampilan tukar link
      Tukar Link dan Promosi Website


      _____ A _____


      _____ B _____


      _____ C _____


      _____ D _____


      _____ E _____


      _____ F _____


      _____ G _____


      _____ H _____


      _____ I _____


      _____ J _____


      _____ K _____


      _____ L _____


      _____ M _____


      _____ N _____


      _____ O _____


      _____ P _____


      _____ Q _____


      _____ R _____


      _____ S _____


      _____ T _____


      _____ U _____


      _____ V _____


      _____ W _____


      _____ X _____


      _____ Y _____


      _____ Z _____



      Blogger style - inspirasi dan kreasi

      Semoga bermanfaat, sukses selalu buat kamu semua...!