MERUBAH GAYA JUDUL POSTINGAN TEMPLATE CONTEMPO VIA CSS

Prinsip pembuatan sebuah template fast loading adalah: kesederhanaan. Apabila sobat telah mengikuti tutorial demi tutorial yang telah saya posting didalam blog ini sobat akan "hampir" menguasai trik pembuatan template model bawaan blogspot terbaru terutama contempo. Namun sederhana bukan berarti tidak stylish apalagi jelek. Prinsip sederhana itu justeru indah dan tidak akan membosankan.

Secara default (bawaannya) Contempo memiliki style judul yang terlalu menumpu ke kiri atau dalam istilah penulisan "Left Aligned" saya kurang sreg ketika membuka tampilan seperti itu melalui tampilan layar hape atau mobile. Perhatikan gambar dibawah ini:
sebelum dan sesudah di edit atas sebelum bawah sesudah
Pada gambar diatas saya telah membuat judul itu berubah menjadi lebih "Justify" bagaimana triknya?

HANYA CSS
Dibanding template template bawaan blogspot yang lebih tua atau yang lebih klasik, Contempo memiliki lebih banyak aba aba CSS yang dapat kita manfaatkan untuk merubah tampilan halaman web kita tidak ada diperlukan penambahan apa apa, cukup merubah aba aba atau perintah pengaturan melalui CSS-nya.

Banyaknya jumlah aba aba CSS juga menjadi pertanda kedatangan project AMP pada waktu itu (Tahun 2017).

Masuk kepengaturan atau dasbor blogger:
  1. Pilih tema atau theme
  2. Pilih Edit HTML
  3. Cari dan edit kode berikut dibawah ini (gunakan ctrl+f untuk menampilkan kotak pencarian pada bagian atas halaman editor HTML):
.post-title {

Atau lebih lengkapnya (perhatikan kode yang saya sorot kuning):


.post-title {
  font: $(posts.title.font);
  float: $(startSide);
  margin: 0 0 8px 0;
  max-width: calc(100% - 48px);
}

Robah saja bagian yang saya sorot kuning sehingga kode akan terlihat sebagai berikut:

.post-title {
  font: $(posts.title.font);
  float: $(startSide);
  margin: 0 0 8px 0;
  max-width: 100%;
}

Save template. Sangat mudah, bukan?


www.editblogtema.net

Posting Komentar

Silahkan berkomentar sesuai dengan topik kita ya...

Lebih baru Lebih lama

Formulir Kontak