DIV Keren untuk Tampilkan Code

Rasanya gatal jemari ini kalau nggak posting dan berbagi hasil utak-atik script untuk mempercantik blog. Sebelumnya Sakahayang sudah berbagi Bikin Textarea Cantik untuk Code. Bila sobat sudah ada yang mempraktekannya, apakah anda tahu textarea  ada kelemahannya ?


Bila anda jeli, dalam textarea kita tidak bisa menulis code script yang ditampilkan dalam textarea berwarna merah atau style font lainnya seperti bold, italic dsb.  Padahal dengan memberi warna pada code script ini sangat membantu para pembaca.

Dengan menggunakan tag div kelemahan itu bisa kita atasi dan hasilnya sama kerennya dengan menggunakan textarea.  Berikut hasil utak-atik iseng DIV Keren untuk Tampilkan Code  untuk mempresentasikan code script dalam konten blog.

.divkeren:hover{background:#82cafa}

   1.     Login ke dasbor anda

   2.     Pilih Template ==> Edit HTML => Lanjutkan  tidak perlu mencentang Expand Template Widget

   3.     Cari code ]]>  

   4.     Copy code berikut dan paste tepat di atas ]]>

   5.     Ganti URL image background dengan image milik anda.

   6.     Simpan template

   7.     Tutup editor Template

   8.   

            

.  divkeren {background:#82cafa;background- image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUj-FhKu4rBlAfe4CBkXoLfnEzCimtuf1mC1ImsTgZTHliJzNnWkIoSMIH5KBxTf53m2SFueqkubJqJYcUOMxeQD9qpUdWmQ7OGkI3acJmFXKFXueLJgF2AgHo_pqZOdSKeLPeo34eMkFq/h120/akram.gif);background-repeat:no-repeat;border:solid #B24700;color:#000;font:13px 'Courier New', Courier, monospace;line-height:16px;max-height:200px;min-height:16px;overflow:auto;width:90%;border-width:1px 1px 1px 20px;padding: 10px; text-align: left;}

   .divkeren:hover{background:#82cafa}

      

=

    9.     #82cafah adalah kode warna background, bisa anda ganti dengan warna kesukaan anda, kode    

        warna bisa lihat di  halaman Color Code.

   10.  Warna merah yang kedua adalah image transparan bisa menggunakan GIF atau PNG.

   11.  200px adalah tinggi div atau tinggi area untuk code script.

   12.  Kemudian pada content page atau postingan anda tulis kode div  dengan mode HTML, sedangkan code scriptnya yang akan ditampilkan bisa menggunakan mode Compose.

   13.  Selesai ,,,,

Tolong dibaca nih gan !

Kamu sedang membaca artikel tentang DIV Keren untuk Tampilkan Code dan kamu bisa menemukan artikel DIV Keren untuk Tampilkan Code ini dengan url http://zackybee7.blogspot.com/2012/03/r-asanyagatal-jemari-ini-kalau-nggak.html, kamu boleh menyebar luaskannya atau mengcopy paste-nya jika artikel DIV Keren untuk Tampilkan Code ini sangat bermanfaat bagi banyak orang, namun jangan lupa untuk meletakkan link DIV Keren untuk Tampilkan Code sebagai sumbernya.

Artikel terkait :