ブログ記事に内部リンクを表示する際に、通常のリンクよりもブログカードを表示させた方が見栄え良くすることもできますし、クリックされやすくなります。

WordPressには、ブログカードを表示させるためのプラグインやEmbed機能などもありますが、今後のためにもブログカード表示を自作しておきたいなと思いました。

今回は、ブログカード表示を自作する方法をご紹介したいと思います。

ブログカードの仕様

今回、ご紹介するブログカードとして表示する項目は、以下の3つとします。

  • サムネイル
  • タイトル
  • 抜粋文

ブログカード表示の実装

サンプルコード

GitHubにてコードを公開しているので、良かったら参考にしてみてください。

サンプル | GitHub

記事のIDの確認方法

WordPressの管理ページの左側メニューの「投稿」→「投稿一覧」ページ内の記事にカーソルを合わせると、ブラウザの左下にURLが表示されます。

URLの「post=○○」の部分が、記事のIDとなります。

まとめ

WordPressで作成した記事に自作でブログカードを表示させる方法をご紹介しました。

ブログカードを表示させる機能を実装して、ショートコードで呼び出せるようにしておけば、簡単にブログカードを表示させることができます。

そして、ブログカードのデザインのカスタマイズも自由に行うことができるので、自作をおすすめします。

是非自作でブログカードを表示できるように実装してみましょう。

投稿者: TWEI

趣味はプログラミング。 以前は仕事でプログラミングをやっていました。現在はWebエンジニアを目指して勉強中。 勉強で得た知識などをブログで発信していく予定です。

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA