WordPressでアイキャッチ画像を表示する際、キャプションも合わせて表示する

  WordPress 

キャプション出力OK!

アイキャッチで画像を出力する際、一緒にキャプションも表示させたいときの処理です。

このブログではよく「Photopin」を利用して画像を探していますが、ここの画像は著作権の表示が必須です。

これをいちいち入力するのは面倒なので画像アップロードの際、「キャプション」に著作権情報を入れておいて、一緒に出力しちゃいます。

get_post()でアイキャッチ画像の投稿データを取得する。

 

ここを参考にしました。

http://webdesignfromscratch.com/wordpress/wordpress-captions-on-post-thumbnails/

 

下記の処理でキャプションがゲットできます。

これをうまいこと整形していきましょう。
このブログではwp-captionクラスにcssを設定しているので、htmlタグも合わせて出力するようにします。
こんな感じです。

 これをsingle.phpのループ内、the_content()の上にでも設置すると、キャプション付きのアイキャッチが出力されるようになります。

 

おまけ:任意の投稿日以降に投稿された投稿にのみ適用する

このブログでは途中まで自力で投稿内にアイキャッチに使用した画像を入れていたので、このままだと過去の投稿にもアイキャッチが表示されてしまい、重複してしまいます。

分岐を1つ追加してこれから投稿する記事のみに前述の処理を適用するように変更しました。

 何の事はない、公開日を取得してフィルタリングするだけですが、これで意図通りの動作になりました!

 

コレ聴きながら書きました!

レディオヘッドのトム・ヨーク、レッド・ホット・チリ・ペッパーズのフリーを中心に結成されたバンドです。いつぞやのfujirockで観れてラッキーでした。
また日本来てくれないかなぁ〜。

ブログの更新情報はこちらで配信しています。

   

follow us in feedly

ad

wpx

  • JavaScript 第6版

    定番のO'Reilly本でJavaScriptを深く学びましょう!気になる箇所をざっと読むだけでも、とても参考になります。ざっと読みを繰り返すのがオススメ。超良書です!
  • サイトの拡張性を飛躍的に高める WordPressプラグイン開発のバイブル

    WordPressプラグインの開発から運用までカバーする、プラグイン開発のまさに「バイブル」です。

    セキュリティやマネタイズにも触れられていて参考になるところ多すぎです。
  • wordpressに慣れてくると、今度は痒いところに手が届く細やかなカスタマイズをしたいですよね。phpを利用したカスタマイズからデータベースに直接アクセスする方法がとにかく丁寧に解説されています。個人的には第5章、「プラグインの自作」が物凄く役に立ちました!
  • WordPressのテーマ制作やテンプレートについての概念など、実際にサイトを制作しながらWordPressを知ることができます。
    制作するだけでなく、ユーザビリティからSEO、さらにはパフォーマンス改善にも触れているという充実ぶり。
    オリジナルテーマ制作のお供にどうぞ!
  • サンプルが大充実!定番のjQuery入門書です。
    本の内容に沿って制作を進めるだけで、即実戦投入できる程の機能ができ上がります。
    解説が丁寧且つチートシートも付いているのでjQueryについての理解がぐんと深まりますよ!
PAGE TOP ↑