Membuat border pada judul sidebar blog

Sebelum ini aku sudah menuliskan cara membuat border pada judul posting dan sekarang aku akan menuliskan cara membuat border pada sidebar blog. Contohnya seperti gambar di atas line border hitam yang melingkari tulisan navigation dan blog archive. Ini adalah untuk blog yang menggunakan template minima atau simple template seperti template blog aku ini. Langkah-langkahnya sebagai berikut:

1.Masuk Dashboard > Template > Edit HTML

2.Tick expand widget template

3.Tekan secara bersamaan CTRL + F dan cari kode berikut:

h2{

4.Dibawah kode  h2{ kalau ada kode seperti di bawah ini tolong delete/hapus:

margin: 0 0 1em 0;font: $(widget.title.font);color: $(widget.title.text.color);text-transform: uppercase;

5.Hapus kode seperti diatas/no 4 dan gantikan/tukar dengan kode di bawah ini:

text-align: center; -moz-border-radius: 35px; border-radius: 35px; text-shadow: 3px 3px 3px #FFFFFF; border: 2px solid #000000; background: #FFFFFF, font-size: 14px; padding: 5px;margin: 10px}

6.Tekan pratinjau/preview dulu jadi apa tidak? baru simpan template kalau jadi. 

#warna pink itu boleh diubah ukurannya menurut keinginan.

#warna biru diatas itu adalah kode warna putih dan hitam hanya perlu pergi ke kode warna untuk mengubah warna sesuai selera.

#warna merah solid itu jenis berdernya bisa ditukar dotted, dashed, dll atau kalau mau memilih jenis border bisa kesini jenis-jenis nama border.

Untuk entri berikutnya aku akan menuliskan tentang contoh-contoh jenis border blog yang bisa diterapkan untuk membuat border pada sidebar blog.

Share :