MERUBAH FUNGSI BLOCKQUOTE MENJADI KOTAK SCRIPT

Merubah Fungsi Blockquote Menjadi Kotak Script - Situs web yang memuat kontent tutorial mengenai web desain juga bahasa programer misalnya javascript, css serta html umumnya dilengkapi menggunakan kotak script atau code snippets buat mengemas html, css dan javascript dalam tampilan yg propesional dan menarik di page tutorial mereka.
Namun beberapa perkara beberapa jenis kotak script (pre code) umumnya menggunakan JavaScript library dan css pihak ketiga (CDN, Highlight.js, Prism.js. Juga Google Prettify) yang bisa menambah sedikit beban pemuatan laman situs. Dan memakai kotak script menggunakan pre code syntax highlighting wajib extra hati-hati agar kode html serta js yg di sematkan dapat ditampilkan dengan paripurna, umumnya diwajibkan buat memparse kode "html dan js" sebelum disematkan menggunakan pre code (code snippets).

Ditutorial ini saya akan menunjukkan cara membuat kotak script yg bisa digunakan menggunakan tehknik yang lebih sederhana yaitu menggunakan cara merubah fungsi blockquote sebagai kotak script yang mirip menggunakan pre code. Ikuti langkah-langkahnya sebagai berikut;

Membuat Kotak Script dengan Blockquote

1. Login ke blogger > Template > Edit HTML
2. Cari serta temukan style dasar "css blockquote" template anda lalu ganti dengan css dibawah ini;

blockquotequotes:none;
blockquote:before,blockquote:aftercontent:'';content:none;
blockquotemargin:1.5em 0;padding:5px;background-color:#353535;border:1px solid #DADADA;padding-left:1em;color:inherit;color:#fff;font-size:12px;display:block;

Jika sebelumnya template blogger anda nir memiliki style "blockquote" silahkan tambahkan css tadi sempurna diatas kode ]]> kemudian save template.
Cara Penggunaan:
Highligt atau select code (javascript, htm atau kode css) kemudian klik tombol blockquote pada bar atas post editor blogger, lihat model gambar dibawah ini;

Lihat Demo

Catatan: Tutorial ini tidak dianjurkan buat theme ijonkz v.1.tiga lantaran didalam template ijonkz telah tersedia kotak script (pre code) yang diberi nama "ijonkztabs" (Auto Tabs ShortCode).

Demikian saja tutorial cara membuat / merubah fungsi blockquote menjadi kotak script, harap diperhatikan jika halaman situs menggunakan iklan tengan artikel, posisikan blockquote diatas atau paruh atas konten serta dibawah atau paruh bawah konten supaya nir berbenturan menggunakan script iklan. Semoga bermanfaat serta sampai jumpa kembali.