Menampilkan kode HTML pada postingan blog

Anda tengah kesulitan menampilkan kode-kode HTML pada blog yang menyajikan tutorial HTML? Ini dia cara membuatnya tampil sebagaimana Anda inginkan pada postingan blog tutorial Anda.

Langkah pertama

Meluncurlah ke Dashboard > Design > Edit HTML. Carilah tag kode ]]></b:skin>, dan tambahkan kode di bawah ini di atas tag kode tersebut

          pre { background:#efefef; 

          border:1px solid #A6B0BF; 

          font-size:120%; 

          line-height:100%; 

          overflow:auto; 

          padding:10px; 

          color:#000000 } 

          pre:hover { 

          border:1px solid #efefef; } 

          code { 

          font-size:120%; 

          text-align:left; 

          margin:0;padding:0; 

          color: #000000;} 

         .clear { clear:both; overflow:hidden; }

Cobalah preview untuk memastikan kode-kode telah sesuai, kemudian Save.

Langkah kedua

 

Saatnya beraksi! 

Sekarang untuk membuat postingan yang di dalamnya terdapat kode HTML untuk ditampilkan, Anda perlu mengubah kode tersebut terlebih dahulu ke dalam karakter yang dapat dilewatkan (escapable characters). Untuk itu pakailah perangkat pada situs yang diberi nama Quick Escape. Masukkan kode yang Anda ingin tampilkan apa adanya ke dalam kolom yang tersedia. Selanjutnya klik "Convert to escaped character" untuk mendapatkan kodenya.

Selamat mencoba!

Sumber: blogkori.com

Menyembunyikan tampilan tanggal, waktu, dan pengarang pada postingan blog

Ada kalanya kita merasa perlu menghilangkan beberapa tampilan default ini pada blog untuk memberikan kesan lebih luas, personal, atau sekadar tidak ingin diketahui kapan kita mengeposkan tulisan :)

 

1. Nama-nama menu pada instruksi ini sesuai pada Blogger dengan pilihan bahasa Inggris

2. Masuklah pada Dashboard, pilih Design pada kolom Manage Blogs

Tampilan pada Dashboard kolom Manage Blog

3. Tekan Edit HTML, dan beri centang pada  Expand Widget Template untuk memunculkan semua instruksi HTML secara lengkap.

tampilan layar Edit HTML

4. Download terlebih dahulu pada link Download Full Template jika Anda tak yakin dengan perubahan yang akan didapatkan.

Untuk menyembunyikan tampilan tanggal

Carilah pada kode HTML

<data:post.dateHeader/>

hilangkan kode tersebut.

Simpan Template dan preview perubahan blog Anda sekarang.

Untuk menyembunyikan tampilan waktu posting

Carilah pada kode HTML

<span class='post-timestamp'> 

<b:if cond='data:top.showTimestamp'> 

<data:top.timestampLabel/> 

<b:if cond='data:post.url'> 

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'>

<abbr class='published' expr:title='data:post.timestampISO8601'>

<data:post.timestamp/>

</abbr></a> 

</b:if> 

</b:if> 

</span>

Hapus kode tersebut.

Simpan Template dan preview perubahan blog Anda.

Untuk menyembunyikan tampilan nama pengarang

Carilah pada kode HTML

<span class='post-author vcard'> 

<b:if cond='data:top.showAuthor'>

<data:top.authorLabel/>

<span class='fn'><data:post.author/></span>

</b:if>

</span>

Hapus kode tersebut.

Simpan template dan preview perubahannya.

Sumber: bloggertipandtrick.net