![](https://starting-marketing.com/wp-content/uploads/2021/11/laptop-g7587f0ff9_1920-1-1024x683.jpg)
この記事ではCocoon設定の【ブログカード】のタブについて解説していきます。
ここでは、記事内にテキストリンクを記載した場合、画像と記事抜粋が表示されたブログカードというものを表示するかどうかの設定になります。
それでは順に解説していきます。
内部ブログカード設定
まずは「内部ブログカード設定」の項目から見ていきましょう。
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-1.png)
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-1.png)
プレビュー
![](https://starting-marketing.com/wp-content/uploads/2021/11/0affac42410bf64734f2656619e61a6e-2.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/0affac42410bf64734f2656619e61a6e-2.jpg)
【プレビュー】では、現在の内部ブログカードの設定を実際に確認することができます。プレビューに表示されるブログカードはサイト内にある記事をランダムに表示しています。
プレビューの下にある【ブログカード表示】の項目で、表示を有効にしていないとプレビューは表示されません。
ブログカード表示
![](https://starting-marketing.com/wp-content/uploads/2021/11/00c3c1ecbc54cfdd4834a7bd8138a039.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/00c3c1ecbc54cfdd4834a7bd8138a039.jpg)
【ブログカード表示】の「ブログカード表示を有効にする」にチェックを入れると、本文に内部リンクを記載した際に、読者に対してブログカードで表示されるようになります。
ここでチェックを入れないと、ただのテキストリンクとして表示されるようになります。
また、上のプレビュー画面には何も表示されなくなり、この「内部ブログカード設定」内の項目は全て無効になります。
【ブログカード表示】の項目内にある「コメント欄のブログカード表示を有効にする」にチェックを入れておくと、コメントに書き込まれたリンクもブログカードとして表示されるようになります。
サムネイルスタイル
![](https://starting-marketing.com/wp-content/uploads/2021/11/a2913892503d6e5d637d94e41c419ca9-3.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/a2913892503d6e5d637d94e41c419ca9-3.jpg)
【サムネイルスタイル】ではブログカード内に表示される画像の位置を決めます。
左右どちらかの設定になります。
日付表示
![](https://starting-marketing.com/wp-content/uploads/2021/11/c2bb5a7834d935ae0cd159ee9e3ec04b.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/c2bb5a7834d935ae0cd159ee9e3ec04b.jpg)
【日付表示】では、ブログカード内に記事の投稿日を記載するか、記事の更新日を記載するか、もしくは両方とも記載しないかを設定することができます。
リンクの開き方
![](https://starting-marketing.com/wp-content/uploads/2021/11/97202e04dbe401f186ded5ac77c73a29.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/97202e04dbe401f186ded5ac77c73a29.jpg)
【リンクの開き方】の設定については、「新しいタブで開く」にチェックを入れるとブログカードをクリックした際に新しいタブで開くようになります。
ただし、【本文】のタブで「内部リンク設定」の「内部リンクの開き方」を設定している場合は、そちらの設定が優先されます。
外部ブログカード設定
続いて、「外部ブログカード設定」に進みます。
基本的には「内部ブログカード設定」と内容は同じです。
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-2.png)
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-2.png)
プレビュー
![](https://starting-marketing.com/wp-content/uploads/2021/11/99f5d9018bdac82b1085a863b440f2ea-1024x204.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/99f5d9018bdac82b1085a863b440f2ea-1024x204.jpg)
【プレビュー】では、現在の外部ブログカードの設定を実際に確認することができます。プレビューに表示されるブログカードはサンプルですが、クリックしてみると実際にリンクへ飛ぶこともできます。
(Cocoonの先代テーマ《Simplicity》の紹介サイト)
プレビューの下にある【ブログカード表示】の項目で、表示を有効にしていないとプレビューは表示されません。
ブログカード表示
![](https://starting-marketing.com/wp-content/uploads/2021/11/d40551cc656e86aa834f161b10339c10-1-1024x87.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/d40551cc656e86aa834f161b10339c10-1-1024x87.jpg)
「ブログカード表示」の「ブログカード表示を有効にする」にチェックを入れると、本文に記載した外部リンクがブログカードで表示されるようになります。
ここでチェックを入れないと、ただのテキストリンクとして表示されるようになります。
また、上のプレビュー画面には何も表示されなくなり、この「外部ブログカード設定」内の項目は全て無効になります。
その下の「コメント欄のブログカード表示を有効にする」にチェックを入れれば、コメント内に書き込まれた外部リンクがブログカード化します。
サムネイルスタイル
![](https://starting-marketing.com/wp-content/uploads/2021/11/583759e0afcc9f73cce513a21d1c623f-1.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/583759e0afcc9f73cce513a21d1c623f-1.jpg)
その下の「サムネイルスタイル」では、画像を左右どちらに設置するかを設定します。
リンクの開き方
![](https://starting-marketing.com/wp-content/uploads/2021/11/13748cd7c4469f752a6f40a425db8d06-1.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/13748cd7c4469f752a6f40a425db8d06-1.jpg)
【リンクの開き方】では、外部リンクの開き方を新しいタブで開くかどうか設定できます。
【本文】のタブで「外部リンク設定」の「外部リンクの開き方」で別の設定をしている場合はそちらの設定が優先されます。
キャッシュの保存期間
![](https://starting-marketing.com/wp-content/uploads/2021/11/9a015a42935c9a3a0810660784a088a5.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/9a015a42935c9a3a0810660784a088a5.jpg)
【キャッシュの保存期間】では、ブログカードを最後にクリックしてからキャッシュのリセットをどのくらいの間隔で行うかを設定します。
キャッシュの更新
![](https://starting-marketing.com/wp-content/uploads/2021/11/4b8b3405931bcea924050e549085f3da.jpg)
![](https://starting-marketing.com/wp-content/uploads/2021/11/4b8b3405931bcea924050e549085f3da.jpg)
【キャッシュの更新】では「キャッシュ更新モードを有効にする」にチェックを入れておくと、ページを開いた際にキャッシュを新たに取得します。
ここは、よほどのこだわりが無い限りデフォルトのままで問題ありません。