Pertama: pasang html di teplate blog amp masbrur
Kedua: pasang lagi kode html di postingan yang mode html bukan yang compose.
Ketiga: agar tidak ketik ulang kode yang kedua tiap mau bikin highlight pastekan di setting post dan komentar.
Oce kita bahas yang Pertama:
Bagi blogger android seperti kita masbrur, edit html ini Cukup merepotkan tapi bukan berarti tidak bisa ya..! Syaratnya masbrur harus pasang quickedit di hp android masbrur.
Buka dashboard blog masbrur lalu donload tema blog kita. Selanjutnya buka tema menggunakan quickedit, kemudian cari /style Setelah ketemu geser keatas sampai masbrur melihat kode /*, Setelah ketemu kopi kode dibawah ini dan pastekan diatas /* tadi, kalau belum jelas lihat gambar. Setelah di paste simpan dan upload tema yang baru kita edit.
/* CSS Syntax Highlighter */ pre{-webkit-user-select:text;-khtml-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;padding:0;margin:.5em auto;white-space:pre;word-wrap:break-word;overflow:auto;background-color:#443e50;position:relative;padding-top:33px;width:100%;-moz-tab-size:2;-o-tab-size:2;tab-size:2;word-break:normal;-webkit-user-select:text;-khtml-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;border-radius:3px;} pre::-webkit-scrollbar,pre::-moz-scrollbar,pre code::-webkit-scrollbar,pre code::-moz-scrollbar,code::-webkit-scrollbar,code::-moz-scrollbar {display:none;} pre::before{font-size:15px;font-weight:700;content:attr(title);position:absolute;top:0;padding:9px 0;left:0;right:0;color:#ffffff;display:block;margin:0;text-indent:15px} pre:after{display:inline-block;content:"\f121";font-family:fontAwesome;font-style:normal;font-weight:normal;font-size:18px;color:#ffffff;top:0;right:0;padding:9px 14px;position:absolute} pre code{display:block;background:none;border:none;color:#bec3ce;padding:25px 20px 20px 20px;font-family:'Source Code Pro',Menlo,Consolas,Monaco,monospace;font-size:.83rem;white-space:pre;overflow:auto} code .token.important {font-weight:bold;} code .token.entity {cursor:help;} code {font-family:Consolas,Monaco,'Andale Mono',monospace;white-space:initial;word-spacing:normal;word-break:normal;font-size:14px;line-height:1.3em} code{color:#BC587E} pre mark,code mark,pre code mark {background-color:#3498db;color:#fff;padding:2px;margin:0 2px;border-radius:2px;} pre[data-codetype="CSSku"]:before,pre[data-codetype="HTMLku"]:before, pre[data-codetype="JavaScriptku"]:before,pre[data-codetype="JQueryku"]:before{background-color:#22A7F0;box-shadow:inset 0 0 0 1px #ffffff;} Selanjutnya langkah Kedua: Masukkan kode di bawah ini dalam mode HTML postingan masbrur yang di samping compose ya.
<pre data-codetype="HTMLku" title="HTML"><code class="language-markup"> Isi HTML Masbrur </code></pre> Yang warna kuning ganti dengan html yang akan di beri highlight, Setelah selesai jangan lupa simpan dan pratinjau hasilnya.
Langkah terakhir: agar masbrur tidak mempaste kode yang ada di langkah kedua berulang ulang di setiap membuat post yang ada kode html, paste juga di template entry pada menu setting, post dan komentar. Lihat gambar.
1 tips terakhir Ni masbrur, kalau masbrur mau membuat text ada bagrond warna kuning didalam kode html, masbrur tinggal menambah
<mark>text</mark> (untuk membuat text berwarna kuning)
<b>text</b> (untuk bold)
<i>text</i> (untuk italic atau miring)
Itulah tadi masbrur cara membuat haighlight di postingan blog valid amp, semoga bermanfaat ya masbrur, makin banyak share makin tau.. 😊,
Cari makan buat kekasih
Cukup sekian dan terimakasih 😉.
