記事中の画像を自動で中央寄せする方法 | ブログtips / WordPress

WordPressで記事中の画像を中央寄せは記事編集画面の下図のように中央寄せボタンを押すことでできます。

ですが常に画像を中央寄せしたい人にとって、毎回この中央寄せボタンを押すのはかなり面倒です。

私も常に画像を中央寄せしたい人間だったのでこの作業はかなりしんどかったです。

常にに記事中の画像を中央寄せする方法はないものか…
と方法を試行錯誤したところ、プラグインなしで、CSSで常に記事中の画像を中央寄せすることができました！

この記事ではCSSで記事中の画像を常に中央寄せする方法を紹介します。

記事中の画像を自動で中央寄せするCSSを追加する

記事中の画像を自動で中央寄せするにはCSSコードを「WordPressカスタマイズの追加CSS」に書き込みます。

CSSコードを追加する方法

CSSコードを追加するのは以下の手順で行います。

まず、WordPress管理画面メニューの「外観→カスタマイズ」をクリックします。

次に「追加CSS」をクリックすればCSSを追加できます。

追加するCSSコード

上記のコードをCSSに追加してカスタマイズを保存します。

.entry-content figure.wp-block-image {
    width: 100%;
    text-align: center;
}

最後に画像を含む記事をブラウザで開いて、画像が中央寄せになっているか？を確認して完了です。

まとめ

この記事ではWordPressの記事中の画像を常に中央寄せする方法を紹介しました。

常に画像を中央寄せしたい人で、記事編集画面の中央寄せボタンを毎回押すのが面倒な方はこの方法を試してみてはいかがでしょうか。