23 Jan 2017

Percantik Template Blogger Lewat 7 Cara Ini

cara-percantik-template-blogger
Percantik Template Blogger Lewat 7 Cara Ini – Di dunia maya, blog ibarat sebuah rumah bagi para blogger. Karena itu, berkunjung ataupun dikunjungi oleh blogger lainnya tentu bukan lagi hal baru. Nah, agar rumah para blogger ini makin nyaman untuk dikunjungi tentu pemiliknya harus membuat para tamu merasa betah dulu bukan? Oleh karena itulah mempercantik blog dianggap sebagai salah satu solusi agar para tamu betah saat berkunjung. Namun, untuk mempercantik rumah tersebut tentu ada banyak jalan yang mesti mereka tempuh. Demi mendapatkan hasil yang memuaskan tak jarang seorang blogger berkutat dengan berbagai kode css, html, serta javascript. Di samping itu, membeli template pun jadi pilihan jika memang diperlukan.

Pada dasarnya, mempercantik blog memang memerlukan waktu dan usaha yang lebih ekstra. Awalnya saya pun merasakan hal yang serupa. Selalu saja ada inovasi dari waktu ke waktu. Namun satu hal yang pasti, selalu ada hal-hal kecil yang dapat kita pelajari setiap hari. Oleh karena itu kali ini saya akan menjelaskan cara sederhana mempercantik blogmu lewat 7 langkah saja.

Sulit?

Tentu tidak, namun yang pasti kamu sebaiknya sudah mengenal letak menu template serta tata letak di dashboard blogmu dulu ya. Hal itu dikarenakan 7 cara yang saya sampaikan ini akan berkaitan dengan penambahan kode css, penghapusan kode html, dan pengeditan di menu tata letak.

Jadi, jika kamu sudah tahu letak menu-menu itu yuk langsung kita mulai saja.

1. Sembunyikan default navbar dari Blogger

Navbar adalah elemen dari template blogger yang letaknya selalu ada dibagian teratas template. Dalam navbar bawaan ini ada tulisan Lainnya (Share), Blog berikut (Next blogs) dan sebagainya. Sebab kini default navbar ini telah banyak digantikan oleh navbar custom, maka tak jarang blogger pun menghilangkannya dari template mereka.

Untuk menyembunyikan default navbar ini kamu bisa masuk ke dashboard templatemu, klik menu Tata Letak, cari elemen bernama Navbar, klik Edit, pilih Off, lalu Simpan.

2. Pilah pilihan di bawah post footer

Di bawah post, ada banyak pilihan yang dapat kita tampilkan, di antaranya seperti label, reaksi, komentar, sharing, tombol berbagi, penulis, tanggal publish pos, dan banyak lagi. Tapi apa semua item tersebut diperlukan? Tentu tidak. Ada kalanya informasi penulis dan tanggal publish pos dianggap tidak terlalu penting oleh seorang blogger. Coba bayangkan jika 12 item tadi memadati bagian footer postmu, apa tidak jadi ramai tuh? Nah, untuk itulah tampilkan item yang kamu butuhkan saja ya.

Untuk memilih item yang ingin kamu tampilkan kamu bisa masuk ke dashboard templatemu, klik menu Tata Letak, cari elemen bernama Posting Blog, klik Edit, centang item yang kamu butuhkan, lalu Simpan.

3. Sembunyikan tulisan "Tampilkan posting dengan label ..." (Showing posts with label ...)

Saat kita menekan label disuatu post, maka di halaman baru akan tampil post lainnya yang berlabel sama dengan yang kita klik tadi. Biasanya nih akan muncul tulisan "Tampilkan posting dengan label ..." (Showing posts with label ...) di halaman tersebut juga. Tulisan tersebut tak jarang dianggap kurang menarik dan agak mengganggu.

Maka, untuk menyembunyikan tulisan tersebut kamu bisa masuk ke dashboard templatemu, klik menu Template, klik tombol Sesuaikan (Customized), pilih menu Tingkat lanjut (Advanced), scroll ke bawah hingga kamu menemukan pilihan Tambahkan CSS (Add CSS), lalu tempelkan kode di bawah ini pada kolom yang tersedia.

.status-msg-wrap {
display: none !important;
}

Setelah itu klik tombol Terapkan ke Blog (Apply to Blog).

4. Hilangkan border putih di sekeliling gambar

Pada gambar yang terdapat di blogmu, jika belum pernah diganti templatenya atau diutak-atik kodenya maka akan selalu ada border putih yang terdapat di sekelilingnya. Bukan hanya gambar berformat .jpeg saja, untuk gambar berformat .png  pun border ini dianggap mengganggu bagi sebagian orang. Apalagi jika gambar .png yang diunggah tidak berbentuk persegi, karena border inilah mau bagaimana pun bentuk file .png yang diunggah gambarnya akan tetap berbentuk persegi.

Jadi, untuk menghilangkan border tersebut kamu bisa masuk ke dashboard templatemu, klik menu Template, klik tombol Sesuaikan (Customized), pilih menu Tingkat lanjut (Advanced), scroll ke bawah hingga kamu menemukan pilihan Tambahkan CSS (Add CSS), kemudian tempelkan kode di bawah ini pada kolom yang tersedia.

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
 padding: 0 !important;
 border: none !important;
 background: none !important;
 -moz-box-shadow: 0px 0px 0px transparent !important;
 -webkit-box-shadow: 0px 0px 0px transparent !important;
 box-shadow: 0px 0px 0px transparent !important;
}

Setelah itu tekan tombol Terapkan ke Blog (Apply to Blog).

5. Hilangkan dotted line dan dashed line

Dotted line di template blogger adalah sebuah garis memajang yang terbentuk dari titik-titik berukuran besar. Sementara dashed line sendiri terdiri dari garis putus-putus. Kedua garis ini akan kamu temukan di bawah bagian post footer (di atas footer blog). Di antara kedua garis ini biasanya ada tulisan Langganan: Entri (Atom). Agar bagian tersebut terlihat lebih bersih dan tidak ramai kamu tentu bisa menghilangkan kedua garis ini lho.

Untuk menghilangkannya masuklah ke dashboard templatemu, klik menu Template, klik tombol Sesuaikan (Customized), pilih menu Tingkat lanjut (Advanced), scroll ke bawah hingga kamu menemukan pilihan Tambahkan CSS (Add CSS), lalu tempelkan kode di bawah ini pada kolom yang tersedia.

.footer-outer {
border: none;
}

.blog-pager {
background: none;
}

Jangan lupa lalu klik juga tombol Terapkan ke Blog (Apply to Blog).

6. Hilangkan tulisan Langganan: Entri (Atom) atau Subscribe to: Posts (Atom)

Bagaimana? Sudah ketemu tulisan yang satu ini? Letaknya di antara kedua garis tadi lho, tepat di atas footer. 

Untuk menghilangkan tulisan tersebut kamu harus masuk ke dashboard templatemu, klik menu Template, klik tombol Edit HTML, sesudah kotak HTML-nya terbuka klik di sembarang tempat dalam kotak tersebut, tekan tombol ctrl+F di keyboard-mu, lalu tempelkan kode di bawah ini dalam kotak pencarian yang muncul tersebut. 

<b:include data=’feedLinks’ name=’feedLinksBody’/>

Oh ya, jika kodenya tidak ditemukan kamu masukkan saja kata kuncinya di kotak pencarian ya, misalnya "feedLinks" saja. Jadi jika ditemukan beberapa kode bisa kamu cocokkan mana yang sama persis dengan yang di atas.

Sesudah ditemukan, hapus kode tersebut, lalu tekan tombol Simpan template (Save template).

7. Hilangkan tulisan Langganan: Poskan Komentar (Atom)

Ketemu tidak tulisan ini di beranda blogmu? Tidak? Waduh, tentu saja tidak ketemu. 😁 Soalnya tulisan ini hanya akan kamu temukan jika kamu menekan salah satu post di blogmu. Tulisan ini akan ada di atas footer, tepat di bawah jajaran link Beranda (Home), Posting Lama (Older Post) serta Posting Lebih Baru (Newer Post).

Jadi, bagaimana? Sekarang sudah ketemu kan?

Untuk menghilangkan tulisan tersebut masuklah ke dashboard templatemu, klik menu Template, klik tombol Edit HTML, sesudah kotak HTML-nya terbuka klik di sembarang tempat dalam kotak tersebut, tekan tombol ctrl+F di keyboard-mu, lalu tempelkan kode di bawah ini dalam kotak pencarian yang muncul tersebut.

<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>

Sama seperti cara nomor 6, jika kodenya tidak ditemukan kamu masukkan saja kata kunci seperti "feedLinksMsg". Jadi jika ditemukan beberapa kode yang mirip kamu bisa mencocokkan mana yang sama persis dengan yang di atas.

Sesudah ditemukan, hapus kode tersebut, lalu tekan tombol Simpan template (Save template).

---

Baiklah, itu dia 7 cara sederhana mempercantik template bloggermu ala blog Rumah Es. Merasa pusing dan tidak ingin repot mengutak-atik template? Kalau begitu coba deh template Eunoia dan Dusty Pink dari Rumah Es yang sudah pasti cantik dan menarik, tanpa mesti diutak-atik.

Oh ya, kalau menurutmu apa lagi ya yang mesti kita lakukan agar blog kita tambah cantik? Kira-kira ada yang tahu tidak? 😃

33 komentar:

  1. Bookmark dulu, infonya bermanfaat. Tampilan blog saya ramai banget jadinya postingan seperti ini yang dibutuhkan

    BalasHapus
    Balasan
    1. Hehe, yuk mbak dicobain. Semoga bermanfaat ya :D

      Hapus
  2. Wah, terima kasih inffonya mbak! Saatnya coba2 di blpog ne :D

    BalasHapus
    Balasan
    1. Yup mbak, sama-sama. Hayo buruan dicoba di blognyaa. :D

      Hapus
  3. wow sangat bermanfaat mbak...tfs ya

    BalasHapus
    Balasan
    1. Sama-sama mbak :D Yuk dipraktekin~

      Hapus
  4. catet catet...prakteknya kudu pelan-pelan ini...tengkiu mbak..

    BalasHapus
    Balasan
    1. Awas catetannya ilang mbak XD Hehehe. Sama-sama mbak Retno.

      Hapus
  5. Aku pakai template yang terbaru, Mbak. Adanya Powered by Blogger. Itu bisa dihilangkan juga?

    BalasHapus
    Balasan
    1. Bisa mbak, css codenya: #Attribution1 {
      display:none
      }

      Hapus
  6. Terima kasih teteh infonya, bermanfaat sekali buat saya yang baru belajar menulis dan ngeblog 😃

    BalasHapus
    Balasan
    1. Sama-sama Bunda Erysha :D Seneng bisa bermanfaat buat semuanya ^.^

      Hapus
  7. TFS, mba. Belajar pelan-pelan.

    BalasHapus
    Balasan
    1. Urwel mba :D Yuk belajar bareng-bareng. ^.^

      Hapus
  8. Blognya memang cantik banget :D

    BalasHapus
  9. Blognya memang cantik banget :D

    BalasHapus
  10. Langsung deh saya praktikkan. Thanks ya mba...

    BalasHapus
    Balasan
    1. Waaah langsung praktek ya :D Sama-sama mba ^.^

      Hapus
  11. Catat dulu ah soal edit tamplate minim ilmunya

    BalasHapus
    Balasan
    1. Yap, dicatet dulu biar ngga lupa waktu mau dicoba ya mba ^.^

      Hapus
  12. Betahnya main-main di blog mbak, cantik dan rapi. Makasi juga buat tips kerennya. :)

    BalasHapus
    Balasan
    1. Seneng deh mbaknya betah *buru-buru bebersih blog* Hehehe. :D Sama-sama mba Riska ^.^

      Hapus
  13. Mba ku mau tanya dong bikin "read more" gimana ya makasih 🙏

    BalasHapus
    Balasan
    1. Untuk read more seperti di template" yang udah dicustomize ada kode css yang mesti ditambahin mba, nanti bakal dibahas di rumah es ya. :)

      Hapus
  14. Sudah diterapkan semua Mba, makasih banget ya.. wajib follow blog Rumah Es nih..semoga jdi amal kebaikan buat Mba

    BalasHapus
    Balasan
    1. Mantep mba langsung praktek nih :D Hehehe, aamiin. Sama-sama mba, semoga blognya tambah cantik ya ^.^

      Hapus

COPYRIGHT © 2017 RUMAH ES · PEKANBARU · INDONESIA