header kapan nulis oz

Ngoprek Template Blog Yuk!

Konten [Tampil]

Ngoprek Template blog sama seperti mendesain rumah impian. Kalau rumahnya, rapi, nyaman, di cat dengan warna kesukaan, kita pasti senangkan berlama-lama di rumah. Sama halnya dengan menata template blog, jika blognya sudah cantik maka menulis pun akan semakin semangat. Setuju gak sih?

Menata Template Sederhana ala 
Kapan Nulis, Oz?

gambar ini memberikan ilustrasi ngoprek template blog
Ngoprek Template Blog


    
        Setelah menjalani kelas pendampingan blog untuk pemula selama hampir 2 bulan, akhirnya sampailah kami pada materi ngoprek template blog. Inilah yang ditunggu-tunggu, tapi agak ngeri-ngeri sedap sih sebenernya alasannya karena kalau sudah ngoprek template tentu akan berkaitan dengan bahasa html/xml wihhh... kira-kira sanggup gak yah menjalani ini? hiks. Bismillah, InsyaAllah bisa, semangat aja dulu deh ya ...

            Lalu ada satu hal lagi yang bikin saya sedikit dilema, yaitu harus melepaskan template bawaan blogspot "Emporio" ini, namanya juga lagi sayang-sayangnya, eh harus ganti haluan, Eaaaa. Coachnya gak maksa kita untuk ganti template sih, beliau hanya memberikan pemahaman bahwa template bawaan blogspot belum Seo Friendly. Kan sayang, sudah sejauh ini berproses, masa gak mau maju selangkah lagi, ya kan? Kamu tuh udah terlanjur nyebur loh, yaudah basah sekalian menyelami dunia Seo sedalam-dalamnya.

            Ngoprek template blog gak boleh asal-asalan apalagi setengah hati, harus sabar, jujur, rajin menabung, cinta lingkungan, eh kok gak nyambung sih? heheh ... intinya kalau mau ngoprek harus sabar, fokus dan sepenuh hati. Proses ngoprek ini penuh dengan trial dan error yang akan benar-benar menantang keseriusan kamu dalam mendandani blog kesayanganmu, asalkan fokus dalam memahami kode-kode atau bahasa html insyaAllah bisa deh. Yuk lanjut bacanya sampai selesai.


Baca Juga : Pendidikan Masa Kini


Lakukan 3 hal ini sebelum ngoprek template.

gambar ini memberikan ilustrasi 3 hal sebelum ngoprek template
3 Hal sebelum ngoprek template

            Template unduhan ini ada dua jenis Sobat Oz, yang pertama yang gratisan yang kedua berbayar. Nah terserah Sobat Oz deh mau pilih yang mana, pilih aku untuk menjalani hari tua bersamamu juga boleh, ho'a, ho'eee ...

            Eits... jangan asal langsung mau ngoprek template aja Sobat Oz... ada tiga hal yang perlu dilakukan sebelum ngoprek template. Pertama, Sobat oz harus sudah memahami dasar-dasar mendesain blog secara sederhana, karena kalau belum paham nanti malah tambah bingung ketika akan mendesain template unduhan. Kedua, Sobat Oz wajib cari referensi dulu cara memilih tema responsive dan SEO friendly untuk blogspot. Ketiga, Baca dengan hati-hati cara menerapkan template unduhan dan menyesuaikan template sesuai dengan keinginan hati. 


a. Pahami Dasar-dasar Mendesain Blog

            Sebelum Sobat Oz ngoprek template unduhan ada baiknya Sobat Oz memahami dasar-dasar mendesain blog dulu ya. Nah, saya punya rekomendasi tutorial dasar mendesain template yang ditulis oleh coach kece cetar membahana yaitu Coach Marita Ningtyas dari Blogspedia. Tenang, bahasanya sederhana dan mudah dipahami kok, apalagi ada gambarnya juga jadi sambil baca bisa sambil dipraktekkan. Kuy, gercep!


b. Cari Referensi Tema Responsive Seo Friendly

            Nah, ini merupakan langkah yang penting juga loh Sobat Oz, kenapa? Tujuan kita supaya blog bisa diterima dengan baik oleh Google tapi kan ada syaratnya supaya bisa memenuhi standarnya Google. Jadi Google tuh maunya blog kita Seo Friendly sudah sesuai dengan Search Engine Optimization. Sudah tahu kan syaratnya? Lalu cari referensinya dimana? Tenang ... Blogspedia punya tutorial kece yang gak bikin kamu gagal paham tentang Tema Responsive Seo Friendly, cek dongs ke blognya ya...


c. Baca Cara Menerapkan dan Menyesuaikan Template

            Langkah yang terakhir adalah Baca dengan teliti cara menerapkan dan menyesuaikan template. Banyak banget yang harus dibaca! Sobat Oz, pilih pusing ditengah jalan apa pusing di awal? Saya sih pilih yang kedua, lebih baik pusing di awal tapi nanti endingnya bahagia, iyaa... bahagia sama kamuuu... hehehe...

            Tutorial cara menerapkan template unduhan itu biasanya berbeda-beda ya Sobat Oz, maka dari itu sebelumnya baca dulu tutorial menerapkan template unduhan yang disediakan website tersebut atau ketika mengunduh dan sudah mengekstrak file Sobat Oz bisa cari file dengan judul "documentation and tutorial". Nah, kalau Saya men-download template "Fiksioner" dari Igniel ini udah dikasih lengkap sama tutorialnya loh.

            Setelah melakukan 3 hal di atas, sekarang kita langsung ke tutorial cara menata template unduhan sederhana Ala Kapan, Nulis Oz?

1. Periksa template unduhan di Seoptimer.com dan Speed Insight

            Kenapa sih harus diperiksa dulu? Bukannya semua template itu sama saja? Wait, tujuan dari memeriksa template unduhan adalah untuk memeriksa optimalisasi di blog apakah sudah Seo Friendly atau belum. Jadi kalau belum Seo Friendly kan bisa kita perbaiki. Enakan mana memperbaiki banyak kesalahan atau sedikit? Kalau saya sih sebisa mungkin gak usah diperbaiki, tapi kan gak ada template yang sempurna yaa... sama seperti aku yang gak sempurna tanpa kamu... iya... kamu... eeaaaa.

            Cara memeriksanya pun cukup mudah loh Sobat, Oz. Setelah menemukan template unduhan yang diinginkan klik live preview atau demo lalu salin linknya dan tempel di bagian kolom pencarian seoptimer.com kemudian klik audit, tunggu beberapa detik hasilnya akan keluar apakah template Sobat Oz impikan sudah baik dan Seo Friendly. Kebetulan sudah dioprek template Kapan Nulis, Oz jadi sewaktu diperiksa di Seoptimer alhamdulillah sudah lumayan meskipun belum A+ ya untuk pemula.

 

gambar ini memberikan ilustrasi hasil seoptimer
hasil seoptimer Kapan Nulis Oz?

            Selanjutnya kita akan mengecek Speed Insight, apa sih gunanya? Ini tuh gunanya untuk mengetahui berapa persen tingkat kecepatan blog kita ketika dibuka dalam bentuk mobile dan desktop. Pernah gak sih buka web atau blog yang loadingnya lama? Nah, di Speed Insight selain dikasih tahu seberapa cepat web atau blog ini beroperasi juga dikasih saran apa saja yang perlu dilakukan supaya web atau blog kita tidak lola alias loading lama.

 

gambar ini memberikan ilustrasi tentang tampilan page speed seluler
Tampilan page speed seluler

 

gambar ini memberikan ilustrasi tentnag tampilan page speed desktop
Tampilan page speed desktop


2. Unduh dan Install

            Setelah mengecek template di Seoptimer dan Speed Insight, tanpa berlama-lama lagi mari langsung kita unduh, cari lah tombol unduh/download pada halaman fiksioner.

 

gambar ini memberikan ilustrasi unduh template
Unduh template

            Setelah diunduh saatnya kita install, buka file unduhan dalam bentuk zip di folder download lalu pilih ekstrak file dan simpan di folder yang Sobat Oz inginkan. Setelah diekstrak cari file dengan nama fiksioner v3 xml lalu buka di note. Sebelum meng-install ada baiknya template yang lama dicadangkan terlebih dahulu caranya buka dashboard blog --> lalu pilih tema --> pilih tanda panah pada kolom sesuaikan --> pilih cadangkan maka Sobat Oz akan mengunduh template yang lama, simpan dan ubah nama untuk memudahkan pencarian jika dibutuhkan dilain waktu.,

 

gambar ini memberikan ilustrasi cadangkan/pulihkan
Cadangkan atau Pulihkan?

            Untuk menginstal ada 2 cara dengan dipulihkan atau edit HTML, jika menginstal dengan menggunakan pilihan pulihkan kekurangannya widget yang sudah pernah Sobat Oz tambahkan pada template sebelumnya akan hilang. Akan lebih aman jika Sobat Oz menginstal menggunakan edit html karena widget yang sudah ditambahkan sebelumnya akan tetap ada tanpa harus ditambahkan ulang.

 

gambar ini memberikan ilustrasi edit html dan setelan seluler
Instal edit html dan setelan seluler

            Setelah file fiksioner v3 xml dibuka di note, klik CTRL + A untuk memblok semua kode lalu Klik CTRL + C untuk menyalin/copy. Kemudian kembali ke dashboard blog --> pilih tema --> pilih edit html --> Klik CTRL + A untuk memblok semua kode pada kolom tersebut --> Klik CTRL + V --> jangan lupa di simpan. Maka Sobat Oz sudah menginstal template unduhan pada blog. Untuk menu setelan seluler ini, kenapa diatur dengan memilih tampilan desktop, jadi meskipun dibuka di handphone namun tampilan blog tetap seperti tampilan pada desktop.

 

gambar ini memberikan ilustrasi menginstal
Menginstal


Baca Juga : Bergabung dengan Canva for Education

3. 6 Tutorial Menata Template Blog secara Sederhana ala KNOZ

            Setelah menyelesaikan langkah-langkah unduh dan install ini saatnya Sobat Oz untuk fokus dan sabar selama menyelesaikan tutorial menata template blog secara sederhana ala Kapan Nulis, Oz? Siap ya, here we go!


a. Mengubah warna latar belakang dan tulisan

            Untuk mengubah warna latar belakang dan tulisan Sobat Oz buka dashboard blog lalu pilih tema, klik sesuaikan maka akan diarahkan pada laman untuk menyesuaikan disebelah kiri dan di sebelah kanan adalah halaman blog. Semua perubahan yang dibuat pada laman sebelah kiri akan terlihat pada laman sebelah kanan. 

 

gambar ini memberikan ilustrasi laman penyesuaian
Laman penyesuaian

            Pada laman kiri terdapat tiga bagian, yaitu Latar Belakang, Lanjutan dan Gadget. Mengubah warna latar belakang bisa dilakukan pada bagian Latar Belakang sedangkan untuk mengubah warna tulisan bisa dilakukan pada bagian lanjutan. Sobat Oz bisa mencoba semua fitur-fitur yang ada pada laman sebelah kiri.

 

gambar ini memberikan ilustrasi menu latar belakang dan menu lanjutan
menu latar belakang dan lanjutan

            Tips memilih warna latar belakang dan tulisan yang baik adalah pilihlah warna latar belakang putih dan tulisan warna gelap karena lebih nyaman dibaca, lalu pilihlah jenis tulisan yang juga tidak terlalu rumit, sesederhana Philosopher atau Lora kedua jenis tulisan ini rekomendasi pribadi saya, tetapi Sobat Oz bisa memilih jenis yang di sukai, sedangkan untuk ukurannya jangan terlalu kecil atau terlalu besar.


b. Menata Menu Dropdown

            Sekarang kita akan bermain dengan kode-kode nih, saya harap Sobat Oz tidak pantang menyerah ya karena kesabaran Sobat Oz akan sangat diuji. Baiklah, mari kita mulai. Untuk menata menu dropdown Sobat Oz buka dashboard blog -->pilih menu tata letak --> setelah muncul laman tata letak Sobat Oz klik tanda pena pada menu untuk mengedit.

 

gambar ini memberikan ilustrasi menu tata letak
Menu tata letak


            Setelah diklik edit maka akan muncul kolom box lalu masukkan kode-kode dibawah ini. Jika dilihat sekilas memang agak bikin pusing apalagi jika Sobat Oz baru pertama kali melihatnya. Nah ikuti arahan saya ya.

 
<ul>
<li><a href='https://www.kapanulisoz.my.id/' title=' Home'>Home</a></li>
<li><a href='https://www.kapanulisoz.my.id/p/tentang-kapan-nulis-oz.html' title='About Me'>About Me</a></li>
<li class='dropdown'>
<a href='#' onclick='return false;' title='What's new on this blog'>What's New on This Blog</a>
<ul>
<li><a href='https://www.kapanulisoz.my.id/search/label/Aneka%20Review' title='Review'>Review</a></li>
<li><a href='https://www.kapanulisoz.my.id/search/label/Aneka%20Tutorial' title='Tutorial'>Tutorial</a></li>
<li><a href='https://www.kapanulisoz.my.id/search/label/Aneka%20Tips%20dan%20Trik' title='Tips & Trik'>Tips & Trik</a></li>
<li><a href=' https://www.kapanulisoz.my.id/search/label/Info' title='Info'>Info</a></li>
</ul>
</li>
<li class='dropdown'>
<a href='#' onclick='return false;' title='Others'>Others</a>
<ul>
<li><a href='https://www.kapanulisoz.my.id/search/label/Blogspedia' title='Blogspedia'>Blogspedia</a></li>
<li><a href='https://www.kapanulisoz.my.id/search/label/Life%20Lesson' title='Life Lesson'>Life Lesson</a></li>
<li><a href='https://www.kapanulisoz.my.id/search/label/Family%20Time' title='Family Time'>Family Time</a></li>
<li><a href='https://www.kapanulisoz.my.id/search/label/Me%20Time' title='Me Time'>Me Time</a></li>
</ul>
</li>
</ul>

            Pada baris pertama Sobat Oz akan melihat kata-kata yang Familiar seperti Home/beranda biasanya jika kita klik Home/beranda akan kembali ke bagian awal blog bukan? Maka kita akan memasukkan link blog kita diantara tanda kutip yang saya garis bawahi.


 
gambar ini memberikan ilustrasi mengedit menu dropdown
mengedit menu dropdown


            Pada baris berikutnya ada kata About Me yang biasanya berisi informasi tentang penulis atau blog kita maka kita masukkan link tulisan tersebut diantara tanda kutip, yang ada https.            

            Pada baris selanjutnya ada kata dropdown nah ini berisi menu yang tersusun kebawah maka kita akan memberikan judul What's new on this blog atau jika Sobat Oz mau memberikan nama yang lain juga boleh. Pada bagian ini kita akan menggunakan label tulisan untuk mengelompokkan menu dropdown, seperti pada blog saya membuat menu review, tutorial, tips dan trik dan info pada menu What's new on  this blog dengan memasukkan link label review, tutorial, tips dan trik dan info, begitu seterusnya.


c. Menata Big Ad menjadi Header

            Jika teman-teman sempat kebingungan untuk memasang header supaya blognya tambah kece, tenang kita bisa memanfaatkan Big Ad yang ada dibagian bawah header, menu dan search. Sebelumnya Sobat Oz siapkan dulu desain headernya, lalu upload dalam sebuah postingan, eits... gak perlu diposting cukup disimpan saja karena yang kita butuhkan adalah alamat linknya, klik kanan pada gambar lalu pilih salin alamat gambar.

 

gambar ini memberikan ilustrasi menyiapkan link header
menyiapkan link header

            Setelah itu Sobat Oz buka dashboard blog, pilih tata letak lalu klik gambar pena pada Big Ad untuk mengedit, pertama-tama aktifkan widgetnya lalu masukkan kode dibawah ini lalu ganti dengan link header yang sudah disalin sebelumnya, atur nama dan ukurannya lalu simpan, oiya jika ukurannya kurang sesuai bisa diganti kok.

  

Gambar ini memberikan ilustrasi Big Ad Header
Big Ad Header

<img src="https://1.bp.blogspot.com/-q89Fb2wJ0mA/YQJy79kDqXI/AAAAAAAAAvM/setfvAOdDJgjYog42rMwswqGuZD-dSTIwCNcBGAsYHQ/w640-h128/Header-Blog-KNOZ-1000x200.png" width="1000" height="200" title="header kapan nulis oz" alt="header kapan nulis oz"/>


d. Menambahkan Widget Banner logo komunitas

            Untuk menambahkan Widget Banner Logo Komunitas, Sobat Oz bisa menyiapkan logonya dulu seperti menyiapkan header di atas, upload dulu di postingan cukup disimpan saja lalu klik kanan pada gambar dan pilih salin alamat gambar. lalu Sobat Oz buka dashboard blog pilih tata letak lalu pilih add widget atau tambahkan gadget, lalu pilih html/java script, Masukkan kode dibawah ini lalu edit sesuai kebutuhan jangan lupa klik simpan ya.

 

gambar ini memberikan ilustrasi menambahkan gadget banner
Menambahkan gadget banner

<center><a href="https://www.ngodop.com/" target="_blank"><img src="https://renovrainbow.com/wp-content/uploads/2020/11/logo-odop-300x300.jpg" border="0" alt="" width="200" height="200"  /></a></center>


e. Menambahkan tombol Back to Top

            Tombol yang satu ini bermanfaat banget loh Sobat Oz, karena akan memudahkan pembaca untuk kembali ke bagian atas blog dengan cepat hanya dengan menekan tombol Back to Top (tanda panah menghadap ke atas), jadi gak perlu repot scroll secara manual ya bikin pegel hati, eh jempol maksudnya hehehe ...

            Caranya juga mudah kok, Sobat Oz tinggal ikuti saja langkah-langkah membuat tombol Back to Top milik Coach Marita Ningtyas dari Blogspedia ini, gampang kok dijamin langsung bisa deh.


f. Menata Sosial Media

            Nah, yang satu ini juga penting loh untuk meyakinkan Google kalau kita itu ada dan nyata, juga bisa menambah follower sosial media juga. Tapi intinya sih berbagi sosial media bisa menambah wawasan dan teman baru kalau menurut saya, Sobat Oz boleh pasang boleh juga tidak. Jika berminat boleh banget ikuti cara menambahkan sosial media milik coach Marita Ningtyas  dari Blogspedia ini.


Baca Juga : Mudahnya Memasang TLD


            Nah, ini adalah tampilan blog before dan after Kapan Nulis, Oz sebelum dan sesudah dioprek. Nampak lebih profesional ya yang sesudah. Hehehe ... kalau saya saja bisa, saya yakin Sobat, Oz juga Bisa!

 

gambar ini memberikan ilustrasi before dioprek
Before dioprek


 
gambar ini memberikan ilustrasi after dioprek
after dioprek


 

            Gimana Sobat Oz, ngoprek template blognya tidak sesulit yang dibayangkan diawal ya? Saya pun awalnya agak meragukan diri apakah bisa ngoprek template blog? Tapi berkat pendampingan dan materi dari coach Marita Ningtyas dan Blogspedia pelan-pelan tapi pasti saya akhirnya berhasil menata template blog saya meski masih sederhana. Puas sekali rasanya loh Sobat Oz, semoga saya bisa terus berproses melalui kelas pendampingan blog bagi pemula ini ya, Aminn... Semangats. Salam Tebar Manfaat!



Mairoza HR
Eoseo Osibsio Selamat Datang di Blog Kapan Nulis, Oz? Dalam blog ini Sobat, Oz akan mendapatkan informasi tentang aneka Review, tips dan trik, tutorial dan beberapa pikiran receh saya lainnya. Saya adalah seorang Ibu Rumah tangga yang nyambi jadi Guru Bahasa Inggris, blogger dan soon to be a youtuber. Ingin Kerjasama? Silahkan kontak email saya ya...

Related Posts

20 komentar

  1. Aku belum kelar nih mbaak. Masih pake tema simple bawaan blogspot haha.

    BalasHapus
    Balasan
    1. Semangats-semangatd mbakkkk 😍😍😍

      Hapus
  2. Tutorial komplit paripurna! Mantapp. Kayaknya ntar aku baca dari sini aja pas ngoprek template. Semua materi tentang ngedit template udah ada semua di sini. Aku bookmark sekalian nih haha. Bermanfaat syekalii

    BalasHapus
    Balasan
    1. MasyaAllah... Makasih mama Razin. Semoga bermanfaat ya... Terima kasih sudah mampir 😍

      Hapus
  3. Waw, mantab mb! Lengkap dan detail nih tutorialnya. Kereeen banget dah berhasil menata template se-fresh ini mb..

    BalasHapus
    Balasan
    1. Makasih mbak... Sudah mampir 😍😍😍

      Hapus
  4. Masya Allah lengkap banget mbak, aku kelewat back to top. Nanti kuliat lagi ah..hehe

    BalasHapus
    Balasan
    1. Alhamdulillah mbak, makasih sudah mampir ya 😍 ... Semangatssss

      Hapus
  5. Semoga makin semangat ya ngeblognya... kan udah cantik templatenya.

    BalasHapus
    Balasan
    1. Alhamdulillah... Makasih coachhh... Amiinnn... Semangatssss

      Hapus
  6. Paket kompliitt tenan. Keren lho nulis tutorial beginian.

    BalasHapus
    Balasan
    1. Alhamdulillah kang, semoga bermanfaat... Terima kasih sudah mampir 🙏

      Hapus
  7. Keren mbak bisa lengkap. Se gambar2nya juga lengkap. Amaziiiing wkwkwk. Tampilan blog kapan nulis oz juga makin fresh ;) semoga tambah semangat blogging...

    BalasHapus
    Balasan
    1. Alhamdulillah mbak, ini tulisanku terniat sepanjang masa hahaha... Iya... Template baru semangat baruuu

      Hapus
  8. Ya Allah, can5iik bangeett.. Ada tutorialnyaa juga,bagus banget mba, semoga kita makin semangat buat nulis ya mba

    BalasHapus
    Balasan
    1. Alhamdulillah mbak, semngatssss... Terima kasih sudah mampir 😍

      Hapus
  9. keren mba.. ud 97 aja speednya. lengkap banget tutorialnya. makasih yaa..

    BalasHapus
  10. Lengkap deh tutorialnya.. Jadi makin semangat nulis ya dengan template baru :D

    BalasHapus
  11. Mantab deh tutorialnya, jadi ikut makin semangat

    BalasHapus
  12. Jadi makin menarik ya mba setelah ganti template..ngliatnya aja seneng apalagi yg oprek sndiri

    BalasHapus

Posting Komentar