Minggu, 23 Januari 2022

Cara Menulis Rumus Persamaan di Blogger

Pernah gak sih kalian kepikiran mau menulis tentang hal-hal yang berbau ilmiah, yang mengharuskan untuk melampirkan persamaan-persamaan yang sederet persamaannya panjang minta ampun? Kalau tulisan kita dituangkan di Microsoft Word, mungkin bukan suatu hal yang sulit, karena Microsoft Word sendiri, terutama versi terbaru, telah memiliki fitur "equation" yang cukup powerful. Lalu bagaimana kalau tulisan tersebut mau dipublikasikan ke blog kesayangan kita? Padahal fitur editor blog, terutama blogger tidak memiliki fitur memasukkan simbol-simbol matematis tersebut.


Nah pada kesempatan kali ini, aku akan memberikan sefruit tutorial Cara Menulis Rumus Persamaan di Blogger. Yaps, tulisanku kali ini aku hanya fokuskan untuk rekan-rekan para pengguna Blogger/blogspot saja. Buat pengguna platform blogging lain mungkin bisa mengikuti. Bagaimana caranya? Ada tiga cara yang bisa kalian ikuti, yaitu cara easy, cara medium, dan cara expert :P

Melampirkan Rumus Persamaan sebagai Gambar

Terdengar sangat simpel, bukan? Persamaan-persamaan tersebut cukup kita jadikan gambar, kemudian kita lampirkan ke editor Blogger kita. Sounds weird, but it works. Bagaimana caranya?

Buat persamaannya terlebih dahulu di editor yang memiliki fitur Equation, di Microsoft Word misalnya. Setelah rumus persamaannya sudah jadi, cukup screenshot persamaan tersebut, potong gambar hasil tangkapan layar tersebut sehingga gambar tersebut hanya memuat persamaan yang ingin kita lampirkan. (Baca juga: Cara Mengambil Screenshot di Laptop)

Apakah ada alternatif lain selain menggunakan Microsoft Word? Google Docs, sebuah aplikasi Word Processing besutan Google ini ternyata memiliki fitur Equation yang lumayan dapat diandalkan. Bagaimana cara menggunakannya? Cukup membuat file Document baru, kemudian buka menu Insert, Equation. Setelah itu akan muncul Toolbar baru khusus mengolah persamaan yang ingin dibuat. Langkah selanjutnya pun sama, ketika persamaan sudah dibuat cukup screenshot persamaan hasil buatan kita tadi.

Google Docs dapat menjadi alternatif untuk menulis rumus persamaan.

Kelebihan

  • Sangat mudah diimplementasikan

Kekurangan

  • Lumayan memakan bandwidth, karena rumus persamaan berupa gambar
  • Terdapat background putih yang tidak transparan, sehingga kurang cocok dengan template Blogger yang memiliki background berwarna
  • Warna persamaan tidak dapat mengikuti warna template
Dikarenakan rumus persamaan berupa gambar, terdapat background putih di persamaan tersebut, sehingga kurang cocok untuk template blog yang memiliki background berwarna.

Menggunakan LaTeX Equation

LaTex merupakan bahasa markup yang ditujukan untuk menyusun sebuah dokumen yang memiliki penyusunan huruf tersendiri. Salah satu fitur LaTex yang sangat banyak diaplikasikan adalah fitur Equation-nya. Sifat LaTeX yang berupa bahasa markup pun membuat penyusunan persamaan menggunakan metode markup pula, sehingga menghasilkan fungsi equation yang ringan dan mudah diaplikasikan di berbagai platform, salah satunya di website.

Dalam menggunakan LaTeX Equation di Blogger, terdapat dua cara yang bisa diaplikasikan, yaitu dengan LaTeX to SVG image secara otomatis dan menggunakan plugin javascript.

LaTeX Equation to SVG

CodeCogs merupakan salah satu editor LaTeX Equation yang bersifat open-source, dan dapat diakses secara daring melalui link berikut ini. Salah satu fitur yang dimiliki CodeCogs adalah kita dapat membuat dan melampirkan persamaan tersebut berupa format gambar, tanpa harus repot-repot screenshot atau mengunduh gambar persamaannya satu per satu.

Bagaimana cara menggunakan fitur tersebut dan melampirkan persamaannya ke blogger kita? Pertama-tama buka dahulu editor.codecogs.com, lalu buatlah rumus persamaan yang ingin dilampirkan. Memang terkesan sulit digunakan, karena sistem pengeditannya berupa kode LaTeX itu sendiri. Namun kita tetap dapat melihat persamaan hasil jadinya untuk sementara di bagian bawah workspace.

LaTeX Equation Editor dari CodeCogs

Jika sudah selesai, klik tombol Export. Di sana akan muncul beberapa opsi output persamaan yang ingin digunakan, seperti format gambar, format output, ukuran resolusi, hingga warna background. Untuk melampirkan persamaannya di blog kita, pilih format gambar SVG dan output dengan HTML. Di bagian kotak berwarna kuning akan berisi kode HTML yang nantinya kita sematkan ke tulisan blog kita.

Setelah men-copy kode HTML tersebut, bukalah editor blogger di tulisan dimana persamaan tersebut ingin dilampirkan. Berhubung gambar persamaan yang kita miliki berupa kode HTML, maka ubahlah mode pengeditan menjadi HTML View, dengan mengklik gambar pensil di bagian paling kiri toolbar dan memilih HTML View. Memang tampilan editor langsung berubah menjadi sekumpulan kode-kode HTML yang cenderung bikin kepala pusing. Tetapi tak perlu menggaruk-garuk kepala karena kebingungan, cukup Paste kode HTML tadi di bagian paling bawah kode tersebut. Setelah kode tersebut di-Paste, kembalilah ke Compose View. Sontak di halaman editor kita akan tampil persamaan yang telah dibuat. Untuk mengatur tata letak dan ukuran bisa Anda atur layaknya mengatur gambar biasa di Blogger.


Kelebihan

  • Gambar persamaan berupa SVG yang tidak pecah jika diperbesar
  • Background transparan, sehingga cocok untuk background blog yang berwarna

Kekurangan

  • Warna persamaan tidak mengikuti template
  • Pembuatan persamaan terkesan sulit, apalagi untuk persamaan yang kompleks
Warna persamaan tidak mengikuti warna tulisan dari template, sehingga kurang cocok untuk blog bertema dark mode

Plugin MathJax

One of the best solution buat melampirkan rumus persamaan ke blogger adalah menggunakan plugin MathJax. Proses pembuatan persamaannya pun masih memanfaatkan LaTeX Equation, sehingga mau tak mau Anda harus berhadapan kode-kode equation yang memusingkan tersebut.

Bedanya dengan metode sebelumnya, kode yang kita masukkan ke halaman blog adalah berupa kode LaTeX itu sendiri, bukan kode HTML, sehingga tak perlu repot-repot ngubek-ngubek HTML View yang kodenya bejibun.

Bagaimana cara penggunaannya? Pertama-tama kita mesti mengintegrasikan plugin MathJax ke template blog kita. Caranya, di halaman awal Blogger, buka menu 'Theme'. Klik tanda panah bawah yang tepat bersebelahan dengan tombol 'Customize', kemudian pencet Edit HTML.

Setelah Edit HTML terbuka, carilah kode </head> dengan menekan Ctrl+F dan memasukkan kode tersebut di syntax pencarian. Setelah kode </head> ketemu, Paste-kan kode di bawah ini tepat berada di atas kode  </head> tadi. Simpan perubahan yang telah dilakukan. Plugin pun sudah terintegrasi dengan blog kita.

<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

Untuk menggunakan plugin, cukup menuliskan kode LaTeX Equation ke editor blog kita. Meskipun di editor hanya tampil berupa tulisan, tetapi setelah di-Publish/Preview persamaan akan muncul secara otomatis. O ya pastikan kode LaTeX-nya berformat Paragraph.

Untuk mendapatkan kode LaTeX-nya, lagi-lagi CodeCogs bisa menjadi alat bantu buat menghasilkan kode LaTeX sesuai dengan persamaan yang telah kita buat. Setelah menekan tombol Export, pilih format output menjadi LaTeX. Nah, di bagian kotak kuning tersebut berisi kode yang bisa Anda lampirkan ke halaman editor blog kita.


Kelebihan

  • Warna persamaan akan mengikuti warna tulisan template
  • Hemat bandwidth, karena persamaan bukan berupa gambar

Kekurangan

  • Bentuk persamaan tidak bisa dilihat disaat mengedit tulisan

Kelebihan menggunakan plugin MathJax adalah warna persamaan akan mengikuti template yang digunakan
 

***

Dari antara ketiga cara tersebut, pilih saja salah satu tutorial yang menurut Anda mudah untuk diikuti. Kalau aku pribadi, aku cenderung lebih memilih menggunakan plugin MathJax saja. Warna tulisan persamaan yang mampu menyesuaikan template blog itulah yang bikin aku lebih memilih cara tersebut meskipun harus mengubek-ubek kode HTML template blog, sehingga cocok dengan template blog ini yang memiliki fitur dark mode.

Demikianlah tutorial Cara Menulis Rumus Persamaan di Blogger. Semoga dapat bermanfaat bagi pembaca sekalian.

Posting Komentar

ads
avatar
Admin THE-Mangcoy Online
Welcome to THE-Mangcoy theme