Sering kali penulis blog kesulitan dalam menulis equation. Berikut beberapa hal yang dapat terjadi dalam penulisan equation di dalam blog
- equation sering ditulis menggunakan teks misalnya x^2+x+2, (x+2)^(x+1) hal ini menyusahkan pembaca dalam mengartikan maksudnya. Cara ini sebaiknya dihindari terlebih lagi untuk penulisan equation yang lebih kompleks. Misalkan $\int_{a}^{b}f(x)\mathrm{d}x$
- equation dapat di inputkan dalam bentuk image (jpg, png, gif, dll). Kelemahan dari cara ini: image akan lebih tinggi dari teks jika ditempatkan inline, image terlalu besar atau kecil sehingga susah dalam penempatan kecuali diposisikan center, image kurang jelas/blur
- equation ditulis menggunakan javascript cara ini dapat menuliskan formula dengan baik. Kelemahannya ada beberapa blog dengan formula yang ditulis dengan javascript menjadi terpotong. Ada beberapa javascript library dua diantaranya adalah mathjax atau katex
Berikut akan diulas langkah-langkah penulisan equation menggunakan mathjax atau katex. Ada beberapa platform blog antara lain wordpress.com, wordpress.org, dan blogger. Kali ini akan kita bahas penulisan equation pada wordpress.org, dan blogger.
Pastikan anda sudah mempunyai blog jika belum anda dapat melihat cara membuat blog. mathjax atau katex mempunyai kelebihan masing-masing. mathjax mempunyai fitur yang lebih lengkap sedangkan katex mempunyai render (kecepatan menampilkan formula) lebih cepat.
Mathjax
Berikut adalah script yang diperlukan untuk menggunakan mathjax
<script>
MathJax = {
tex: {inlineMath: [['$', '$'], ['\\(', '\\)']]}
};
</script>
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js">
</script>
Katex
Berikut adalah script yang diperlukan untuk menggunakan katex
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
delimiters: [
{left: "$$", right: "$$", display: true},
{left: "$", right: "$", display: false},
{left: "\\(", right: "\\)", display: false},
{left: "\\[", right: "\\]", display: true}
]
});
});
</script>
Konfigurasi blog untuk menampilkan formula
Untuk blogger
Buka blog anda dalam mode html dengan cara pilih theme-html kemudian cari bagian <head>, anda dapat melakukannya manual atau ctrl-F kemudian copy script diatas dan paste diatas <head>
Gambar tersebut sudah dipaste script mathjax. Jangan lupa tekan save
Untuk wordpress
Buka blog anda, plugin pada insert header dan footer - setting. Pada header paste script untuk menggunakan mathjax diatas.
Jangan lupa tekan save
Silahkan dicoba menulis postingan dengan menggunakan script berikut:
\frac{a}{b} maka akan muncul $\frac{a}{b}$
\int_{a}^{b}f(x)\mathrm{d}x menjadi $\int_{a}^{b}f(x)\mathrm{d}x$
Jika dapat muncul dengan benar maka anda siap menulis blog matematika,
tanda dolar di awal dan akhir latex digunakan untuk inline (equation sejajar teks), jika ingin baris tersendiri gunakan
tanda dolar doubel diawal dan akhir latex. untuk mempelajari latex dasar anda dapat melihat :
cara belajar latex dasar
Semoga sukses
Semoga bermanfaat, terima kasih
Silahkan berkunjung pada blog kami yang lain
