Hanya arsip

halaman asli ada di http://kolom-tutorial.blogspot.com

Mengatur Perataan Posting Artikel

Sudah dua kali pertanyaan ini muncul pada shoutbox, salah satunya
seperti ini :

“mas,gimana cara bikin rata kanan agar postingnya jadi rapi …. thx”

Sebenarnya tentang cara posting artikel sudah saya bahas pada postingan terdahulu, jika mau iseng coba baca di sini, akan tetapi biar lebih faham, sengaja saya posting lagi agar lebih jelas.


Untuk membuat perataan (align), baik rata kiri, kanan, kiri-kanan, atau mau tengah-tengah semuanya, bisa dengan dua cara tergantung dari kebiasaan sobat saat posting artikel, apakah biasa pakai menu Compose atau Edit HTML. Oleh karena itu akan saya bahas untuk keduanya.

Untuk menu Compose

Pada menu compose sebenarnya ini lebih mudah, sebab untuk membuat perataan sudah di sediakan tool (peralatan) yang sama dengan yang ada di Microsoft Word atau Exel, icon tool nya seperti ini :

–> Untuk merubah jenis hurup yang di gunakan

–> Untuk merubah ukuran hurup (heading)

–> Untuk Menebalkan hurup

–> Untuk memiringkan hurup

–> Untuk merubah warna hurup

–> Untuk membuat link

–> Untuk membuat artikel menjadi rata kiri

–> Untuk membuat tulisan menjadi di tengah

–> Untuk membuat artikel menjadi rata kanan

–> Untuk membuat artikel menjadi rata kiri dan rata kanan

–> Untuk membuat sub bahasan oleh angka

–> Untuk membuat sub bahasan oleh bullet

–> Untuk mengecek spelling

–> Untuk memasukan gambar(upload gambar)

–> Untuk membuat artikel dalam kode HTML

–> Untuk membuat artikel dalam mode Compose (biasa)

–> Untuk me review (melihat) artikel

Cara agar artikel bisa rata kanan yaitu Highligh (blok) seluruh artikel yang di buat, lalu klik icon yang untuk rata kanan saja. Bila ingin rata kanan-kiri, rata kiri atau tengah semua, caranya ya sama yaitu tinggal Highligh (blok) seluruh artikel yang di buat, trus ya klik icon yang sobat mau pake, kelar deh. Selanjutnya ya tinggal publish, mudah bukan?

Akan tetapi bagi sobat yang memakai system Read more yang memakai kode <span class=”fullpost”>, memposting artikel artikel dengan memakai menu Compose sering menemui masalah di akibatkan jika di lihat pada menu Edit HTML akan muncul kode tadi di atas dalam jumlah yang banyak tanpa kita tuliskan sehingga sistem read more menjadi tidak bekerja dengan baik, oleh karena alasan tadi sistem
read more yang saya ajarkan di blog ini adalah dengan memakai kode <div class=”fullpost”> yang relatif lebih aman.

Untuk menu Edit HTML

Bagi sobat yang terbiasa memakai Edit HTML bisa juga membuat perataan, baik kiri, kanan, kiri-kanan, ataupun tengah semua, yaitu caranya dengan menambahkan kode HTML di awal dan akhir artikel, kodenya seperti ini :

Rata kiri :

<div align=”left”>

isi artikelnya di sini

</div>

Rata kanan :

<div align=”right”>

isi artikelnya di sini

</div>

Rata kiri-kanan :

<div align=”justify”>

isi artikelnya di sini

</div&gt

Supaya tengah semua :

<div align=”center”>

isi artikelnya di sini

</div&gt

Agar hasilnya kelihatan, saya berikan contoh dengan mengutif isi artikel di blog ini.

Contoh cara membuatnya seperti ini :

Untuk yang rata kiri :

<div align=”left”>
Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan. Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk hal-hal yang baik,Terima kasih.
</div>

Maka hasilnya akan seperti ini :

Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan. Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk hal-hal yang baik,Terima kasih.

Untuk yang rata kanan :

<div align=”right”>
Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan. Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk hal-hal yang baik,Terima kasih.
</div>

Maka hasilnya akan seperti ini :

Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan.
Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan
dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal
membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk
hal-hal yang baik,Terima kasih.

Untuk yang rata kiri-kanan :

<div align=”justify”>
Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan.
Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan
dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal
membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk
hal-hal yang baik,Terima kasih.
</div>

Maka hasilnya akan seperti ini :

Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan.
Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan
dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal
membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk
hal-hal yang baik,Terima kasih.

Untuk yang tengah semua :

<div align=”center”>
Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan.
Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan
dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal
membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk
hal-hal yang baik,Terima kasih.
</div>

Maka hasilnya akan seperti ini :

Terima kasih kepada saudaraku Abu Amin yang telah mengingatkan.
Kepada para sobat semua, saya menghimbau tolong ilmu yang didapatkan
dari blog ini jangan di gunakan pada hal-hal yang tidah baik, semisal
membuat situs porno dan lain sebagainya. Gunakanlah ilmu sobat untuk
hal-hal yang baik,Terima kasih.

Untuk yang bullet & numbering, ini bisa juga dilakukan :

contohnya seperti ini :

Bullet saja :

<li>Sig in di blogger dengan id sobat </li>
<br/>
<li>Klik menu layout </li>
<br/>
<li>Klik menu Edit HTML </li>

Hasilnya seperti ini :

  • Sig in di blogger dengan id sobat
  • Klik menu layout
  • Klik menu Edit HTML
  • Bullet yang menjorok ke tengah :

    <ul>
    <li>Sig in di blogger dengan id sobat </li>
    <br/>
    <li>Klik menu layout </li>
    <br/>
    <li>Klik menu Edit HTML </li>
    </ul>

    Hasilnya seperti ini :

    • Sig in di blogger dengan id sobat
    • Klik menu layout
    • Klik menu Edit HTML

    Yang memakai nomor :

    <ol>
    <li>Sig in di blogger dengan id sobat </li>
    <br/>
    <li>Klik menu layout </li>
    <br/>
    <li>Klik menu Edit HTML </li>
    </ol>

    Hasilnya seperti ini :

    1. Sig in di blogger dengan id sobat
    2. Klik menu layout
    3. Klik menu Edit HTML

    Untuk warna :

    <span style=”color:kode warna”>
    tulisan yang mau di warnai
    </span>

    contoh untuk warna merah :

    <span style=”color:red”>
    ini contoh merah
    </span>

    hasilnya seperti ini :


    ini contoh merah

    atau bisa juga seperti ini :

    <span style=”color:#FD0303″>
    ini contoh merah
    </span>

    Hasilnya tetap sama :


    ini contoh merah

    untuk mengetahui kode warna sangat gampang, sobat bisa menggunakan bantuan program photosop,
    sobat tinggal sorot warna yg di kehendaki, nanti kode warnanya akan di tampilkan.

    Kode-kode diatas tidak hanya berlaku pada postingan saja, akan tetapi berlaku juga
    pada edit HTML untuk kode template.

    Saya kira cukup sekian dulu, kalau kepanjangan bosen bacanya kan ?

    Selamat ngeblog buat semuanya !

    Iklan

    3 Juli 2007 - Posted by | blog tutorial

    15 Komentar »

    1. trims …

      Komentar oleh eRwiN | 11 Juli 2007 | Balas

    2. thanks ….

      Komentar oleh sanggara | 7 Oktober 2007 | Balas

    3. ok….

      Komentar oleh ihsan | 22 November 2007 | Balas

    4. thanks..

      Komentar oleh Zoel_GeBe | 2 Desember 2007 | Balas

    5. Trims Bgt…

      Komentar oleh Rinaldi | 7 Januari 2008 | Balas

    6. Nuhun pisan kang rohman Berhasil

      Komentar oleh RAMKUR | 31 Maret 2008 | Balas

    7. klo mo bikin text postingan sama rata dgn gambar gmn sih bang ? udah upload dr blogger small size trus imagenya dirata kiri/kanan tp ga berhasil. textnya tetep ada dibawah gambar. Padahal sering liat blogspot yang postingannya gambarnya rata sama textnya.

      Komentar oleh mae | 17 April 2008 | Balas

    8. pada saat upload gambar, ada pilihan layout… pilih yang kiri, nanti gambarnya akan otomatis ada di sebelah kiri dan sejajar dengan tulisan.

      Komentar oleh Rohman | 17 April 2008 | Balas

    9. Blog artikel yang bermutu!!! Pasti saya akan kembali mengunjungi. Thanks!!!

      Komentar oleh doanco | 9 Mei 2008 | Balas

    10. hade euy đŸ˜›

      Komentar oleh yoga permana kusumah | 25 Juni 2008 | Balas

    11. hatur tenk kyu bwt ilmunya, link dunk pny ku

      Komentar oleh toni | 9 Juli 2008 | Balas

    12. Thanks infonya,

      Komentar oleh yendra | 30 Juli 2008 | Balas

    13. thanks infonya kang, yang saya masih bingung gmn caranya agar menu side bar nya yang rata dan gak acak-acakan..? tolong review blog ku yg lg belajar kang..

      Komentar oleh yendra | 30 Juli 2008 | Balas

    14. trims kang…

      Komentar oleh fadli | 20 Agustus 2008 | Balas

    15. kang, sy mau neruskan pertanyaannya Mae:
      mungkin yg diinginkan adalah bagaimana teks artikel kita bisa ada dan bisa rata di samping gambar. Supaya teksnya tidak di bawah gambar. Mohon penjelasannya. Salam

      Komentar oleh Prihandoko | 29 Agustus 2008 | Balas


    Tinggalkan Balasan

    Isikan data di bawah atau klik salah satu ikon untuk log in:

    Logo WordPress.com

    You are commenting using your WordPress.com account. Logout / Ubah )

    Gambar Twitter

    You are commenting using your Twitter account. Logout / Ubah )

    Foto Facebook

    You are commenting using your Facebook account. Logout / Ubah )

    Foto Google+

    You are commenting using your Google+ account. Logout / Ubah )

    Connecting to %s

    %d blogger menyukai ini: