Masih bingung?!! Sama, dong, he,.. he,… Begini saja, coba kita ketikkan tulisan dengan format seperti di bawah ini pada halaman pengetikan (post editor). Gunakan space bar untuk memberikan spasi sehingga tulisan menjadi menjorok ke dalam (ke kanan).
Indonesia tanah airku Tanah tumpah darahku Disanalah aku berdiri Jadi pandu ibuku Indonesia kebangsaanku Bangsa dan Tanah Airku Marilah kita berseru Indonesia bersatu Hiduplah tanahku Hiduplah negriku Bangsaku Rakyatku semuanya Bangunlah jiwanya Bangunlah badannya Untuk Indonesia Raya Indonesia Raya Merdeka Merdeka Tanahku negriku yang kucinta Indonesia Raya Merdeka Merdeka Hiduplah Indonesia Raya Indonesia Raya Merdeka Merdeka Tanahku negriku yang kucinta Bla,… bla,… Bla,… bla,… Bla,… bla,…
Coba sekarang terbitkan (publish) dan kemudian bukalah halaman postingan yang baru saja kita terbitkan tersebut. Kemudian perhatikan apakah yang terjadi dengan yang telah ketikkan tersebut? Pastinya spasi yang telah kita format sedemikian rupa akan menjadi hilang atau rata, seperti di bawah ini.
Indonesia tanah airku
Tanah tumpah darahku
Disanalah aku berdiri
Jadi pandu ibuku
Indonesia kebangsaanku
Bangsa dan Tanah Airku
Marilah kita berseru
Indonesia bersatu
Hiduplah tanahku
Hiduplah negriku
Bangsaku Rakyatku semuanya
Bangunlah jiwanya
Bangunlah badannya
Untuk Indonesia Raya
Indonesia Raya
Merdeka Merdeka
Tanahku negriku yang kucinta
Indonesia Raya
Merdeka Merdeka
Hiduplah Indonesia Raya
Indonesia Raya
Merdeka Merdeka
Tanahku negriku yang kucinta
Bla,… bla,…
Bla,… bla,…
Bla,… bla,…
Untuk mengatasinya, apitlah teks yang tidak ingin format spasinya berubah dengan kode <pre> dan </pre>. Contohnya, ketikkan seperti di bawah ini.
<pre>Indonesia tanah airku
Tanah tumpah darahku
Disanalah aku berdiri
Jadi pandu ibuku
Indonesia kebangsaanku
Bangsa dan Tanah Airku
Marilah kita berseru
Indonesia bersatu
Hiduplah tanahku
Hiduplah negriku
Bangsaku Rakyatku semuanya
Bangunlah jiwanya
Bangunlah badannya
Untuk Indonesia Raya
Indonesia Raya
Merdeka Merdeka
Tanahku negriku yang kucinta
Indonesia Raya
Merdeka Merdeka
Hiduplah Indonesia Raya
Indonesia Raya
Merdeka Merdeka
Tanahku negriku yang kucinta
Bla,… bla,…
Bla,… bla,…
Bla,… bla,…</pre>
Setelah itu, terbitkan postingan tersebut. Kemudian coba lihatlah hasilnya dan pastikan format spasinya tidak berubah, persis seperti yang kita ketikkan sebelumnya.
Hasilnya seperti di bawah ini.
Indonesia tanah airku Tanah tumpah darahku Disanalah aku berdiri Jadi pandu ibuku Indonesia kebangsaanku Bangsa dan Tanah Airku Marilah kita berseru Indonesia bersatu Hiduplah tanahku Hiduplah negriku Bangsaku Rakyatku semuanya Bangunlah jiwanya Bangunlah badannya Untuk Indonesia Raya Indonesia Raya Merdeka Merdeka Tanahku negriku yang kucinta Indonesia Raya Merdeka Merdeka Hiduplah Indonesia Raya Indonesia Raya Merdeka Merdeka Tanahku negriku yang kucinta Bla,… bla,… Bla,… bla,… Bla,… bla,…
APLIKASI UNTUK PEMPOSTINGAN KODE HTML
(KODE PEMROGRAMAN)
Bagi yang sering memposting kode html (kode pemrograman) ke dalam halaman postingan mungkin membutuhkan kode tersebut untuk menjaga agar format spasi sama persis dengan format aslinya.
Bingung, ya!! Sama donk,…
Begini saja,………..
Coba sekarang ketikkan kode html seperti di bawah ini. Buatlah dua postingan dengan cara yang berbeda.
<div class='post-body'> <b:if cond='data:blog.pageType == "item"'> <style>.fullpost{display:inline;}</style> <p><data:post.body/></p> <b:else/> <style>.fullpost{display:none;}</style> <p><data:post.body/></p> <a expr:href='data:post.url'>Readmore,..</a> </b:if> <div style='clear: both;'/> <!-- clear for photos floats --> </div>
Untuk postingan yang pertama, cobalah mempostingnya tanpa memberi kode <pre> dan </pre>. Seperti dibawah ini:
<div class='post-body'> <b:if cond='data:blog.pageType == "item"'> <style>.fullpost{display:inline;}</style> <p><data:post.body/></p> <b:else/> <style>.fullpost{display:none;}</style> <p><data:post.body/></p> <a expr:href='data:post.url'>Readmore,..</a> </b:if> <div style='clear: both;'/> <!-- clear for photos floats --> </div>
Sedangkan untuk yang kedua, buatlah postingan dengan menggunakan <pre> dan </pre> seperti dibawah ini.
<pre> <div class='post-body'> <b:if cond='data:blog.pageType == "item"'> <style>.fullpost{display:inline;}</style> <p><data:post.body/></p> <b:else/> <style>.fullpost{display:none;}</style> <p><data:post.body/></p> <a expr:href='data:post.url'>Readmore,..</a> </b:if> <div style='clear: both;'/> <!-- clear for photos floats --> </div> </pre>
Dengan cara yang pertama hasilnya menjadi seperti di bawah ini.
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Readmore,..</a>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Sedangkan cara yang kedua, hasilnya seperti di bawah ini.
<div class='post-body'> <b:if cond='data:blog.pageType == "item"'> <style>.fullpost{display:inline;}</style> <p><data:post.body/></p> <b:else/> <style>.fullpost{display:none;}</style> <p><data:post.body/></p> <a expr:href='data:post.url'>Readmore,..</a> </b:if> <div style='clear: both;'/> <!-- clear for photos floats --> </div>
Tentunya, kita lebih suka dengan hasil yang kedua kan di mana format kode html-nya persis seperti kode aslinya sehingga para pengunjung lebih mudah dalam memahaminya.
Selamat Mencoba!!!
Tidak ada komentar:
Posting Komentar