Menampilkan rumus matematika di blog: editor visual

Posting kali ini sebenarnya sama dengan posting sebelumnya, hanya saja ini caranya lebih mudah, apalagi bagi orang awam yang tidak tahu dengan programming web. Sebenarnya prinsipnya sama, hanya disini disediakan oleh server http://www.codecogs.com/latex/eqneditor.php sebagai penyedia gratisan. Server ini merupakan server aplikasi berbasis php, sehingga telah disediakan tombol-tombol secara visual mengenai, lambang-lambang matematika selanjutnya secara otomatis dikonversi ke latex. Saat anda membuat rumus secara visual ataupun langsung dengan kode latex, kode html tersedia secara otomatis pula, dengan demikian tinggal dikopas ke halaman blog dengan menggunakan editor non visual atau html.

Testing

Pertama belajar dulu bagaimana cara kerjanya. Silakan buka brower selanjutnya masuk ke penyedia server latex dengan klik disini.

Hmm, para pengguna harus mengucapkan terimakasih kepada penyedia jasa ini secara gratisan. Kalau anda punya duit yah silakan beramal dengan mengklik “Donate”, biasanya berapapun diterima. Disini akan saya jelaskan masing fungsi bagian-bagian halaman web seperti gambar diatas. Aplikasi ini menganut WYSIWG (diucapkan / wɪziwɪɡ /) adalah singkatan dari What You See Is What You Get (Arti : Apa Yang Anda Lihat Adalah Apa Yang Anda Dapatkan), jadi sangat mudah penggunaannya.

Bagian-bagian dari halaman web untuk mengasilkan rumus latex secara visual adalah:

  1. Bagian teratas adalah tombol-tombol visual, seperti yang tampil di microsoft word equation, jadi anda tentunya sudah terbiasa dengan tombol ini. Hanya saja setiap penekan tombol akan diikuti munculnya kode latex dibagian bawahnya.
  2. Bagian ini akan muncul secara otomatis kode-kode latex, namun anda diijinkan mengeditnya secara manual jika anda piawai dengan kode-kode latex. Biasanya untuk menambahkan kode sederhana dilakukan secara manual pada bagian ini. Kursor harus selalu diarah kebagian mana yang akan disisipkan kode latex, kadang harus mem-bloknya jika diperlukan misalkan untuk menggiring ke integral, dlsb. Pada bagian ini diperbolehkan mengkustom jenis huruf, background, warna, dst, dengan menggunakan puldown menu dibawahnya.
  3. Berisi kode-kode tag html hasil dari penulisan rumus. Ini muncul secara otomatis, kalau bukan web programmer sebaiknya jangan utak-atik kode html ini. Namun anda masih diperkenankan jenis apa yang akan ditampilkan, formatnya bisa anda pilih di puldown menu  “Html (Edit)”. Cara yang tepat untuk blog wordpress akan dijelaskan dalam contoh berikut ini. Untuk wordpress, gunakan insert image dalam halaman, untuk itu anda harus memilih puldown menu ini sebagai pilihan URL
  4. Sekali klik icon ini, maka anda sama dengan mengkopi semua isi dalam kotak kode html (3). Jadi tidak perlu sorot untuk select all.
  5. Sama dengan point 4, hanya yang dikopi adalah kode latex murni, mungkin anda memerlukannya untuk dimasukkan kedalam editor latex misalnya.

Saya sarankan utak-atik dulu, untuk membangkitkan rumus matematika sesuai dengan kehendak anda. Jika sudah yakin bisa, dilanjutkan ke pembahasan berikut ini, bagaimana menempelkan dalam posting wordpress.

Langkah-langkah penggunaan

Buatlah rumus langsung dari link ini. Dalam contoh disini saya membuat rumus seperti yang terlihat dalam gambar berikut ini.

Nampak bahwa image rumus muncul otomatis, kalau anda menginginkan untuk mendownload rumus dalam bentuk image bisa diklik link “Click here to Download Image (GIF)”. 

Bagaimana cara menempelkan ke halaman wordpress ?

Tentunya anda masuk dulu sebagai pemilik blog wordpress. Untuk menyisipkan kedalam halaman posting misalnya, anda tinggal mengkopi dengan meng-klik icon kopi (4), namun dipilih modenya adalah URL pada puldown menu. Sebaiknya editor dalam mode visual, kemudian sorot dimana lokasi penempatannya, kemudian insert image. Yang dimasukkan bukan file image dari komputer anda atau di galery wordpress, akan tetapi klik “From URL“, kemudian pastekan kode html tersebut (sekali lagi mode URL), ke isian image URL. Selanjutnya tekan tombol “Link to Image” untuk memastikan gambar sudah siap. Terakhir tekan tombol Insert to Post. Jadi hal ini sama dengan menginsert image namun dari URL, dengan memasukkan link tersebut.

Berikut ini setelah ditempelkan akan terlihat sebagai berikut:

Sekian posting saya, mudah -mudahan bermanfaat.

 

Last updated by at .

Avatar of Bambang Siswoyo

About Bambang Siswoyo

I am a college lecturer since 1988 at UB (University of Brawijaya) in the electronics department. My experience: Applications of Microprocessor system, Applications of Control System, Applications of Field Programmable Gate Array, Computer Programming in computer instrumentations. My hobby: Music especially playing the saxophone, hiking and exploring the countryside.
This entry was posted in Utak atik, Web and tagged , , . Bookmark the permalink.

2 Responses to Menampilkan rumus matematika di blog: editor visual

  1. nah kalau yang ini bener2 joss pak.. “what you see what you get” dan “user friendly”

Leave a Reply

Your email address will not be published. Required fields are marked *

CAPTCHA Image

*

You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>