EDITBLOGTEMA

Pada kesempatan kali ini saya ingin berbagi trik dasar merombak tampilan sekaligus meningkatkan performa empat varian template blogger terbaru. Empat varian terbaru template blogger (2017-sampai sekarang)  adalah: Contempo Soho Emporio Notable Tambahan: Essential (yang ini contempo banget) Sedangkan 7 varian template blogger lama  (2008-2017) adalah: Simple  Dinamic Picture window Awesome inc.  Watermark Ethereal Travel Perbedaan: Template versi baru responsif dan mobile friendly - template lama tidak, kecuali jika di desain ulang.  Template terbaru sudah mengusung gaya desain aliran tertentu misal: contempo beraliran indie, soho beraliran fancy,  emporio menganut aliran vegea,  dan notable mengikuti aliran desain bergaya rockpool.  4 varian Template terbaru sudah dilengkapi dengan ikon svg bawaan yang walau terbatas namun cepat tidak menghambat kecepatan loading halaman web. Misalnya menuIcon, shareIcon, closeIcon dll. Sedangkan template lama tidak.  Trik mudah merobah tampilan templa

Kalau sobat perhatikan gambar peraga dibawah ini sobat mungkin pangling apa benar ini template contempo? Tampilan pada laptop, tablet dan pada layar ponsel tampak serasi. Namun pada layar desktop yang lebih besar akan sedikit beda karena sidebarnya masih terlihat. Saya sengaja membiarkan hal tersebut untuk memberi memaksimalkan template pada layar yang lebih besar. Apa yang berbeda? Latar warna dibuang habis Heading di rombak habis Menu navigasi plus kotak pencarian bawaan dibuang mulai pada layar laptop hingga ponsel dan diganti dengan menu navigasi dan kotak pencarian buatan saya sendiri. Sedikit modifikasi struktur HTML/CSS Jika sobat bosan dengan tampilan Contempo bawaan (default) dan ingin merombak habis Navigasi serta menghilangkan sidebar Contempo atau menyederhanakan templatenya sobat bisa mencari kode dibawah ini (letaknya biasanya dibaris 2832 pada halaman HTML): <b:if cond='data:view.isSingleItem'>                   <a class='return_link' ex

1. CARA MEMPERBESAR ATAU MEMPERKECIL JUDUL POPULAR POSTS Pada pengaturan blogger > edit HTML cari kode: .PopularPosts .post-title,.PopularPosts .post-title a,.PopularPosts .post-title a:visited,.PopularPosts .post-title a:hover { color: $(popularposts.title.color); font-size: 16px; font-weight: normal; line-height: 16px; .PopularPosts,.PopularPosts h3.title a { color: $(posts.text.color); font: $(posts.text.font);} .main .PopularPosts { padding: 16px 10px;} .PopularPosts h3.title { font-size: 19px ;  margin: 0;} Keterangan: Mengganti nilai yang disorot warna merah muda akan merobah ukuran Judul popular post Mengganti nilai yang disorot warna biru akan merobah kerenggangan huruf atau kalimat snippet popular post Mengganti nilai yang disorot kuning akan merobah ukuran huruf popular post Mengganti nilai yang disorot warna hijau akan merobah ukuran POPULAR POST itu sendiri. 2. CARA MEMODIFIKASI FUNGSI PAGE LIST PADA CONTEMPO Pagelist pada con

Anggaplah pada lay out, komponen blog dibawah ini letaknya selalu berdekatan dengan header: Letak Konten Jarak judul ke Navigasi menu Navigasi Menu Menu atau tombol pencarian Dan jika sobat pernah mengutak atik HTMLnya Contempo materialnya adalah CSS dan mengedit css bisa bikin pusing kepala sampai tujuh keliling dan mata berkunang kunang penuh bintang sepenuh alam semesta ha ha ha...becanda saja sobat. 1. LETAK KONTEN YANG MENINGGI SEPERTI MAU MENTOK KE JUDUL Pernah gak sobat perhatikan kalau konten pas dibaca pada contempo asli kontennya naik ke atas kayak melewati garis batas perhatikan gambar ya. Untuk membuat konten agar tidak terlihat "mengapung naik" seperti gambar diatas sobat cukup masuk ke dasbor atau pengaturan blog: Sumber gambar ilustrasi: Blogger Pilih Tema atau Theme Pilih editHTML Dan tinggal mencari kode CSS di bawah ini: <Group description="Backgrounds"> <Variable name="body.background.height" d