WordPressで投稿の新規追加画面にデフォルトアイキャッチ画像を自動設定したい!

No Image(イメージはありません)

こんにちは!寿天(すあま)です!

さぁ!今回から新コーナーが始まります!

WordPress初心者・寿天と茶生のブログ改造メモ!
WordPressでDIY!!

このコーナーはイマジライフブログの改造備忘録ってぇところッスよね?
うん。
このブログはWordPressで構築されています。
私は一時期IT業界の会社に所属していたのですが、CMSといった類のものには触れてこなかったため、WordPressはまったくのど素人です;

しかし、自分オリジナルのブログを作ってみたいと思いまして、WordPressで構築しました。
Google先生に教えていただきながら、何とかそれなりに構築することができまして、現在では記事を公開するに至っております。
おいらが来た時にはもう公開されてたッスもんねぇ・・・。
ブログやサイトの構築・改造なんて難しそうッスけど、よくやろうと思い立ちやしたね?
うん・・・。
昔の私だったら絶対そんな決断に至ってないね;

「やってみるか!」と思えたのは、ひとえにIT業界に携わったおかげだと思うよ。

「ググれば何とかなりそう!」で今までやってきたからねぇ・・・。
今もそんな勢いでやっております。
で、せっかく貴重な経験をしているんスし、備忘録を残して、同じ疑問や悩みを抱いている方のお役に立とうってぇわけッスね?
そういうこと。
さてでは、そろそろ本題に入らせていただきますね。

今回のテーマはWordPressで投稿の新規追加画面にデフォルトアイキャッチ画像を自動設定したい!

ということで、さっそく見ていきましょう!

投稿の新規追加画面にデフォルトアイキャッチ画像を自動設定したい!

まずは、何をどうしたいかについて詳しくご説明しますね。

WordPressで投稿を新規追加する画面を表示すると通常、アイキャッチ画像は未設定になっていますよね。

投稿の新規追加画面表示時(通常)

アイキャッチ画像は設定しなくても、記事を公開することはできます。
・・・できるんですが、実際に表示してみると見栄えがいまいちなんですよね。

試しにやってみたところ、トップページでの表示はこう↓なりますし、

アイキャッチ画像なしの投稿(トップページ)

投稿ページでの表示はこう↓なってしまいます。

アイキャッチ画像なしの投稿(投稿ページ)

今まで、記事にはアイキャッチ画像を必ず付けて投稿してきたので、
なんか残念な感じがするんですよね;
そうッスねぇ・・・。

投稿ページはまだアリな感じはするッスけど、
トップページは貧相ッスねぇ・・・;
閑古鳥が鳴いてそうッス。
そうだよね;

ひどいのはまだあるんだよ!
これよりもっとひどいところがあるんだよ~;

ウィジェットの最新記事一覧はこう↓表示されますし、
最新記事一覧の表示(通常)
投稿ページに表示される関連記事一覧なんてこんな↓感じになっちゃうんですよ;

関連記事一覧の表示(通常)

あぁ~・・・。
こいつぁ、ひでぇ・・・;

読者の心を惹きつけるようなタイトルであったとしても、こんなんじゃあ目立たねぇッスね。
普通に見逃しちまいそうッス・・・。
うん・・・これはホントにひどいと思った・・・。
やっぱり何か画像があった方がいいんですよね。

うちで使用しているアイキャッチ画像は自前の写真かイラストなんですが、記事を書く度に用意するとなると時間がかかってしょうがないんですね;

画像は用意できてないけど、記事は早くアップしちゃいたいなぁ・・・
なんてことが今までに何度もありました。
なるほど・・・。
ちっと話が見えてきたッスよ。

それなら、毎度画像を用意しなくても大丈夫なように初期画像を用意しときゃあいいってぇわけッスね?
そう!

No Image画像を表示させればいい!!

で、こうも考えたわけです。

アイキャッチ画像がNo Image画像になる可能性があるのなら、投稿の新規追加画面を表示した時点で、No Image画像をデフォルト設定させておけばいい!と。
なるほど・・・。

メディアに追加された画像ってぇのは時間が経つにつれて、他の画像の中に埋もれてっちまうッスもんねぇ。
毎度手で設定するとなると、画像を探すのが面倒ッスね。

しかし、初めからNo Image画像をアイキャッチとして設定しておけば、その手間が省けるってぇわけッスね!
そうそう、そういうことです!

デフォルトアイキャッチ画像の自動設定を実装してみた!

それでは、さっそく実装してみましょう!
【手順1】No Image画像を作る
まず、No Image画像を用意する必要がありますね。
簡単に作るなら、グレー背景に「No Image」の一言があれば十分です。

しかし・・・

うちとしては、それではつまらない!!

どうせなら、ステキな絵柄がいいですよね。
これからずっと使っていくんですし。
え!もしや、描いてくれたんスか!?
描いてみました!!

No Image(イメージはありません)

おぉ~~!!
おいらたちのトレードマーク入りじゃねぇッスか!!
和の雰囲気もいい感じッス!!


姐さん頑張ったッスねぇ!
ありがとうごぜぇやす!
せっかくだからね!
これでアイキャッチ画像がなかったとしても、
ブログの雰囲気が少しは華やかになるのではないでしょうかっ!!
【手順2】function.phpにデフォルトアイキャッチ画像の自動設定処理を記述する
次は、投稿の新規追加画面を表示した時にデフォルトアイキャッチ画像を自動設定する処理を追加しましょう。

WordPressの管理画面で[外観]-[テーマの編集]を選択し、
「テーマのための関数(function.php)」をクリックします。

function.phpのエディタが表示されたら、以下の処理を追加します。
function.phpに追加する処理
1
/**
2
 * 投稿の新規追加画面にデフォルトアイキャッチ画像を自動設定する
3
 */
4
function save_default_thumbnail( $post_id ) {
5
  $post_thumbnail = get_post_meta( $post_id, $key = '_thumbnail_id', $single = true );
6
  if ( !wp_is_post_revision( $post_id ) ) {
7
    if ( empty( $post_thumbnail ) ) {
8
      update_post_meta( $post_id, $meta_key = '_thumbnail_id', $meta_value = '2045' );
9
    }
10
   }
11
 }
12
add_action( 'save_post', 'save_default_thumbnail' );
ええと・・・この処理は
投稿に更新記録がない・・・つまり
新規投稿データにアイキャッチ画像が設定されていねぇことを確認の上、
アイキャッチ画像を設定するってぇことッスか?
うん、そんな感じ。

save_default_thumbnail関数を、投稿エディタ利用時に実行されるsave_postにフックします。

8行目の処理で設定したい画像のIDを指定します。
「$meta_value = ‘2045’」の数値がそうですね。
画像ID・・・?
そんな数値どこで確認できるんスか?
メディアライブラリにゃぁ、そんな項目見当たらねぇッスよ?
画像IDはブラウザのアドレスバーで確認できます。

メディアライブラリを開いて画像をクリックすると、[添付ファイルの詳細]画面が出ますよね?

この時にアドレスバーを見てみると、「item=<数値>」が表示されていますよね?
この数値が画像IDのようです。

メディアライブラリ表示時のアドレスバー

おお、この値がそうなんスね。

・・・よしっ!
できたッスよ!
はい、それでは上手く実装できたか確認してみましょう!

投稿の新規追加画面を表示すると・・・?

投稿の新規追加画面表示時(修正後)

No Image画像が表示されてるッス!!

これで、記事を書く度にアイキャッチ画像を設定する手間が省けるッスね!
画像が間に合わねぇ時でも安心ッスよ!
いい感じですね!!
やったあ~~!!

最後に

はい!以上、「WordPressで投稿の新規追加画面にデフォルトアイキャッチ画像を自動設定したい!」でした!

これで毎度アイキャッチ画像を準備しなくてもOKですね!
そうッスね!

まぁ・・・姐さんとしちゃあ、
なるべく画像を入れて楽しい空間にしてぇとは思いやすが、
あとで差し替えるってぇ手もあるッスからねぇ。

記事が書き上がったら、とっとと公開しちまった方がいいッスよね。
そうだね。
画像が用意できるまで下書きのままっていうのは
ちょっと気持ち悪いもんね。

今度からは、そんな感じで運用しようかと思います。

 

こちらの記事を読んで、参考になった!面白かった!という方は、
下のステキボタンやソーシャルボタンにて教えてください^^!
とても励みになります!
  • ステキ! (0)