Untuk mendapatkan space iklan dihalaman ini silahkan hubungi owner Blog Design, Kami akan secepatnya merespon dan mempertimbangkan letak dari iklan text dan banner anda...

Wednesday, September 25, 2013

cara membuat 1 kolom layout di atas footer blog

Kebutuhan kolom layout sangat diperlukan seorang bloger, cara membuat 1 kolom layout di atas footer blog akan anda butuhkan bilamana dalam halaman blog anda memiliki widget yang lumayan banyak demi untuk meningkatkan trafik halaman blog anda. Setelah saya posting artikel di beberapa hari yang lalu, seorang teman mengirimkan email kepada saya, dia sangat membutuhkan kode atau cara memasang 1 kolom layout diatas footer halaman blognya, katanya sih buat tempat iklan agar lebih memanjang kesamping dan gampang dilihat pengunjung . Setelah saya mengirimkan kodenya lewat email kini saatnya saya akan membagi tutorial cara membuat 1 kolom layout diatas footer halaman blog. Oke langsung saja menuju TKP , lihat screenshotnya pada gambar dibawah ini sekalian simak cara memasangnya.


1 kolom layout

Referensi Artikel


  • 4 kolom layout di atas postingan blog
  • Cara membuat 2 kolom layout dibawah postingan blog
  • 5 kolom layout di footer halaman blog
  • Membuat 4 kolom layout di footer halaman blog
  • cara membuat 2 kolom layout di sidebar blog


Install Program CSS


  1. Login ke dashboard anda
  2. Masuk ke "TEMPLATE" lalu klik " Edit HTML "
  3. Cari code ]]></b:skin> 
  4. Copy Code script CSS dibawah ini, pastekan diatas code ]]></b:skin> tadi atau bila template blog anda memakai </style> silahkan pastekan kode CSSnya tepat diatas </style> template anda.

  5. /*****************************************
    Name : 1 Kolom layout diatas footer blog
    By : Rivai Silaban | Blog Design
    Update : Rabu, 25 September 2013
    ******************************************/
    #BDRSLAYOUT-footerkolom {
    width: 960;/* Lebar */
    margin:0;
    padding: 0;
    text-align: center;
    }
    #BDRSLAYOUT-footerkolom .BDKOLOMFOOTER {
    width:auto; /* Lebar Kolom */
    height:auto;
    text-align: center;
    padding:5px;
    line-height: normal;
    }/* End CSS 1 kolom layout */



  6. Setelah anda selesai memasang code CSSnya saatnya anda dipaksa untuk memasang kode tag htmlnya pada halaman blog anda agar muncul pada saat dibrowsing.

  7. pesan

    Pada umumnya kode <div id='footer-wrapper'> biasanya ada pada template HTML/XML blog tapi ada beberapa blog mungkin tidak memiliki kode persis seperti kode <div id='footer-wrapper'>.

    Bila pada template blog anda tidak memiliki <div id='footer-wrapper'>, anda cari sejenis kode <div id='footer-wrapper'>. yang penting anda pastekan kode yang ada didalam spoiler dibawah diatas kode yang bersangkutan dengan footer halaman blog anda


  8. Cari code <div id='footer-wrapper'> setelah ketemu copy kode dibawah ini dan pastekan tepat diatas kode <div id='footer-wrapper'> atau sejenisnya.

  9. <!-- BDRS layout 1 kolom tart -->
    <div id='BDRSLAYOUT-footerkolom'>
    <div id='box1' style='width:940;float:left;margin:10px; '>
    <b:section class='BDKOLOMFOOTER' id='FOOTER-column-1' preferred='yes'>
    <b:widget id='HTML99' locked='false' title='1 KOLOM DIATAS FOOTER' type='HTML'>
    <b:includable id='main'>
    <!-- BDRS 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:includable>
    </b:widget>
    </b:section>
    </div><div style='clear:both;'/>
    </div>
    <!-- BDRS layout 1 kolom end -->


  10. Save template anda, dan lihat hasilnya

Kesimpulan

Cara membuat 1 kolom layout di atas footer halaman blog sangat berguna untuk berbagai keperluan sebagai wadah widget blog. Banyak para teman teman bloger yang mengandalkan layout ini seperti tempat memasang iklan , memasang link dan lain sebagainya.

Bila anda mengalami kesulitan dalam memasang kodenya di halaman blog anda atau ada kode yang error silahkan hubungi saya atau share bersama saya melalui form Comment dibawah.

1 Kolom layout di atas footer halaman blog
Rabu, 25 September 2013
Rivai Silaban | Blog Design

Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Me

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter
Di posting oleh : Rivai Silaban Update pada : 8:09 AM

6 comments :

  1. Replies
    1. saya kurang begitu paham maksud anda, apa artikel ini anda anggap spam atau anda ingin melakukan spam..

      Delete
  2. om mau tanya ni, saya mau buat 2 kolom di atas postingan. tp kodenya gk main - wpr nya gk nemu. solusinya gmna ya

    ReplyDelete
    Replies
    1. lebih baik kita sharing di link dibawah ini..

      http://rivai-silaban.blogspot.com/2013/08/cara-membuat-2-kolom-layout-di-bawah.html

      soalnya kita sharing di postingan ini kurang relevan. lagian ntar para pembaca marah ma kita sob..

      Delete
  3. Berhasil tutorialnya, keren banget mas, trima kasih yaa

    ReplyDelete
    Replies
    1. sama sama mas, selamat ya telah berhasil..

      Delete

1. Komentar SPAM Akan secepatnya dihapus
2. Pastikan untuk " Berlangganan Lewat Email " untuk membangun kreatifitas blog ini
3. Cek komentar masuk sebelum bertanya.
4. Link aktiv tidak akan berpungsi.
5. Dilarang menyebarluaskan artikel tanpa persetujuan dari saya.
6. Untuk mengajukan pertanyaan diluar postingan diatas, silahkan klik " Forum Diskusi "
7. Bergabung dengan kami untuk menjadi member Klik " Join to Member "
8. Komentar yang mengandung code tag HTML, konversikan terlebih dulu silahkan klik " Konversi Kode "

Salam bloger .. !!
Pergunakan semua fasilitas di Blog ini untuk mempermudah anda..
Konversi Kode Forum Diskusi Join to Blog