Merubah Fungsi Blockquote Menjadi Kotak Script - Situs web yang memuat kontent tutorial perihal web desain maupun bahasa programer menyerupai javascript, css dan html biasanya dilengkapi dengan kotak script atau code snippets untuk mengemas html, css dan javascript dalam tampilan yang propesional dan menarik di laman tutorial mereka.
Namun beberapa kasus beberapa jenis kotak script (pre code) umumnya memakai JavaScript library dan css pihak ketiga (CDN, Highlight.js, Prism.js. maupun Google Prettify) yang sanggup menambah sedikit beban pemuatan laman situs. Dan memakai kotak script dengan pre code syntax highlighting harus extra hati-hati biar aba-aba html dan js yang di sematkan sanggup ditampilkan dengan sempurna, biasanya diwajibkan untuk memparse aba-aba "html dan js" sebelum disematkan dengan pre code (code snippets).
Ditutorial ini aku akan membagikan cara menciptakan kotak script yang sanggup dipakai dengan tehknik yang lebih sederhana ialah dengan cara merubah fungsi blockquote menjadi kotak script yang menyerupai dengan pre code. ikuti langkah-langkahnya sebagai berikut;
Cara Penggunaan:
Highligt atau select code (javascript, htm atau aba-aba css) lalu klik tombol blockquote pada kafe atas post editor blogger, lihat pola gambar dibawah ini;
Namun beberapa kasus beberapa jenis kotak script (pre code) umumnya memakai JavaScript library dan css pihak ketiga (CDN, Highlight.js, Prism.js. maupun Google Prettify) yang sanggup menambah sedikit beban pemuatan laman situs. Dan memakai kotak script dengan pre code syntax highlighting harus extra hati-hati biar aba-aba html dan js yang di sematkan sanggup ditampilkan dengan sempurna, biasanya diwajibkan untuk memparse aba-aba "html dan js" sebelum disematkan dengan pre code (code snippets).
 |
| Merubah Fungsi Blockquote Menjadi Kotak Script |
Membuat Kotak Script dengan Blockquote
- Login ke blogger > Template > Edit HTML
- Cari dan temukan style dasar "css blockquote" template anda lalu ganti dengan css dibawah ini;
blockquote{quotes:none;}Jika sebelumnya template blogger anda tidak mempunyai style "blockquote" silahkan tambahkan css tersebut tepat diatas kode ]]></b:skin> lalu save template.
blockquote:before,blockquote:after{content:'';content:none;}
blockquote{margin:1.5em 0;padding:5px;background-color:#353535;border:1px solid #DADADA;padding-left:1em;font-family:"Monospace",Courier,Courier New;color:inherit;color:#fff;font-size:12px;display:block;}
Cara Penggunaan:
Highligt atau select code (javascript, htm atau aba-aba css) lalu klik tombol blockquote pada kafe atas post editor blogger, lihat pola gambar dibawah ini;
 |
| Cara memakai blockquote blogger |
Catatan: Tutorial ini tidak dianjurkan untuk theme ijonkz v.1.3 alasannya didalam template ijonkz sudah tersedia kotak script (pre code) yang diberi nama "ijonkztabs" (Auto Tabs ShortCode).Demikian saja tutorial cara menciptakan / merubah fungsi blockquote menjadi kotak script, harap diperhatikan jikalau laman situs memakai iklan tengan artikel, posisikan blockquote diatas atau paruh atas konten dan dibawah atau paruh bawah konten biar tidak berbenturan dengan script iklan. Semoga bermanfaat dan hingga jumpa kembali.
Comments
Post a Comment