PR

ワードプレスのテーマ「Cocoon」でブログカードを作成する方法と注意点

ブログ
simplu27 / Pixabay
記事内に広告が含まれています。

記事の概要

ワードプレスのテーマにCocoonを使っています。

Cocoonでブログカードを記事内に簡単に入れる方法をご紹介します。

対象読者

  • ワードプレステーマ「Cocoon」でブログカードを簡単に記事に入れたい人

ブログカードとは?

そもそもブログカードってなに?という方のために少し解説を入れておきます。

一言で言うと「概要付きリンク」だと思います。

ブログカードのイメージはこんな感じです。

ワードプレスでブログカードを入れる方法

はてなブログみたいに関連記事や内部記事にリンクを入れると簡単にブログカードが入れられないのか?という疑問がありました。

そこで、「ワードプレス ブログカード」でググってみると以下のような方法でブログカードが入れられることがわかりました。

プラグインを入れる

プラグインを入れることが一番簡単な方法だと思います。

プラグインをインストールして、有効化するだけです。

導入が簡単であるというメリットがある反面サイトが重くなるというデメリットがあります。

公開されているphpのプログラムソースを使って、自分でブログカードの設定を行う

多少手間はかかりますが、phpのプログラムソースから設定方法まで公開してくれている優しいブロガーの方がいらっしゃるので、そのサイトを参考にブログカードの設定を行います。

導入に多少の手間はかかりますが、プラグインを導入しないため、サイトが重くなりにくいです。

Cocoonの機能を使ってブログカードを入れる方法

ワードプレスでブログカードを入れる方法を調べました。

ただ僕は最初からCocoonというワードプレスのテーマを使っていました。

このCocoonにはなんとブログカードの機能が初めから実装されていました。orz

ブログカードの実装方法は次の通りです。

スタイルをクリックする

記事の編集画面からスタイルをクリックします。

囲みブログカードラベルを選択し、リンク先に合わせたブログカードを選択する

スタイルをクリックすると「囲みブログカードラベル」を選択するとブログカードの候補が複数出てきます。

リンク先の内容に合う文言のブログカードを選択してください。

ブログカード内にURLを貼る

ブログカード内に直接URLのみを貼り付けます。

そうすると以下のようなブログカードが出来上がります。

今回はワードプレスの公式サイトのブログカードを作成しました。

 

Cocoonの機能を使ってブログカードを入れる際の注意点

ブログカードを作成する際に問題にハマって少し時間を取られたので、注意点を書いておきます。

こんな感じで文字付きリンクを入れるとブログカードがうまく機能しません。

文字付きリンクをブログカード内に入れてもブログカードではなく、本当にただの文字付きリンクになります。

ブログカードに入れるのは実際のURLにするのがポイントです。

まとめ

ワードプレスのテーマ「Cocoon」でブログカードを入れる方法とその注意点をご紹介しました。

これでまたブログが書きやすくなりました。

コメント