0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

wordpressでブログを作ったが、数式が画面外にはみ出してしまった

Last updated at Posted at 2021-03-16

Wordpressでブログを作成しようと思い立った。
それは、自分の高校から続く20年近い理系のキャリアを活かして、何か有益な情報発信ができるのではないか、と思ったから。

でも、そもそも理系といっても実験系のキャリアで、かつブログ運営経験はほとんどなく、どのように数式や計算を表現していくかについても漠然としたイメージしかもっていなかった。
ワードやパワーポイントでは数式エディタで書けるように、「まぁ普通に書けるんじゃないかな?」ぐらいにしか思ってなかった。
そんな甘い認識の中、えいやっとブログを開設し、実際に書き始めてみたが、分からない。まぁ、分からない。

単純にy=x/y+2√7などと、直接打ち込むことも考えたが、これは分数になっただけで既にものすごく見ずらい。まして、微分積分など、表現できようが無い。

次に、ワードやパワーポイントの数式エディタで描いた数式を、ワードプレスに画像として貼り付けることを考えた。
これは、まぁそれなりに「見れる」ぐらいのものにはなるが、これもいくつか問題がある。
というのは、なにせ「画像」であるため、数式が続いて大きな画像になると、パソコンから見るのには大丈夫だが、スマホのような小さな画面から見ると画像が小さく縮小されてしまい、細かくなった数式が読める状態では無くなってしまう。

そんな、おそらく超初歩的なところで躓きながら、ようやくLaTeX形式、というもので表現しなければならない事が分かった。
じゃあそのLaTeX形式をどうやって入力するか、表現するか、が分からない。

プラグインに、LateX形式で描けるものがあるようだ。またこれもいくつかあるようで、どれにしたらいいのか分からないが、とりあえずMathJax-LaTeXというのがメジャーっぽい。
このプラグインを導入すると、確かに数式が描けるようになった!!!
だが、このLaTeX形式、結構くせ者で、表現技法を習熟するのは、とても大変。
また、新しい行に数式を書く方法と、文章中と同じ行中に数式を書く方法も違うため、かなりやっかいである。

そして、このMathJax-LaTeXを使って数式を表現する事に少しずつ慣れてきたところに、最後の関門が待ち受けていた。。
それは、パソコンで見ると非常に綺麗に描けているせっかく書いた数式が、スマホ画面になると、横にはみ出してしまっているのである!!!

な、なんということか!!せっかく苦労して描いたのに!!(涙)

で、例によって同じような症状の人がいないかググってみると、やっぱりいた。同じようなことになっている人たち。
その方々は、どうやらCSSにコードを追加することで解決しているらしい。

自分もやってみた。。。。。。でも、うまくいかない。。。なぜか、うまくいかない。。。
何故かはわからないが、うまくいかないのだ。。。。

結局、詳細な理由は不明だが、最後までうまくいかなかった。横にはみ出す問題が解消しないのだ。

ほとほと困り果てていると、そもそもMathJax-LaTeXを使わなくても、LaTeX形式で数式を書く事ができるらしいことに気付いた。
それは、headタグにJavaScriptソースコードを挿入することで、MathJaXが使えるようになる、というもの。
具体的には、以下のリンク先が詳しい。

この方法を用いることで、先ほどのプラグインを入れなくても数式を綺麗に描く事ができた。さらにCSSを追加することで、スマホのような小さな画面の場合には数式を横スクロールできるようになり、全ての問題を解決できた。

ここまで苦労するとは思わなかったが、結果としては、数式を綺麗に書く事ができるようになった。
やはり一つずつできることが増えていくことは、とても嬉しい事だと思う。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?