Disain Grafis, Tips dan Triks

Cara Mengatasi Teks Artikel Yang Melewati Kolom Post di Blog

Pada tutorial blog sebelumnya saya pernah share cara membuat garis pembatas antara postingan dan sidebar. Anda pasti sering melihat blog lain dimana teks/tulisan yang berada di ruang posting menembus kotak postingan, jadi konten artikel yang seharusnya berada di bidang posting (tempat anda menulis artkel) terlihat melewati batas area posting sampai menembus ke sidebar kanan. Tentu saja tampilan teks yang semestinya secara otomatis berpindah ke bawah setelah sampai ke garis batas area posting malah melewati jalur postingan, jadi terlihat tidak rapi. Mengapa konten artikel bisa melewati bidang posting? Mungkin disebabkan kurang menambahkan kode pemutus teks (word-wrap:break-word;) pada elemen post di template blog.

Biasanya yang melewati batas bidang posting jika anda membuat postingan yang berisi kode script yang formatnya tanpa spasi. Dengan menambah kode word-wrap:break-word; maka ketika teks atau kode script sudah mencapai garis pembatas kolom post akan dipindahkan secara otomatis pada alinea baru.

Cara Memperbaiki Konten Artikel Yang Menembus Area Posting
1. Login ke blogger
2. Pilih Template => Edit HTML
3. Tekan Ctrl+F dan cari kode .post misalnya kodenya seperti ini

.post{text-align:left;background:#fff;font-size:14px;margin:0;padding:0;position:relative;}

4. Lalu tambahkan kode word-wrap:break-word; dibelakangnya seperti berikut ini :

.post{text-align:left;background:#fff;font-size:14px;margin:0;padding:0;position:relative;word-wrap:break-word;}

5. Simpan

Dengan menambahkan kode word-wrap:break-word; maka teks panjang tanpa spasi maupun kode script tidak akan melewati kolom post karena akan langsung terpotong dengan sendirinya dan berpindah ke bawahnya.