WordPressを使い記事を書いていると、定形フォーマットが必要な個所が出てきます。
現在使っているテーマ「ALBATROS（アルバトロス）」にも定型フォーマット挿入機能が備わっています。でも、それはかなり限定された仕様。ALBATROSの機能以外の場面でも定形フォーマットを使いたいケースがあります。
そこで、私の使用条件にあうプラグインがないかを探しました。すると、かなり評価が高い「TinyMCE Templates（TinyMCE テンプレート）」が見つかりました。
説明を読むと操作が簡単で、どこにでも挿入できるので私の要望にピッタリ。早速導入。
でも、TinyMCE Templatesで設定した画像がボケボケ…
下がその表示された画像です。
確認のため投稿ページで既に正しく表示されている画像をTinyMCE Templatesに置いてみました。すると、ボケボケ画像になりました。
これで、原因はWordPress側ではなくTinyMCE Templates側にあることが判明です。
同じ事例があり、解決策がないかググッてみましたが、見当たりません。ということは、みんな画像が正しく表示されていて、このような事例は私だけなのでしょうか?
ググッても解決策が見つからなかったので自分自身で解決しなければなりません。
TinyMCE Templatesのビジュアル編集画面で作業していたので、ソースがわかるテキスト編集画面に切り替えました。
すると、WordPressの「メディア/ライブラリ」から挿入した画像のリンクURLが
https://www.monk-jp.com/wp4-Travel-300×48.png
になっています。
「…/4-Travel-300×48.png」は、「4-Travel」画像のサイズが300×48pixを示していることが予想されます。
元画像のサイズが974×155、WordPress表示サイズを横幅670pixに設定してあるのに、ソースのリンク先URLのサイズが300×48は明らかにおかしいです。
横幅300pixを670pixまで引き伸ばしているのならボケボケになるのは当然です。
ここで、思い出しました。
先日、WordPressのデータをローカルにバックアップ。バックアップしたデータをチェックした際に、画像データが複数あることに気が付きました。
アップロードしたのはひとつだけなのに、それに対してWordPress側は「メディア設定/画像サイズ」の指定に従い複数の画像データを作る仕様のようです。
今回の例でいえば、アップロードした「4 Travel.png」に対して、
4-Travel.png
4-Travel-150×150.png
4-Travel-300×48.png
4-Travel-300×155.png
4-Travel-718×114.png
4-Travel-720×155.png
4-Travel-768×122.png
が作成されていました。
ここまでわかれば、解決策は、
リンク先の画像を「4-Travel-300×48.png」から画像サイズの大きい「4-Travel-768×122.png」にすれば良い
と気が付きます。
TinyMCE Templatesのテキスト編集画面から
https://www.monk-jp.com/wp4-Travel-300×48.png
を
https://www.monk-jp.com/wp4-Travel-768×122.png
と手打ちで修正し、更新ボタンをクリック。
ピッタリでした!
見事に画像が正常に表示されています。問題解決です!
それにしても何故TinyMCE Templatesは、画像サイズの変更が反映されないのでしょうか?
WordPressの投稿ページでは、どんな画像サイズにしても最適なリンク先画像を引っ張ってきて表示してくれるのに…
同様の事例がアップされていないということは私の個人的な問題とも考えられますが、少なくとも私の環境では今後もTinyMCE Templatesで画像を挿入する際は、画像サイズを手打ちで直さなければならないのは確実です…
