Skip to content Skip to sidebar Skip to footer

Cara Dasar Edit Template Blog, Mudah [Update] 2020

Halo kawan EvilicaCell bertemu lagi dengan saya admin dari situs yang sederhana ini, dikesempatan kali ini saya akan share Cara sederhana edit template blog hasil download yang mudah dipahami dan di pelajari. Cara edit template blog hasil download maupun bawaan blogger bisa kalian praktikan dan pelajari dengan mudah seperti yang akan saya jelaskan pada artikel kali ini. Saya akan berbagi tips dasar edit template blog dengan HTML, CSS ataupun JavaScript lewat Inspect Element pada browser. Sebelum lanjut ke inti pembelajaran sebaiknya kalian pahami dulu apa itu inspect element?

Inspect element adalah sebuah fitur dari browser yang dibuat untuk mempermudah pengembangan web, atau juga bisa untuk melihat sumber dari design tampilan web. Jadi dengan menggunakan inspect element pada browser kita bisa melihat kode / script yang digunakan pada web yang kita buka. Dengan cara dasar seperti ini, saya jamin kalian akan langsung paham trik dasar edit HTML ataupun CSS.

Oke kita lanjut ke inti pembelajar cara Edit template blog dengan teknik dasar yaitu menggunakan inspect element pada browser, dan kalian bisa simak artikel ini sampai akhir ya guys.. dan jika masih bingung kalian bisa tonton video tutorial nya di akhir artikel.

Tutorial Dasar Belajar Coding Edit Template Blog Update 2020:
  1. Pertama kalian harus tentukan tujuan kalian dahulu, misalnya kalian ingin edit pada bagian menu navigasi, tombol share, warna template, ukuran template, box shadows dan lain-lain...
  2. Buka blog kalian yang ingin kalian edit template nya di browser, bisa Firefox ataupun Chrome
  3. Lalu klik kanan pada bagian yang ingin kalian edit > klik inspect element, maka akan terbuka tab menu inspect element yang berisi sebuah kode HTML dan CSS
    Contoh disini saya akan edit tombol back to top (tombol scrool keatas)
    Inspect Element
  4. Jika sudah terbuka kotak inspect element, selanjutnya kalian perhatikan kode HTML nya dan klik pada kode HTML sesuai witged yang ingin kalian edit, contoh saya klik kode HTML pada widget back to top
    Inspect Element
  5. Beralih ke kotak kode CSS sesuai widget yang kalian klik, selanjutnya kalian coba-coba saja rubah sesuai ke inginan. Contoh:
    • background = warna belakang / warna
    • color = warna tengah / warna pada bagian lain
    • padding = ukuran lebar / ukuran tinggi
    • font-size = ukuran besar atau kecil
    • border-radius = ukuran sisi (bisa bulat, bisa kotak siku-siku)
    • box-shadow = bayangan... dan masih banyak lain
  6. Pada tahap nomor 5 kalian sudah berhasil merubah / edit tampilan sesuai keinginan, selanjutnya kalian terapkan ke template blog milik kalian
  7. Buka blogger.com dan login > klik menu Tema > klik edit HTML
  8. Tekan CTRL + F pada kotak edit HTML di blogger untuk memunculkan kotak search, selanjutnya kalian masukan kode yang ingin kalian rubah tadi dan tekan enter. Contoh disini saya mencari kode #back-to-top karena saya ingin merubah pada bagian tombol back to top
  9. Perhatikan dengan seksama, apakah kode yang ada di inspect element sudah benar-benar sama dengan yang kalian temukan di edit HTML blogger?
    Inspect Element
  10. Jika sudah yakin barulah kalian bisa merubah kode yang kalian edit tadi melalui inspect element ke menu edit HTML pada blogger.
  11. Terakhir jika sudah benar kalian bisa klik simpan tema pada menu edit HTML di blogger

Nah pada tahap ini kalian sudah berhasil edit / merubah tampilan template blog sesuai keinginan, dan hasil edit sudah tersimpan maka template yang kalian edit sudah berhasil tersimpan. Sampai sini seharusnya kalian sudah mengerti teknik dasar edit template pada blog.

Cara ini bisa kalian pelajari lagi dengan meng-otak atik pada widget bagian lain, misalnya menu navigasi, tombol share dan lain-lain. Untuk mempermudah mehami cara dasar edit template blog kalian bisa tonton video berikut:

Buat kalian yang ingin mencoba coding membuat script nembah gebetan anti tolak, bisa cek artikel berikut "tutorial membuat script nembah gebetan" untuk penjelasan dan cara mengatasi nya.

Oke mungkin sekian tutorial dasar edit template blog dari EvilicaCell, jika masih ada yang bingung atau kesulitan kalian bisa komentar dibawah, dan jangan lupa untuk support kami dengan cara subscribe channel YouTube EvilicaCell secara gratis and see you next time :)

2 comments for "Cara Dasar Edit Template Blog, Mudah [Update] 2020"

  1. gan update tentang blogging lagi dong :(

    ReplyDelete
    Replies
    1. Cooming soon ka, stay terus di EvilicaCell dot com

      Delete