Skip to content Skip to sidebar Skip to footer

Cara membuat tag KBD Pada Blogger Responsive

Cara membuat tag KBD Pada Blogger Responsive

Cara membuat tag KBD Pada Blogger Responsive - Halo sobat blogger, bagi kalangan para mastah dan suhu blogger yang sudah sangat mahir, mungkin sudah tidak asing lagi dong dengan istilah "kbd". Lalu buat sobat blogger pemula adakah yang sudah tahu apa itu kbd?


itu kbd?


Elemen kbd merupakan singkatan dari keyboard. Dimana tag kbd ini biasanya digunakan untuk membuat masukan perintah dari keyboard dan bisa juga digunakan untuk membuat perintah voice command.


Namun tak jarang juga, tag kbd ini sering digunakan oleh para blogger (blog Tutorial) untuk memperjelas perintah ditengah teks dengan maksud agar pengunjung paham betul dengan maksud tutorial yang ada diblog tersebut.


Jika sobat masih bingung, bisa lihat contoh pengaplikasian tag kbd pada beberapa teks dibawah ini;

Semisal Contohnya Ini

font-family:'Quicksand';

CTRL + C

CTRL + V

]]></b:skin>

<kbd>Mboton</kbd>


Memang apa sih keuntungannya memasang tag kbd pada blog kita?


Menurut admin keuntungan memasang tag kbd ini tak lain untuk menambah nilai lebih kepada pengunjung blog kita. Pasalnya jika kita memasang tag ini pada tulisan diblog kita, ini akan memberikan kesan yang menarik dimata pengunjung dan memudahkannya untuk mengikuti tutorial yang sobat berikan.


Jika blog kita menarik dimata pengunjung, otomatis pengunjung pasti akan sering mengunjungi blog kita kan nah itulah keuntungan memasang style kbd pada tulisan blog kita. Oke, mari kita lanjut ke cara membuatnya.

Cara Membuat Tag KBD keren pure CSS pada Blog


  1. Silahkan sobat login ke akun blog kalian.
  2. Masuk pada menu template atau tema blogger kemudian anda bisa klik edit HTML.
  3. Kemudian Cari kode ]]></b:skin>
  4. Kemudian copy kode css dibawah ini tepat diatas kode tersebut.


/* Tag KBD*/
kbd {
background: #FFE591;
color: #222!important;
border-radius:4px;
padding:3px 8px;
}
kbdu {
background: #057B6F;
color: #fff!important;
border-radius: 4px;
padding: 3px 8px;
}


Silahkan sobat sesuaikan sendiri warna backgroundnya #FFE91;.


Bagi sobat yang menggunakan template viomagz, silahkan hapus terlebih dahulu kode dibawah ini; untuk yang lainnya silahkan sesuaikan sendiri ya. Intinya hapus style kbd bawaan template (jika ada).


kbd{font-size:80%;border:1px solid #777;padding:2px 5px;border-bottom-width:2px;border-radius:3px;}


Jika anda memakai template VioMagz bisa pakai ini.


cara menggunakannya Tag KBD


  • Buat postingan baru atau edit artikel yang sudah ada.
  • Pada tampilan Entri Post pilih edit HTML.
  • Lalu cari yang akan anda kasih tag kbd.
  • <kbd>Masukkan kata disini Semisal Mboton.net</kbd>
  • Kemudian simpan dan lihat hasilnya.


Penutup


Nah, bagaimana sobat? Mudah sekali bukan? Itulah sedikit ulasan dari Mboton tentang bagaimana cara membuat style tag kbd pure CSS pada blog. Semoga tutorial kali ini sangat bermanfaat yang buat sobat sekalian, jika ada yang ingin ditanyakan silahkan komen di bawah ini. Jangan lupa dishare ya, biar blog JejakPintar makin berkembang. Aamiin

Mboton
Mboton Spesialis pembuat Blogger sejak tahun 2013.

Post a Comment for "Cara membuat tag KBD Pada Blogger Responsive"