Pages

Showing posts with label Kotak. Show all posts
Showing posts with label Kotak. Show all posts

Kotak Postingan Terpisah

type='html'>Perhatikan blog ini, terlihat kolom postingan blog saya terpisah antara satu postingan dengan postingan yang lain.

Kolom postingan terpisah seperti ini juga terlihat lebih enak dipandang dan lebih memudahkan pengunjung blog dalam membedakan isi artikel yang kita tulis, daripada kolom postingan yang menyatu atau dalam 1 kotak saja.

Jika sobat ingin blog sobat tampilannya seperti ini, berarti sobat benar telah membaca artikel ini..

Untuk pemasangan kolom yang seperti ini, sobat hanya memerlukan sedikit tambahan kode HTML saja yang nantinya akan disisipkan ke blog sobat.

Berikut langkah - langkahnya :
  1. Silahkan login dahulu ke Blogger dengan ID sobat tentunya.

  2. Klik Tata Letak.

  3. Klik tab Edit HTML.

  4. Setelah itu cari kode yang seperti ini

    .post {


  5. Kemudian tambahkan kode berikut ini tepat setelah kode tersebut


    Padding:15px; /* Jarak text post dengan garis pinggir */

    Border-top: 2px solid #000000; /* warna garis pinggir atas */

    Border-bottom: 2px solid #000000; /* warna garis pinggir bawah */

    Border-left: 2px solid #000000; /* warna garis pinggir kiri */

    Border-right: 2px solid #000000; /* warna garis pinggir kanan */

    Margin-bottom: 30px; /* jarak antara post yang satu dengan yang lainnya */



  6. Save Template.

Sekarang coba sobat lihat hasilnya, jika sobat benar meletakkan kode HTML nya Insya Allah pasti akan berhasil dan sama seperti punya saya. Tapi masih dalam bentuk kotak kaku alias lancip pada ujung - ujungnya. Nanti jika sempat akan saya tulis postingan tentang membuat garis melengkung pada sudut kolom.

Selamat mencoba !!

Kotak Sidebar Terpisah

type='html'>Sebenarnya saya sudah pernah membahas tentang Kotak Postingan Terpisah yang pada dasarnya agak - agak mirip dengan cara membuat sidebar terpisah - pisah ini. Tadi barusan juga ada pertanyaan dari sobat dalam kotak shoutmix dengan pertanyaan yang hampir sama, yaitu bagaimana cara membuat sidebar terpisah. Karena setiap template mempunyai karakter yang berbeda - beda, makanya saya tulis postingan ini untuk template yang umum digunakan atau template dasar.

  1. Buka blogger dengan ID sobat.

  2. Klik Tata Letak --> Edit HTML.

  3. Contreng Expand Template Widget.

  4. Lalu cari kode yang seperti ini :

    .sidebar .widget, .main .widget {
    margin:0 0 1.5em;
    padding:0 0 1.5em;
    }

  5. Pisahkan saja sehingga menjadi seperti ini :

    .sidebar .widget {
    margin:0 0 1.5em;
    padding:0 0 1.5em;
    }


    .main .widget {
    margin:0 0 1.5em;
    padding:0 0 1.5em;
    }

  6. Untuk sidebar terpisah sobat rubah menjadi seperti berikut :

    .sidebar .widget {
    background:#FFFFFF;
    border:1px solid #CCCCCC;
    margin:0 0 1.5em;
    padding:0.5em;
    }

Buat bagian main. widget atau kolom postingan tinggal sobat kreasikan sendiri, untuk background #FFFFFF adalah warna background putih dan border:1px solid #CCCCCC untuk border warna abu - abu. Kode warna bisa sobat lihat disini. Sedangkan untuk padding adalah jarak antara postingan dengan border, bisa juga sobat merubahnya menjadi padding:15px; agar lebih terlihat rapi antara postingan dengan border tidak terlalu rapat. Untuk kotak sidebar agar membentuk garis melengkung pada sudutnya sobat bisa tambahkan kode sehingga menjadi seperti berikut ini :


.sidebar .widget {
background:#FFFFFF;
border:1px solid #CCCCCC;
margin:0 0 1.5em;
padding:15px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
}


Sipp, buat sobat sebelum mengedit template nya sebaiknya cuci tangan dulu ya biar mousenya ga kotor.. Oke deh selamat mencoba !

Kotak Komentar Berada Di Atas Komentar Pengunjung

type='html'>
Ada Sejuta Trik membuat komentar blogspot yang unik.  Kemarin saya juga posting membuat background avatar pengunjung (Klik untuk membacanya). Trik lain yang membuat komentar blog kita unik salah satunya membuat kotak komentar berada di atas komentar pengunjung. Apa maksud Kotak Komentar Berada di Atas Komentar Pengunjung? Berikut ini penjelasannya. Secara default kotak komentar berada di bawah komentar pengunjung. Sebagai urutannya adalah 

Judul Posting > Komentar Pengunjung > Kotak Komentar 

maka kita ganti dengan urutan

Judul Posting > Kotak Komentar > Komentar Pengunjung

Sebagai contoh lihat posting saya yang sudah ada komentarnya di cara menggunakan fitur facebook timeline.

Dari posting saya tersebut terlihat kotak komentar yang lain dari yang lain yaitu kotak komentarnya berada di atas pengunjung. Lantas bagaimana membuatnya? Caranya cukup mudah kok. Ikuti langkah-langkahnya dengan cermat. he2.

1. Loging Blogger

2. Klik Design

3. Klik Edit HTML

4. Centang    Expand Widget Templates nya.

5. Jangan lupa Download full Template agar bisa di kembalikan jika terjadi kesalahan.

6. Siapkan air putih agar tidak pusing melihat kodenya.

7. Jika sudah semua silakan cari kode yang mirip seperti milik saya berikut ini :


   

8. Jika sudah COPY dan CUT semuanya seperti kode di atas mulai dari
Cara ini dimaksudkan untuk memindah form kotak komentar agar berada di atas komentar pengunjung.

9. Buka NOTE PAD dan PASTE semua kode no 7 tadi.

10. Sekarang penempatan kode yang sudah di pindah ke notepad tadi di pindah ke atas. Caranya:
Cari lagi code yang seperti ini:
jika tidak ketemu coba yang ini
atau yang ini
.

11. Pastekan semua kode yang sudah kita pindah di notepad tadi di atas salah satu kode no. 10.

12. Klik untuk menyimpan pekerjaan sobat.

Dengan cara tersebut kita dapat memindah posisi form kotak komentar blogspot akan berada di atas komentar pengunjung seperti Sejuta Trik Blogger blog punya saya ini. Sekian sharing pengalaman saya membuat kotak komentar berada di atas komentar pengunjung. Semoga membantu.

Happy Blogging!
by. Sejuta Trik Blogger

Special Thanks To : Hantu Facebook on Post