Skip to main content

Cara Membuat Setiap Postingan Dalam Kotak Terpisah

Cara Membuat Setiap Postingan Dalam Kotak Terpisah . Cantik Dan Keren di blog Salah satu bagian utama desain  web adalah membuat desain sejelas mungkin dalam hal pemanf'atan. Sebagai contoh, pembaca harus dapat dengan mudah mengidentifikasi bahwa ini adalah sidebar dan ini adalah kolom utama di mana semua posting ditampilkan.

Umumnya semua postingan Blog berada dalam kotak besar tunggal dengan hanya Border di bagian bawah setiap postingan di homepage. Border yang digunakan untuk membuat pembaca mengetahui bahwa posting berikutnya adalah posting terpisah.

Hal itu sebenarnya sangat normal dan mendasar untuk memisahkan tulisan. Postingan Hari ini kita akan membuat tulisan lebih jelas bagi pembaca dengan menampilkan masing-masing dalam style kotak terpisah.Hal yang paling utama adalah Anda akan belajar bagaimana melakukannya sehingga dapat lebih menyesuaikan. 

Sebagian besar dari sobat blogger/para master mungkin tahu bagaimana melakukan hal ini, tetapi mungkin ada beberapa pemula menunggu untuk mempelajari beberapa trik dasar.

Caranya:
  1. Masuk ke akun blogger anda -> Klik Drop down menu
  2. Kemudian klik Template -> Backup template terlebih dahulu -> Edit HTML
  3. Cari tag / kode .post { atau .post{ Gunakan CTRL+F untuk memudahkan pencarian
  4. Ganti kode tersebut dengan kode berikut dibawah ini:
    margin: 10px 10px 40px 7px;
    padding: 15px;
    border: 1px solid #CCCCCC;
    -webkit-border-radius: 0 20px 0 20px;
    border-radius: 0 20px 0 20px;
    background: #FEFFE6;
    -webkit-box-shadow: 1px 1px 5px 5px rgba(204, 204, 204, 0.5);
    box-shadow: 1px 1px 5px 5px rgba(204, 204, 204, 0.5);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
Simpan template dan silahkan di cek blog anda

Ada beberapa tag/kode dasar yang bisa anda rubah pada kode yang sudah ada. Bahkan anda dapat menambahkannya sendiri style (gaya) terpisah sesuai dengan kreasi anda masing-masing.
  • Aturlah nilai margin 10px 10px 40px 7px jika postingan yang anda buat tidak selaras
  • Kode #CCCCCC untuk mengubah warna border
  •  Kode #FEFFE6 untuk mengubah background kotak postingan
Semoga bermanfaat, Cara Membuat Setiap Postingan Dalam Kotak Terpisah , bagi yang membutuhkan,