Luxeritasで個別記事のタイトル下にアイキャッチ画像を表示させる方法

2016-12-252020-02-02Web制作

こんにちは、とみーです。

2016年12月現在、このブログで使用しているテーマは、高機能な無料のWordPressテーマ「Luxeritas」。

そのLuxeritasで個別記事画面のタイトル下に、投稿画面で設定したアイキャッチ画像が自動的に挿入されるようカスタマイズしました。

高頻度でアップデートされているテーマですので、いつかテーマ自体に実装されるかもしれませんが。

Luxeritasでタイトル下にアイキャッチ画像を自動挿入する方法

自動でアイキャッチ画像を挿入する方法はいくかあります。

1. 親テーマを書き換え
2. 子テーマのfunctions.phpに記述
3. プラグインを使用する

1.の親テーマを直接書き換える方法は、アップデートの度に記述しなければいけません。面倒ですよね。

2.のfunctions.phpに記述する方法は、Luxeritasの生みの親である、るなさんが解説してくださってます。

これからご紹介する方法は3.の方法。ウィジェットを使った方法です。1.のような毎度毎度の煩わしい手間もなく、今回の設定だけでサクッと終わります。

 

プラグインのインストール

PHP Code Widgetというプラグインが必要です。

プラグイン → 新規追加 → 検索バーにPHP Code Widgetと打ち込めば出てきます。

それをインストールしたら有効化します。

ウィジェットで設定

PHP Codeを記事タイトル下ウィジェットに追加します。

そして下記のソースコードをコピペするだけでOK！

<div style="text-align:center;"><?php if ( has_post_thumbnail() ) { echo get_the_post_thumbnail( $page->ID, array( 600, 315 ) ); } ?></div>

array( 600, 315 ) は画像のサイズです。自由に変更可能です。横幅, 高さの順で指定します。

どんな画像でも自動的にこのサイズになりますので、縦横比を考えてアイキャッチ画像を設定しましょう。
正方形の画像を設定すると、横に伸びて見た目が美しくなくなります。

ちなみに、array( 'full’ ) だとその画像に合った縦横比で表示されますよ。

アイキャッチ画像を自動的に表示させる方法　あとがき

この2つの手順さえ行っておけば、投稿画面のアイキャッチ画像で設定した画像が自動的に反映されますよ！

毎度画像を挿入する手間が省けて楽ちんですね。

しかし正直なところを言うと、2.のfunctions.phpに記述する方法が一番おすすめ。

functions.phpをいじってブログを真っ白にするのが怖い！ という方にはこの記事の手順を推奨しますが…。

PHP Code Widgetを他の用途でも使用されている場合はいいのですが、このためだけにインストールするのは無駄です。

プラグインは出来るだけ減らして、サイトを軽くしましょう。