【Cocoon】リンクの種類と作り方 ～ URLの挿入手順まとめ

「リンク」とは、クリックすると別のページに移動できる URL のことです。

この記事では、リンクの種類と作り方をやさしく解説します。

リンクには、大きく分けて次の２種類がありますが、見た目や挿入の手順は同じです。

リンクの見た目は？３つのタイプ

Cocoonでは、リンクの見た目には以下のタイプがあります。

ラベル無しのブログカード：

ラベル有りのブログカード：

テキストリンク：

Ikumi’s Lifelog

URLそのまま

　https://blogstudynotes.com/

また、「リンク」にはなりませんが、URLをテキスト情報として記載することも可能です。

https://blogstudynotes.com/

ラベル無しのブログカード

結論：リンク先の URL を、新しいブロックに貼るだけでブログカードになります。

１．リンクしたいページのURLをコピーします。

２．投稿ページで、新しいブロックに貼り付けます。

３．記事を[保存]して、プレビューを確認します。

✅ 「このコンテンツを埋め込めませんでした」と出ても、気にしなくて大丈夫です。そのまま公開しても、[リンクへ変換]を選択してもOKです。どちらにしてもブログカードに表示されます。

✅ 以下のように、下書き上ではURLだけに見えることもありますが、ブログ上ではブログカードのおさまります。

この方法だと結果は以下のようになります。

ラベル無しのブログカード例：

【WordPress】水玉（ドット柄）のブログ/サイト背景 ~ CSSか画像設定で

CSSか画像を使って、ブログやサイトの背景を水玉（ドットパターン）にする方法です。

blogstudynotes.com

2020.07.15

ラベル有りのブログカード

結論：専用ブロックを使うと、「あわせて読みたい」などのラベル付きカードが作れます。

１．ブロックの右辺にプラスサインが表示されています。クリック。

以下のようになります。

２．[ブログカード]メニューがリストされていたらクリック。なければ、ブロックの検索ボックスにブログカードと入力してエンターキーを押してください。

３．[ブログカード]をクリック。

４．こうなりましたね。このブロックを選択した状態だと、右サイドに[スタイル設定]というセクションが表示され、そこで[ラベル]を選択できます。

５．ラベルを選んだら、ブログカードのボックスに、URLを貼り付けます。

６．[保存]ボタンを押すと、プレビューで確認できる状態になっています。

「あわせて読みたい」ラベル使用例：

テキストリンク

結論：テキストリンクは「文字を選択した状態で URL を貼る」だけです。

１．リンクをつけたいテキストをブロックに入力します。

２．お目当てのURLをコピー。

３．１．で入力したテキストを選択。

４．選択した状態で、コピーしたURLを貼り付けます。
右クリックメニューの[貼り付け]か、Ctrl キーを押しながら Vキーを押すとできます。

または、

入力したテキストを選択してリンクアイコンをクリック。

以下の入力欄にURLを貼り付け、矢印マークをクリックするかエンターキーを押すと設定完了です。

✅ 「新しいタブで開く」設定もできます。チェックを入れると、読者がリンクをクリックしたときに別タブでページが開きます。ページを離れずにいられるので親切です。

５．[保存]ボタンを押して、プレビューで確認。

テキストタイプのリンク例：

[もしもアフィリエイト]　アマゾン、楽天、ヤフーショッピングリンクの作り方

URLそのまま

結論：ブロック内に「なにか 1 文字入れてから URL を貼る」と、URLそのままのリンクになります。

１．新しいブロックにスペースでも文字でもいいので、何か入力します。

２．お目当てのリンクをその後ろにコピー。（例として、URLの前にスペースを入力してあります。）

　https://blogstudynotes.com/

これで、URLそのままで、リンクにすることができます。

使用例です。

当ブログのURL：　https://blogstudynotes.com/

リンクを無効にする方法

URL を「リンクではなく、ただのテキスト」として表示したいこともありますよね。

その場合は、

１．リンクになっているURLを選択

２．リンクアイコンをクリックすれば、ただのテキストに戻ります。

ピンバックと通知、モデレートのこと

内部リンクを貼ったときや、どなたかが、自分のブログを被リンクしてくれたとき、自分宛に「ピンバック承認待ちです」「モデレートしてください」といったメールが届くことがあります。

最初はびっくりしますが、通知設定をオフにすれば問題なし！

その機能をオフにする設定が以下のページに分かりやすくあったので、参考にされてください。通知がきたときの対応も載っています。

初期設定だと、自分が誰かのリンクを貼ったときにも、同じようにピンバックが送られているのですが、それをオフにする設定も上のページにあります。

外部リンクのマナー

外部リンクを貼るとき、許可が必要かな？と悩むことがありますが、多くの場合は不要でしょう。

リンクを貼ってもらうことを「被リンク」というのですが、被リンクの数は、Googleからの評価にもつながるそうです。

むしろリンクされることで相手の評価も上がることが多いので、お互いにメリットがあります。

とはいえ、サイトの運営方針によっては、被リンクを望まない場合もあるかもしれません。
そのため、お互いに安心してやり取りできるよう、コメント欄やコンタクトフォームを用意しておくと親切ですね。

記事内リンク

記事の中で、特定の見出しへジャンプする「記事内リンク」も作れます。

設定手順はこちらでまとめています👇。

まとめ：リンクで記事をもっとわかりやすく！

リンクをうまく使うと、読者がほしい情報にすぐたどり着けます。

内部リンクも外部リンクも、記事の流れを意識して、自然に貼っていきましょう！

さらに、リンクを「ボタン」や「画像」に設定する方法もまとめています👇。