Cara menulis / memasukkan kode HTML ke Postingan Blog supaya Tetap Utuh dan Rapih

Salam blogger.
Pada tutorial kali ini saya akan mencoba share sebuah trik atau tips bagaimana Cara menulis / memasukkan kode HTML ke Postingan Blog supaya Tetap Utuh dan Rapih. Sebenarnya jika kita ingin menulis / memasukkan kode HTML ke Postingan Blog itu sangat mudah, kita hanya tinggal pharse kode html terlebih dahulu dan memasukkannya ke postingan pada post editor pilih HTML bukan Compose.

Bagaimana cara pharse kode HTML sebelum diCopy ke postingan blog?
  1. Buka ini
  2. Copy kode HTML yang akan dipharse
  3. KLik CONVERT TO AD CODE
  4. Klik HIGHTLIGHT ALL lalu tekan CTRL+C (copy)
  5. Masukkan ke postingan blog dalam Post Editor HTML bukan COMPOSE
  6. Save. Coba lihat perubahan

Nah, berdasarkan pengalaman ketika saya melakukan langkah di atas kebetulan kode yang saya pharse itu lumayan panjang dan hasilnya kode tersebut memanjang satu baris tidak membentuk sebuah paragraf. Nah untuk mengatasi permasalahan tersebut, kamu bisa ikuti langkah di bawah ini :

  1. Seperti biasa masuk ke Template pilih Costumize /Sesuaikan
  2. Pilih Tingkat lanjut / Advanced
  3. Masukkan kode di bawah ini ke kotak Tingkat lanjut / Advanced tersebut yang terletak di sebelah kanan
    *::-moz-selection {
        background-color: #FE4365;
        color: #FFF;
    }
    
    elemen {
    }
    code {
        padding: 2px 4px;
        color: #D14;
        white-space: nowrap;
        background-color: #F7F7F9;
        border: 1px solid #E1E1E8;
    }
    
    elemen {
    }
    pre {
        display: block;
        padding: 9.5px;
        margin: 0px 0px 10px;
        font-size: 13px;
        word-break: break-all;
        word-wrap: break-word;
        white-space: pre-wrap;
        background-color: #F5F5F5;
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 4px;
    
  4. Klik Save / Terapkan ke Blog
Nah, nanti dalam penulisan kode HTML kamu hanya tinggal menambahkan
kode <pre> dan </pre>
Contoh : <pre> di sini Kode HTML kamu </pre>

Cara Penulisan

Untuk contoh hasilnya lihat saja pada penulisan kode pada blog ini. 

OK, pembuatan kolom sebagai pembungkus kode HTML tersebut sebenarnya hanya untuk merapikan dan mempercantik penulisan kode di postingan blog kamu. Semoga postingan Cara menulis / memasukkan kode HTML ke Postingan Blog supaya Tetap Utuh dan Rapih bisa bermanfaat.
Share it:

Artikel Terpopuler