Google_plus Pinterest Vimeo RSS
  • Tempat Informasi Seputar Hostel
    Paling Lengkap dan Update
  • Instagram
  • Cara membuat 3 Kolom di bawah Header Blog


    Hai semua... salam blogger. sebelum nya Saya pernah membahas tentang  bagaimana menghilangkan agar LinkWithin' tidak tampil pada Halaman Utama Blog. sekarang bagaimana pula menambah tiga kolom elemen dibawah header. untuk membuatnya ikuti langkah-langkah di bawah ini.
    • Log in dulu ke blogger
    • Tata Letak
    • Edit HTML
    • Beri tanda centang pada kotak kecil kanan atas
    • Kemudian cari kode ]]></b:skin> dan
    • Letakkan kode di bawah ini datas nya

    /* Top Header
    ---------------------------- */
    #topheader {
    width:930px;
    clear:both;
    float:left;
    color:#333;
    background:#fff;

    margin:0 auto;
    padding:0 0 10px;
    }


    #topheader a:visited {
    color:gray;
    text-decoration:none;
    }

    #topheader h2 {
    font-size:11px;
    font-weight:700;
    line-height:1.4em;
    text-transform:uppercase;
    border-bottom:1px dotted silver;
    margin:0 0 10px;
    padding:20px 0 2px;
    }

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

    #topheader ul li {
    list-style-type:none;
    background:fff;
    border-bottom:1px dotted #ccc;
    padding-left:17px;
    margin-top:2px;
    }

    #left-topheader {
    width:360px;
    float:left;
    padding-left:15px;
    }

    #center-topheader {
    width:230px;
    float:left;
    padding:0 20px;
    }

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

    silah anda modifikasi susai dengan lebar kolom tamplate anda.
    • Kemudian kita akan membuat id untuk properti elemen yang baru saja ditambahkan. cari kode ini
    <div id='header-wrapper'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
    </b:section>
    • Kemudian tambahkan kode di bawah ini persis dibawah nya
    <div id='topheader'>
    <b:section class='topheader' id='left-topheader' preferred='yes'/>
    <b:section class='topheader' id='center-topheader' preferred='yes'/>
    <b:section class='topheader' id='right-topheader' preferred='yes'/>
    </div>
    • Simpan tamplate anda dan lihat hasilnya.
    Selamat mencoba.........
    semoga berhasil Boss,,,Saya doakan bisaaa,,,Kunjungi terus Blog ini yaaa

    Rate this posting:
    {[['']]}
    Kamu sedang membaca artikel tentang Cara membuat 3 Kolom di bawah Header Blog dan kamu bisa menemukan artikel Cara membuat 3 Kolom di bawah Header Blog ini dengan url https://www.hosteljogjaid.com/2011/11/cara-membuat-3-kolom-di-bawah-header_17.html, kamu boleh menyebarluaskannya atau mengcopy paste-nya jika artikel Cara membuat 3 Kolom di bawah Header Blog ini sangat bermanfaat bagi teman-temanmu,namun tolong cantumkan link Cara membuat 3 Kolom di bawah Header Blog sebagai sumbernya ya!.