Cocoon初心者でも簡単!ブログカードの設定方法

tomo

50代主婦のtomoと申します。
私自身ブログ初心者ですが、学びながら実践していることをシェアしていきます。
ゼロからブログを始めたい方に向けて、AIを使った記事作りや効率化のコツ、そしてブログの作り方をわかりやすくお伝えしていきます。

tomoをフォローする

ブログを始めたばかりの頃、私は記事同士をつなぐリンクをすべてテキストリンクで入れていました。記事同士を内部リンクでつないだ方がいいことはわかっていても、ブログカードのことをよく知らなかったのです。
でも、後から見返すと見た目が地味でクリックされにくく、ブログカードの存在を知ってから、すべての記事のテキストリンクをブログカードにいれかえました。
そこそこ手間もかかったので「最初から、ブログカードやラベル付きのブログカードを使えばよかった…!」と後悔しました。

今回は、そんな私の経験をもとに、Cocoonテーマで使える3つのリンク方法
ブログカード・ラベル付きのブログカード・テキストリンクを、スクショ付きでわかりやすく紹介します。
初心者さんでも今日からすぐ設定できるように、順を追って説明していきますね✨

Cocoonでリンク表示を見やすくするには?

テキストリンクだけでは読まれにくい理由

テキストリンクだけだと文字の色が変わるだけで、読者の目にとまりにくいですよね。
しかも、リンク先の内容が一目でわからないため、クリック率が下がりがちです。
せっかく関連記事を書いても見てもらえないのはもったいないです。

ブログカード・ラベル付きのブログカードを使うメリット

Cocoonの「ブログカード」や「ラベル付きのブログカード」を使えば、
記事のタイトルやアイキャッチ画像がカード風に表示され、
ひと目で内容がわかるようになります。
デザインも自動で整うので、見た目もぐっと良くなります✨

一方で、テキストリンクはSEO的には有利なようです。でも、私はやっぱり読者のみなさんの読みさすさを優先したかったので、ブログカードにいれかえました!

Cocoon設定でブログカードを有効化する方法

1.Cocoon設定 → ブログカードタブを開く

まずはCocoon設定の「ブログカード」タブを開きます。
ここでは、記事内リンクや外部リンクをカード形式で表示するための基本設定を行います。

2.外部・内部リンクカードの表示設定

「外部リンクカードを有効にする」「内部リンクカードを有効にする」のチェックが外れていると、
リンクを貼ってもカード表示になりません。
どちらもチェックを入れておきましょう。

3.「ブログカード表示を有効にする」にチェック

4.設定が終わったら、ページ上部か下部の「変更をまとめて保存」をクリック。

ここでは、内部ブログカード設定をしました。外部ブログカード設定も下にスクロールすると、でてきますので、同じように設定します。

これで、記事中のリンクが自動でカード風に表示されるようになります。

ブログカードの入れ方(記事内リンク)

記事リンクをコピペするだけで自動カード化

ブログカードを記事の中に入れる方法はとても簡単です。
紹介したい自分の記事のURLをコピーして、本文中に貼り付けるだけ。
自動でカード型に変わります。

  • こんなに簡単にできるんだったら、もっと早くブログカードを使うべきでした。
  • ブログカードを使えるのは、同一サイト内の記事リンクになります。
  • 自分のブログ内の記事URLを貼ると、自動的に内部リンクとして扱われます。サイト全体のSEOにも効果的です。
  • 必ず、段落ブロックでいれてください。見出しになっていたり、そもそもブロックになっていないとブログカードをいれられません。私は、ここでちょっと手こずりました。

プレビューで見た目を確認

カードが正しく表示されているか、プレビューで確認しましょう。
カードの表示が崩れている場合は、Cocoon設定のブログカードタブを再チェックします。

ラベル付きのブログカードの入れ方

ブログカードの左上に「関連記事」や「あわせて読みたい」といったラベル(目印)が表示されることで、読者の方は以下のようなメリットを感じます。

  • 一目でリンクの内容がわかる
  • 「読んでおきたい」という気持ちになる
  • 記事を読み進める上での道しるべになる

また、説明をいれずに文章のすぐあとにいれても違和感がありません。

そして、過去記事への誘導(内部リンク)にラベルを使うと、ブログ内の回遊率アップに効果的です!

ブロックエディタでの操作手順

Cocoonのブログカードにラベルを設定するのは、とっても簡単です! WordPressの新しいエディタ(ブロックエディタ)を使っている方向けに解説します。

1.ブログカードブロックを追加

記事の編集画面で、ラベルを表示させたい場所に「ブログカード」ブロックを追加します。

記事内の「+(ブロックを追加)」ボタンをクリックします。(ブログカードが出てこない場合、すべて表示をクリック)

「ブログカード」と検索するか、左側に表示されるブロック一覧から選択します。

2.URLを入力

追加したブログカードブロックに、リンクさせたい記事のURLを貼り付けます。

複数の記事のリンクを貼り付けることも可能です。その時Enterをおして、必ず1行ずついれてください。

3.ラベルを設定

ここが一番重要なポイントです!

ブログカードブロックを選択した状態で、画面右側の「設定」パネルを開きます。公開または保存ボタンすぐ左横が「設定」になります。

記事の中のブロックと「ブロック」タブが選択されていることを確認し、少し下にある「スタイル設定」を探します。

「ラベル」という項目がありますので、ここのプルダウンメニューをクリックします。

表示された選択肢の中から、表示させたいラベルを選びます。

ラベルの種類(例)主な用途
関連記事記事内で関連する別の記事を紹介したいとき
あわせて読みたい記事の終盤などで、続けて読んでもらいたい記事を紹介したいとき
チェック特に重要な情報や確認してほしいリンクのとき
参考記事記事作成にあたって参考にした外部の記事など

例えば、「関連記事」を選択すると、ブログカードの左上にラベルが表示されます!

4.記事を保存・下書き保存

設定が終わったら、記事を「保存」または「下書き保存」して、実際にラベルが表示されているか確認してみましょう。

テキストリンクの入れ方

ブロックエディタでリンクを挿入する手順

1.リンクしたいページにいって、URLをコピーする

2.リンクを付けたい文字をドラッグして選択します。

3.上に出てくる「🔗リンクマーク」をクリック。

4.URLを貼り付けしてEnter

テキストリンクを使う場面と注意点

本文の流れを崩さずにリンクを入れたいときには、テキストリンクが便利です。
ただし、リンク先が目立ちにくいので、強調したい記事はブログカードを使うと効果的です。

外部リンクの設定(公式サイトや他ブログなど)

外部リンクは「新しいタブで開く」が基本

外部サイトへのリンクは、必ず「新しいタブで開く」に設定しましょう。
読者が他サイトに飛んでも、あなたのブログに戻りやすくなります。

nofollow設定を使う場合(SEO対策)

アフィリエイトリンクや信頼性を保証できない外部リンクには、
「nofollow」タグをつけて検索評価を渡さないようにするのが基本です。

Cocoonでの「nofollow」一括設定(基本的なアフィリエイト対策)
Cocoonには、すべての外部リンクに対して自動的に nofollow 属性を付与する機能があります。これで、アフィリエイトリンクを含むすべての外部リンク対策が可能です。

外部リンクの設定・nofollow設定の方法

1.WordPressのダッシュボード左メニューから「Cocoon設定」をクリックします。

2.上部のタブメニューから「本文」タブを選択します。

画面を下にスクロールし、「外部リンク設定」の項目を探します。

3.外部リンクの開き方→「新しいタブで開く」を選びます。

4.フォロータイプ→「フォローしない(nofollow)」を選びます。

5.画面の一番下にある「変更をまとめて保存」ボタンをクリックして完了です。

  • 追加rel属性:「noopener を追加する」と「noreferrer を追加する」の2つにチェックを入れましょう。外部リンクのセキュリティ対策として重要です。
  • nofollow設定は、あくまで「本文内」の設定なので、サイドバーやヘッダー、フッターにある内部・外部リンクは適用外です。

読者の方にあなたのブログをじっくり読んでもらうために、内部リンク(あなたのブログ内の別の記事へのリンク)は「同じタブで開く(現在のタブで開く)」のままにしておくのがおすすめです。この設定も、上記の「外部リンク設定」のすぐ下にある「内部リンク設定」で確認・変更できますよ。

まとめ

内部リンクを使って読者の回遊率を上げよう

内部リンクをうまく使うと、読者があなたのブログを回遊してくれるようになります。
自動で表示されるので、記事中ではブログカードを活用しましょう。

テキストリンクだけに頼っていた頃より、
ブログカードやラベル付きブログカードを使うようになってから、見た目がスッキリしてクリック率が上がりました✨
Cocoonは設定も簡単なので、ぜひこの機会に活用してみてください。

タイトルとURLをコピーしました