Cara Membuat Textarea Keren Di Blog

1 komentar

Textarea adalah area atau tempat untuk meletakkan atau menyimpan teks atau tulisan-tulisan lainnya yang kita anggap penting.

Biasanya Textarea dipasang pada artikel berjenis tutorial dan dipakai untuk menyimpan kode HTML yang tidak bisa di tulis langsung ke dalam postingan di blog.

Jadi, dengan membuat Teksarea, kita akan mempermudah pengunjung Blog untuk mengcopy seluruh isi teks yang terdapat dalam Textarea tersebut.

Ada banyak artikel tutorial dan jenis-jenis Textarea yang diunggah oleh teman-teman blogger. Dan disini kami pilihkan salah satunya yang penampilannya cukup simpel namun elegan sekaligus bisa memperindah postingan.

Urutan Kerja :

1. Masuk ke Dasbor Blog agan dan klik menu "Template".

2. Berikutnya klik tombol "Edit HTML".

3. Cari tag  ]]></b:skin> atau </style> .

3. Sorot dan Copy Kode Skrip dibawah :

#border-text{
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
-o-border-radius: 1px;
background-color: #009abf;
border-top: 5px solid #009abf;
border-bottom: 5px solid #009abf;
border-radius: 1px;
width:100%;
height: auto;
overflow: auto
}
.text{
background-color: #000;
color: #fff;
font: normal 15px Georgia,Monospace;
margin: 0 20px 0 20px;
overflow: auto;
padding: 20px;
border-left: 2px solid #fafafa;
border-right: 2px solid #fafafa;
text-align: left
}

4. Kemudian Paste / salin Kode Skrip itu tepat sebelum / diatas tag  ]]></b:skin> atau </style>  tadi.

5. Klik tombol "Simpan Template" kemudian klik tombol "Kembali".

6. Selanjutnya klik tombol "Entri Baru".

7. Buatlah sebuah artikel baru pada mode Compose / mode biasa.

8. Ketika tulisan agan tiba pada bagian dimana agan akan mengunggah Kode Skrip, rubahlah mode postingan agan menjadi Mode HTML (ingat !, mode HTML).

9. Langkah berikutnya, sorot dan Copy Kode Skrip dibawah :

<div id="border-text">
<div class="text">
ISI KODE SKRIP DISINI
</div>
</div>

10. Dan Paste / salin Kode Skrip diatas pada halaman postingan dalam mode HTML tersebut.

11. Langkah selanjutnya, rubah kembali mode postingan agan ke dalam mode Compose.

12. Hapus teks "ISI KODE SKRIP DISINI" dan ganti dengan Kode Skrip yang agan inginkan.

13. Lakukan tindakan "Pratinjau" terlebih dahulu untuk memastikan artikel agan tidak memiliki kesalahan ejaan maupun salah ketik dan semua menu "Label", "Jadwal, "Deskripsi Penelusuran" sudah terisi dengan benar. Jika semuanya beres, baru klik tombol "Simpan" / "Publikasikan"

14. Selesai.

15. Bagi agan / aganwati yang mau tahu seperti apa demo / penampakan Textarea ala Masih Newbie  ini tidak usah repot-repot. Textarea dalam postingan ini adalah contoh penampakannya. 

Terima kasih buat kunjungan agan dan jangan lupa kasih komen, yaa... tapi dilarang nyepam !.

Source Code : http://bulshitman.blogspot.co.id/2016/03/cara-membuat-text-area-keren-highlight.html