PR

WordPress Cocoonテーマヘルプ

cocoon

2025.01.132025.03.02

SEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100％GPLテーマです。

投稿や固定ページに対して管理画面にメモを残す機能について

投稿・固定ページの管理ページにメモを残す機能を追加しました。備忘録や連絡事項などに利用できます。

投稿や固定ページに対して管理画面にメモを残す機能について

投稿・固定ページの管理ページにメモを残す機能を追加しました。備忘録や連絡事項などに利用できます。

アーカイブ（インデックス一覧等）に特定の投稿を表示させない方法

投稿一覧リストに特定の投稿を表示させたくない場合の設定。

フィード（RSS等）に特定の投稿を表示させない方法

RSSフィードなどに特定の投稿を表示させたくない場合の設定方法です。

Google検索結果に星評価を表示する方法（レビュー構造化データの出力）

レビュー用のJSON-LD構造化データを出力して、Google検索結果などに星評価を表示させることができます。

アクセス集計機能の説明

Cocoonのアクセス集計機能に関する解説です。使用することで、管理者はアクセス状況を把握しやすくなるという利点もありますが、多少なりともサーバーに負荷をかけてしまうという難点もあります。

アフィリエイトタグの一元管理機能の使い方

アフィリエイトタグのマネージャー機能の使い方です。広告タグを一元管理することで、タグの張り替えや、テキスト修正などを容易に行えるようになります。

テーマ設定のバックアップ方法

「Cocoon設定」にあるテーマ設定をテキストファイルに書き出してバックアップする方法の紹介です。

テーマ設定の復元（リストア）方法

「Cocoon設定」のバックアップデータから、設定状態を復旧する方法です。

Amazon商品リンクキャッシュを削除する方法

Amazon商品リンクのキャッシュ削除機能の使い方。加えて、Cocoonテーマの商品リンクキャッシュ体制の説明です。

テンプレート文（定型文）を登録して使い回す方法

テーマ内に定型文を登録してショートコードで何度でも使い回す方法です。

商品・サービスランキングを作成して配置する方法

商品やサービスなどの独自ランキングを作成してウィジェットで配置する方法の紹介です。ランキング機能の使い方。

インデックスページのエントリーカード毎にPV数を表示する方法

インデックスページで一覧でPV数を把握したい場合の設定。

広告（AdSense）を手っ取り早く設定する方法

Cocoonテーマ利用時における、最も簡単なAdSense広告設定方法の紹介です。

[ad]ショートコードで広告を本文中の好きな場所に表示する方法

広告用のショートコードを用いて投稿者が「広告を出したい！」という場所にズバリ広告を表示させる方法です。

ads.txtファイルの編集方法

ads.txt（アズテキスト）とは、Webの広告枠の販売者を厳密に管理し、偽の広告枠が広告主に提供されるのを防ぐためのテキストファイルです。Adsenseのみなどを除く、第三者（他社）広告との併用配信をする際は設置が必須なファイルとなってい...

ステマ規制に対応するためのPR表記設定について

2023年10月施行の通称ステマ規制において、「不当表示」とならないように対応が必要となりました。詳細はこちらなどをご参照ください。参考 2023年10月施行の景品表示法の指定告示（通称ステマ規制）に関するお知らせ - A8スタッフブログ参...

バリューコマースのLinkSwitchに対応させる方法【AMP対応】

CocoonをバリューコマースのLinkSwitchに対応させる方法です。通常リンクがアフィリエイトリンクに置き換わります。AMPページにも対応しています。

Font Awesome5を利用する方法

サイトで利用されているアイコンフォントをFont Awesome5に変更したり、Font Awesome4に戻したりする方法です。

サイトアイコンを設定する方法（ファビコン、アップルタッチアイコン等の設定）

テーマ用のファビコン、アップルタッチアイコン、マイクロソフトメトロスタイルの、タイル表示に使用するアイコンの設定です。

ページが存在しません | Cocoon

WordPress無料テーマ

ページが存在しません | Cocoon

WordPress無料テーマ

GoogleタグマネージャのトラッキングID設定方法

タグマネージャ登録をするとアナリティクスのトラッキングID登録は不要です。

Google Analytics（GA4）でアクセス解析をする方法

CocoonでGoogle Analytics 4（以下、GA4）の設定方法を紹介します。GA4でアクセス解析をするには、「Google Analytics」を用いた方法と、「Googleタグマネージャー」を用いた方法がありますが、以下では...

Google Search Consoleに登録する方法

Google Search Console用のサイト認証タグを表示させてサイト登録を行う方法です。

Cocoonでヒートマップ分析ツールのClarityを利用する方法

無料で使えるWEBサイトヒートマップ分析ツールの「Clarity（クラリティー）」を利用する方法を説明します。CocoonにClarity設定を行うことで、以下のような「クリック分析」を行ないコンバージョン分析をしたり「スクロール分析」で何...

Amazon APIのアクセスキーとシークレットキーを取得する方法

Amazon商品紹介リンク用の認証機能を取得＆登録方法です。Amazonアソシエイトからアクセスキーとシークレットキーを作成登録する方法です。

AmazonアソシエイトのトラッキングIDを入手する方法

AmazonアソシエイトからトラッキングIDを取得して、Cocoonの商品紹介リンクで利用するために設定する方法です。

Amazon商品リンクのカタログ写真表示オプションの使い方

Amazon商品の関連写真をカタログ形式でブログパーツに表示する機能です。

404 NOT FOUND | Cocoon Sample Site

CocoonのWordPressサンプルサイト

Amazon商品リンクの価格を表示する方法

Amazon商品リンクに対して、商品の価格情報を表示する方法夜です。全体的に設定する方法とショートコードで個別に設定する方法があります。

Amazon商品リンクにレビューリンクを表示する方法

阿波像商品リンクショートコードでのレビューリンクの表示設定方法。

楽天アプリケーションIDの取得方法

楽天商品リンクショートコードを利用するには、楽天アプリケーションID（楽天デベロッパーID）を取得する必要があります。楽天商品リンクの詳細はこちら。楽天ウェブサービスからアプリケーションIDを取得楽天にアプリ登録をしていない場合は、まずはこ...

楽天アフィリエイトIDの取得方法

楽天ウェブサービスからアフィリエイトIDを取得して設定登録する方法です。

楽天商品リンクに価格を表示する方法

楽天商品リンクに対して、商品の価格情報を表示する方法夜です。全体的に設定する方法とショートコードで個別に設定する方法があります。

バリューコマースでYahoo!ショッピングのsidとpidを取得する方法

バリューコマースでYahoo!ショッピングと提携しsidとpidを取得し設定登録する方法です。

Amazon・楽天商品リンクにメルカリボタンを表示する方法

Amazon商品リンクや楽天商品リンクで「メルカリ」検索ボタンを表示する方法を説明します。メルカリアンバサダーに登録メルカリボタンを表示するには、メルカリアンバサダーに登録する必要があります。メルカリアンバサダーに登録するには、以下のページ...

Amazon・楽天商品リンクに「DMM」検索ボタンを表示する方法

DMMアフィリエイト用の「検索ボタン」を表示する設定手順です。

商品リンク機能を、もしもアフィリエイト経由にする方法

Amazon商品リンクのURLを「もしもアフィリエイト」のURLに変換する機能の使い方です。

もしもアフィリエイトでAmazonのa_idを取得する方法

Amazon商品リンクをもしもアフィリエイト経由にする場合、AmazonプロモーションからIDを取得する必要があります。そのIDの取得方法です。

もしもアフィリエイトで楽天のa_idを取得する方法

Amazon商品リンクをもしもアフィリエイト経由にする場合、楽天市場プロモーションからIDを取得する必要があります。そのIDの取得方法です。

もしもアフィリエイトでYahoo!ショッピングのa_idを取得する方法

Amazon商品リンクをもしもアフィリエイト経由にする場合、Yahoo!ショッピングプロモーションからIDを取得する必要があります。そのIDの取得方法です。

アピールエリアの背景画像を設定する方法（背景画像の固定など）

アピールエリア（別名：ヒーローエリア）に背景画像を設定する方法を説明します。背景画像の設定方法アピールエリアに背景画像を設定するには、まず「Cocoon設定」→「アピールエリア」タブを選択してください。「エリア画像」に画像を選択してください...

アピールエリアで背景画像だけを表示する方法（文章部分を非表示にする）

アピールエリア内にあるテキストやメッセージやボタンを全て非表示にしたい場合の設定方法です。

内部ブログカードを表示する方法

内部ブログカードを記事本文内に表示させる方法です。URLを記入するだけで利用できます。

囲みブログカード拡張スタイルの使い方

ブログカード作成用のURLを囲むだけで様々なタイプのブログカード表示ができるようになる機能の使用方法です。

URLをブログカード化せずに文字列（URLリンク）として表示させる方法

ブログカードを無効化してテキストURLのみを表示する方法。

コメント欄のURLをブログカード化する方法

コメント入力されたURLブログカードで表示する設定方法です。

ヘッダー下にお勧め記事カルーセルを表示する方法

お勧め記事を回転表示させることができるカルーセル機能の使い方です。

ソースコードをハイライト表示させる方法

テーマ内でソースコードをハイライト表示し、見やすくする方法の紹介です。highlight.jsプラグインのみを利用したシンプルなものを実装しています。

ソースコードに行番号を表示する方法

highlight.jsを用いたソースコード表示に対して、行番号を表示できる機能を追加しました。

Cocoonのコードハイライト機能で多言語に対応する方法（highlight.js）

highlight.jsがハイライト表示できる全ての言語に対応させる方法です。

Cocoon設定の「カラム幅変更」で変わる場所の説明。

カラム幅設定により太さなどが変更される位置を詳しく説明。

テーマが利用しているサムネイルを再生成して最適化する方法（画像の大きさを揃える）

Force Regenerate Thumbnailsプラグインを用いて、テーマ上のサムネイルを再生成し、画像できるだけ綺麗に表示する方法の紹介です。

Cocoon設定の「カラム幅変更」で変わる場所の説明。

カラム幅設定により太さなどが変更される位置を詳しく説明。

コメント入力欄表示をボタンで切り替えられるようにする方法

コメント入力フォームの表示をトグルボタン状に切り替えられるようにする方法です。

コメント入力の案内文を表示する方法

コメントを入力する際に注意文などを読者の目に触れる場所に置きたいときに設定します。

本文の「行の高さ」と「行間の余白」を変更する方法

本文中の余白を変更して読みやすさを調整できます。

レスポンシブテーブルを利用している際に1列目を固定表示する方法

テーブルをレスポンシブ表示にしている際に、テーブルの最初の列を固定表示する設定方法です。

「記事を読む目安時間」を表示する方法

記事を読む際に「この記事はどれくらいの時間かかるのか？」ということを訪問者にわかりやすく伝えます。

Gutenbergカラーパレットに好みの色を追加する方法

Gutenbergのカラーパレットに好みの色を追加する方法。

ヘッダーを固定する方法※PCのみ

パソコンの場合、ヘッダーメニューなどをトップに固定する方法です。

ヘッダーのサイズを背景画像に設定したアスペクト比を保つように設定する方法

Cocoon設定の「ヘッダー」に「背景画像の全てを表示」オプションを追加しました。これにより「ヘッダー背景画像」に設定した画像を待つことなく全て表示できるようになりました。設定方法この設定を行なうにはCocoon設定の「ヘッダー」の「ヘッダ...

Cocoonの画像拡大効果（Lightbox）ライブラリ各々お勧めの使いどころ

写真を暗転し拡大して表示するLightbox効果のあるJavaScriptライブラリの使いどころを紹介しています。

テーマ全体のサムネイル画像の縦横比（アスペクト比）を変更する方法

テーマで利用されているサムネイル画像のアスペクト比を変更したい場合に一括して変更する方法です。

テーマのサムネイルをRetinaディスプレイ対応させる方法（スマホで画像がぼやける対策）

Cocoonテーマ内のサムネイル画像をRetinaディスプレイ対応させる機能の紹介。

NO IMAGE画像を変更する方法

Cocoonデフォルトの味気ないNO IMAGE画像を自前で用意した画像に入れ替える方法です。

エントリーカードの設定方法（一覧ページのカードの種類）

インデックスページ（一覧ページ）のカードスタイルの見本です。スタイルの変更方法も。

テーマが利用しているサムネイルを再生成して最適化する方法（画像の大きさを揃える）

Force Regenerate Thumbnailsプラグインを用いて、テーマ上のサムネイルを再生成し、画像できるだけ綺麗に表示する方法の紹介です。

特定のカテゴリー属する投稿をアーカイブ（インデックスリスト等）に表示しない方法

アーカイブの一覧から特定のカテゴリを除外する方法。

ヘッダーモバイルボタンの設定方法

スマホ画面でヘッダーに操作ボタンを表示させる設定方法です。

フッターモバイルボタンの設定方法

スマホ画面のフッターに表示されるスライドインメニューボタンのカスタマイズ方法の解説です。

グローバルメニューのアイテム幅をテキストサイズに合わせる方法

グローバルナビのトップメニューアイテムの横幅をテキスト幅に合わせるカスタマイズ方法です。

サイト全体に表示されるメッセージ通知エリアの設定方法

サイトを訪れた方になるべく見てもらいたいメッセージを表示したり、ページ誘導するための機能です。

httpページを簡単https化（SSL対応）する方法

Cocoonは、簡単にhttpサイトからhttpsサイトに変更できる機能をサポートしています。SSL対応で最も危険なのはデータベース内容の置換です。Cocoonでは、データを置換することなく表示前にSSL対応されたコンテンツとして出力します...

CocoonをKUSANAGI環境に対応させる方法。

KUSANAGI環境だと、Wordpressのファイル操作ができない場合があります。Cocoonでは、KUSANAGI環境でも、利用できるように補助機能があります。

ページが存在しません | Cocoon

WordPress無料テーマ

サイトアイコンを設定する方法（ファビコン、アップルタッチアイコン等の設定）

テーマ用のファビコン、アップルタッチアイコン、マイクロソフトメトロスタイルの、タイル表示に使用するアイコンの設定です。

ヘッダー下に任意の画像リンクを追加できる「おすすめカード」機能の使い方

サイト内回遊率の改善に、ヘッダー下画像リンクの作り方。

テーマの設定をリセットする方法

テーマ設定を初期状態に戻す方法です。

リファラーの振る舞いを変更する「リファラー設定」をする方法

リファラー設定を行なうことで、リンク先のサイトに「自サイトの情報をどれだけ送るか」を設定することができます。以下では、リファラー設定のやり方を紹介します。リファラーの振る舞いの設定方法リファラー設定を行なうには、Cocoon設定から「SEO...

ページ送りナビの表示位置を変更する方法

ページ送りナビの位置を本文下、関連記事上、関連記事下、コメント下に

同一のカテゴリーに属する投稿をページ送りナビに表示させる方法

ページ送りナビに同一カテゴリー設定をする方法です。

ページ送りナビに表示させたくないカテゴリーを除外する方法

カテゴリー単位でページ送りナビに表示する投稿を制御する方法です。

SNSシェア・フォローボタンの表示をページタイプごとに切り替える方法

SNSボタンを表示できるページタイプを設定できます。

httpsサイト化後http時代のフォロー数を取得する方法

サイトのSSL対応後、以前のhttpスキームのSNSフォロー数（feedly購読者数）を取得したい場合の設定方法です。

SNSシェア・フォローボタンの表示をページタイプごとに切り替える方法

SNSボタンを表示できるページタイプを設定できます。

Facebookのシェア数を表示させる方法（アクセストークンの取得）

Facebook for Developersにアプリを作成して、アクセストークンを取得しシェアカウントを取得する方法です。

httpsサイト化後http時代のシェア数を取得する方法

サイトのSSL対応後、以前のhttpスキームのSNSシェア数を取得したい場合の設定方法です。

不要なウィジェットエリアを非表示にする設定方法。ウィジェット設定画面の操作性向上に。

使用して以来ウィジェットエリアを管理画面や公開画面から

不要なウィジェットを非表示にする設定方法。ウィジェット設定画面の操作性向上に。

不要なウィジェットを管理画面上や公開場面上で表示させないようにする設定方法です。整理整頓することでウィジェット管理画面の操作性が上がります。

自作の吹き出しを作成して利用する方法

サイト訪問者にわかりやすく表示できる吹き出し機能の利用方法です。アイコンのセリフのように表示させることで、訪問者に分かりやすく説明できるかもしれません。

Cocoonおすすめのサイト高速化設定

Cocoonと相性の良いページの高速化設定方法の紹介です。Cocoonデフォルト機能だけでも十分にPageSpeed Insightsで高得点が狙えます。加えて、ページキャッシュプラグインや、画像最適化プラグインを利用すれば、より良い良いパ...

ナビカードウィジェットの使い方

ナビカードウィジェットを利用するには、メニュー設定を行ってからウィジェット設定をする必要があります。

おすすめカードウィジェットの使い方

画像付きのおすすめメニューをテーマ内の好きな位置に挿入できる「おすすめカードウィジェット」の利用方法の説明です。

スキン内のJSONファイルでCocoon設定値を制御する方法

Cocoon設定の設定値をoption.jsonファイルからJSON形式のテキストを入力することで制御する方法です。

Post Views: 177

コメント