shodiqah.com

5 Tambahan Agar Template Blog SEO Friendly dan Rapi


Sudah tiga hari semenjak tugas untuk mempercantik blog diluncurkan, selama itu jugalah pikiranku tidak tenang. Semua tugas dipenuhi kode akses rahasia yang sangat susah untuk ditaklukkan, salah sedikit saja semuanya akan berantakan. 

Deretan huruf dan angka yang membuat mata sakit dan pikiran mumet. Walaupun gambaran keadaan tugas seperti itu, aku sangat puas dengan hasil dan kerja keras yang sudah dikerahkan oleh semua kemampuanku. Yok Semangat!
الحمد الله الذي بنعمته تتم الصالحات

Blog Adalah Rumah

Blog bagaikan rumah bagi pemiliknya, untuk itu harus di desain, ditata dan dirapikan sedemikian mungkin, agar bisa betah berlama-lama disana.

Ada tulisan dari Mbak Listenida yang mewakili isi hatiku juga.
 
“Setiap kali saya kembali kesini, ada kerinduan serupa bertemu kawan lama. Banyak yang ingin diceritakan, banyak yang ingin disampaikan. Dengan berbagai macam media sosial yang memiliki kelebihan masing-masing, blog saya pikir tetap menjadi tempat yang spesial bagi saya. Kemanapun saya pergi untuk menghabiskan waktu di dunia maya, ujung-ujungnya saya selalu kembali untuk ngoceh-ngoceh di tempat ini juga.
Blog adalah tempat nyaman sebagaimana rumah yang ramah dengan selimut hangat tempat meringkuk saat udara dingin dan hujan lebat, blog adalah sebuah tempat yang tidak mudah digantikan.”

Mempercantik Blog

Bagi aku yang pemula, pengetahuan dasar tentang cara-cara mempercantik blog sederhana, yang diajarkan Coach Marita di kelas Coaching Blogspedia, sangat membantuku dalam mengaplikasikannya ke blogku sendiri. Yang awalnya blogku cuma monoton satu warna sekarang sudah lebih berwarna dan segar dilihat mata.

sebelum di desain baru, tampilan blogku cuma ada gambar postingan, sedangkan sekarang sudah diisi dengan header image yang besar, menu drop down, banner komunitas, sosial widget dan tombol back to top. 5 cara ini akan membuat tampilan blog lebih rapi dan cantik tentunya.

Dengan adanya tugas ini, aku sekarang sudah tahu dengan istilah-istilah diatas. Istilah yang tidak pernahku dengar dan sekarang sudah dipraktekkan, peningkatan yang sangat Masya Allah.

Yok Mulai Renovasi

template blog seo friendly

1. Header Image

Setiap membuka blog orang lain, aku selalu bertanya-tanya gimana bisa menambahkan header yang besar, sedangkan punyaku sangat kecil yang berada disudut kiri, dan sekarang jreng jreng jreng sudah seperti punya orang.

header blog seo friendly

Ternyata langkahnya tidak begitu sulit, kita cuma butuh gambar yang berukuran 1000 x 250, setelah itu simpan gambar di postingan blog, tapi tidak usah di publikasikan cukup disimpan saja. Setelah itu klik kanan foto hingga muncul tulisan Copy Image Address dan salin.

  • Masuk kebagian Tata Letak, pilih bagian Billboard.
  • Tambahkan Gadget, pilih HTML.
  • Lalu copy HTML dibawah ini.
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitFC9NcwQuKlwUji1Kyp6wkGf9MrfZnExeEqC-544r7dL6PLRKZxiicsULT25TaVZOurXfjpYXOw5VzRx1FR6nwE_vVF-9JLXYz-suO1nys9xA5Kd5qOffj0SbzXBNPO3pe-KZWXGnaIKGgXnNmNMPJZDbuBxjZWnZMSOdgS6sD6IvywgVPN1Z3fEQo7Z3/s16000/banner-shodiqah.jpg" width="1000" height="250" title="shodiqah.com" alt="shodiqah.com"/>

Keterangan:
Warna Hijau : Silakan diganti dengan link Image Addres yang di posting di blog sebelumnya

Warna Coklat : Silahkan diganti dengan link blog.

2. Menambah Kolom Menu dan Drop Down Menu

drop down blog seo friendly

Dikutip dari blog Mbak Oktavia Winarti, kolom Menu ini memudahkan para pembaca untuk menuju artikel yang hendak mereka lihat. Kita bisa menambahkan link page pada menu dan membuat dropdown menu sehingga tampilannya lebih ringkas.

  • Masuk kebagian tata letak, pilih bagian menu.
  • Lalu copy HTML dibawah ini.
<ul><li><a href='https://www.shodiqah.com/?m=1'' title='Home'>HOME</a></li>

<li><a href='https://www.shodiqah.com/p/blog-page.html'' title='Daftar Isi'>Daftar Isi</a></li>

<li class='dropdown'>

<a href='#' onclick='return false;' title='Stories & Experiences'>Stories & Experiences</a><ul>

<li><a li><a href='https://www.shodiqah.com/p/taarufan-yuk.html'' title='Kenalan Yuk'>Kenalan Yuk</a></a></li>

<li><a href='https://www.shodiqah.com/search/label/Dunianya%20Wanita'' title='Seputar Kewanitaan'>Seputar Kewanitaan</a></li>

<li><a href='https://www.shodiqah.com/search/label/Tokoh%20Inspiratif'' title='Tokoh Inspiratif'>Tokoh Inspiratif</a></li>

<li><a href='https://www.shodiqah.com/search/label/Kehidupan%20Di%20Mesir'' title='Kehidupan Di Mesir'>Kehidupan Di Mesir</a></li>

<li><a href='https://www.shodiqah.com/search/label/Tetesan%20Ilmu'' title='Tetesan Ilmu'>Tetesan Ilmu</a></li></ul></li></ul>
 
Keterangan :

Warna Hijau : Bisa diisi dengan link postingan atau label

Warna Coklat : Tulisan yang akan ditampilkan di Menu

3. Menambahkan Banner Komunitas

Menjadi seorang Blogger, adanya komunitas akan sangat membantu untuk berkembangnya blog yang sedang dikelola. Karena komunitas membuat kita semangat untuk menulis dan juga tempat menambah keilmuwan. Blogspedia adalah komunitas yang membuat ngeblogku lebih berkembang dan terarah.


  • Masuk kebagian tata letak, pilih bagian Sidebar.
  • Tambahkan Gadget.
  • Klik HTML.
  • Lalu copy paste HTML dibawah ini.
<table border="0" bordercolor="#111111" cellpadding="2" cellspacing="0" style="border-collapse: collapse; width: 383px;">

<tr><td><a href="https://www.blogspedia.my.id/”"><img src="https://www.blogspedia.my.id/wp-content/uploads/2022/01/logo-thecupuers-300x300.jpg””" width="100" height="100" /></a></td>

<tr><td><a href="https://bloggerperempuan.com"><img src="https://shintaries.com/wp-content/uploads/2020/04/Logo-Blogger-Perempuan-Network-round-805x805.png”" width="120" height="120" /></a></td></tr></tr></table>

Keterangan :

Warna Hijau : Silakan diganti dengan link yang akan mengarah pada web komunitas yang kita ikuti.

Warna Coklat : Silakan diganti dengan link image address tempat kita menyimpan gambar logo atau tempat kita meng-copy logo tersebut.

Warna Biru: Silakan diganti dengan ukuran gambar yang diinginkan.

4. Menambahkan Sosial Widget

Manfaatnya untuk memudahkan orang lain untuk mengenal dan menghubungi kita. Karena tinggal klik, orang lain langsung terhubung dengan media sosial yang kita punya.


  • Masuk kebagian tata letak, pilih bagian Footertop.
  • Klik Sosial Media
  • Lalu copy paste HTML dibawah ini.
<a href='https://www.facebook.com/#' title='Facebook' aria-label='Facebook' target='_blank' rel='noopener'>

<svg viewbox='0 0 24 24'><path d='M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M18,5H15.5A3.5,3.5 0 0,0 12,8.5V11H10V14H12V21H15V14H18V11H15V9A1,1 0 0,1 16,8H18V5Z'></path></svg>

</a>

<a href='https://x.com/_Shodiqah?t=cAh-l3EN-f6903B9ILPWRw&s=09' title='Twitter' aria-label='Twitter' target='_blank' rel='noopener'><svg viewbox='0 0 512 512'><path d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/></path></svg></a>

<a href='https://www.instagram.com/#' title='Instagram' aria-label='Instagram' target='_blank' rel='noopener'>

<svg viewbox='0 0 24 24'><path d='M7.8,2H16.2C19.4,2 22,4.6 22,7.8V16.2A5.8,5.8 0 0,1 16.2,22H7.8C4.6,22 2,19.4 2,16.2V7.8A5.8,5.8 0 0,1 7.8,2M7.6,4A3.6,3.6 0 0,0 4,7.6V16.4C4,18.39 5.61,20 7.6,20H16.4A3.6,3.6 0 0,0 20,16.4V7.6C20,5.61 18.39,4 16.4,4H7.6M17.25,5.5A1.25,1.25 0 0,1 18.5,6.75A1.25,1.25 0 0,1 17.25,8A1.25,1.25 0 0,1 16,6.75A1.25,1.25 0 0,1 17.25,5.5M12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9Z'></path></svg>

</a>

Warna Hijau : Silahkan diisi dengan link media sosial kita.

5. Menambahkan Tombol Back To Top


Tombol Back To Top berfungsi untuk memudahkan pengunjung yang lagi blogwalking ke blog kita, begitu sampai di ujung bawah, kadang kan malas ya scrolling ke atas. Nah, dengan adanya tombol back to top tersebut, pengunjung tinggal klik tombolnya, dan otomatis akan naik ke atas hanya dalam hitungan detik saja. Untuk langkah lebih lanjut bisa intip tulisan Mbak Marita ya.

Penutup

Tugas sekarang membuat badan panas dingin dan ketar-ketir sangking semenyenangkannya. Kunci sukses menjalani tugas ini adalah ketelitian dan kesabaran yang super duper ekstra di bandingkan tugas sebelumnya. 
Jangan malas untuk praktek dan bertanya, biar tidak pusing sendirian hehe. Lima cara ini akan membuat perubahan cukup besar pada penampilan blog kita apabila diikuti. Alhamdulillah selesai juga, akhirnya bisa tidur nyenyak. Semangat mbak-mbak yang masih berkutik dengan ratusan kode yang tidak bisa dibaca.





14 komentar

Hai... Terima kasih sudah berkunjung. Semoga tulisan saya bisa bermanfaat untuk Para Asdiqo'.
Shodiqah tunggu komentarnya ya, tetapi jangan tinggalkan link hidup di dalam komentar.

  1. MasyaAllah semoga aku segera menyusulmu kak. Coba baca-baca tulisan mbak Oktavia juga, tapi jeda-jeda karena perlu fokus penuh nih buat ngerjain hehe.

    BalasHapus
    Balasan
    1. Semangat kak, Insya Allah kita akan melewati ujian iniii...

      Hapus
  2. Wah, baarakallah sudah selesai. Aku ikuti langkah yang mbak tulis aja ya, penjelasannya lebih simpel. Jazakillah Khairan

    BalasHapus
    Balasan
    1. Semangat mbaakk, semoga segera selesai tugasnya Mbaa

      Hapus
  3. selamat mbak tampilan blognya kece sekali :D semoga aku segera menyusul dengan tampilan baru juga...

    BalasHapus
  4. Warna hijau bikin segar dipandang mbak.tos dulu sesama penyuka ijo

    BalasHapus
  5. rapih sekali, gimana caranya supaya banner samping kiri bisa long last mba? saat scrool kebawah popular post dia tetap ikut cakep

    BalasHapus
  6. Rumah baru dengan tampilan baru yang lebih segar. Semoga semakkn menambah semangat ngeblognya.

    BalasHapus
    Balasan
    1. Ya Rabb Aamiin Ya Allah. Semngat ngeblog juga mbaak

      Hapus
  7. Semangat ngeblog, rumah barunya semakin cantik. Semoga semakin betah ya kak..

    BalasHapus
    Balasan
    1. aamiin Ya Allah, kakak juga semangat ya ngeblognya

      Hapus