Cocoon Cocoonアピールエリアに検索窓を設置する方法【ショートコードで簡単対応】
Cocoonテーマの「アピールエリア」は、注目させたい要素を目立たせるのに便利な機能です。この記事では、このアピールエリアに 検索フォームを設置する方法 を解説します。設置例やショートコード、カスタマイズ方法についてもご紹介しますので、初心...
Cocoon
Cocoon 
Cocoon ファーストビューを印象的に！Cocoonアピールエリアをフルスクリーン＆動きのあるデザインにする方法
Cocoonのアピールエリアは背景画像やテキストを表示することでサイト全体の第一印象を決める大事なパーツ。ここをうまく活用すれば訪問者の関心をグッと引き寄せることができます。この記事では、アピールエリアをフルスクリーン化し、視線を集める印象...
Cocoon Cocoonのタブブロックをもっと便利に！サイドバーでデザインを選べる着せ替え機能
お知らせ2025/5/21 実装コードをより短く、シンプルに修正しました。Cocoonテーマ（2.7.3～）には「タブ」ブロックが標準搭載されており、直感的な切り替え表示が可能です。Tab 1Tab 2Tab 3ここに内容を入力します。ここ...
Cocoon Cocoonの白抜きボックスをカスタマイズ｜複数スタイルと簡単切り替え方法を解説
Cocoonで「白抜きボックス」のデザインをもっと自由に切り替えられたら便利だな──そんな思いから今回のカスタマイズを考えました。白抜きボックスはシンプルなデザインながら、使い勝手の良さが抜群！箇条書きリストなどのブロックも挿入可能ボーダー...
Cocoon Cocoonのアコーディオン（トグル）をもっとおしゃれに！サイドバーから選べるカスタマイズ方法
お知らせ2025/5/22 実装コードをより短く、シンプルに修正しました。アコーディオンボックスを活用することで、情報量の多いページでもスッキリ整理できます。Cocoonテーマにもこの機能が標準搭載されておりとても便利ですが、デフォルトのア...
Cocoon Cocoon新着記事・人気記事・ナビカード対応｜カラム数をクリックだけで自由に変更する方法（横並び）
お知らせ2025/5/22 実装コードをより短く、シンプルに修正しました。Cocoonテーマでは、ブロック機能を使えば簡単に「新着記事」「人気記事」「ナビカード」を表示でき、特にトップページ作成においてとても便利な機能です。ただし、以下のよ...
Cocoon Cocoonのブログカードを自分好みに！見た目を11パターンから切り替えできるCSS簡単カスタム
“必要な情報だけ、シンプルなデザインで”Cocoonのブログカードをもっと自由にカスタマイズしませんか。この記事でご紹介するカスタマイズは、シンプルで見やすい11種類のデザインを、サイドバーからクリック操作だけで切り替え可能。さらに、表示し...
Cocoon Cocoonのタブ見出しボックスを有料テーマ風に！簡単カスタマイズ手順まとめ
Cocoonテーマの「タブ見出しボックス」、もっとおしゃれに使いこなしてみませんか？見出しCocoonのタブ見出しボックスこのブロックはシンプルで使いやすいのが魅力ですが、「線の太さや余白を整えてスタイリッシュにしたい」「ページ内で複数のデ...
Cocoon Cocoonラベルボックスのデザインを切り替え可能に！クリックで選べる6種類のスタイルを実装する方法
──Cocoonの「ラベルボックス」をもっとおしゃれに。Cocoonテーマに標準搭載されている「ラベルボックス」は、シンプルで使いやすいブロックですが、線の太さや余白、見出しの位置などを少し整えるだけで、ぐっと洗練された印象に変わります。見...
Cocoon Cocoonアイコンボックスを簡単カスタマイズ！サイドバーで複数デザインを切り替える方法
「こんなことできたらいいな～」を考えました！この記事では、Cocoonテーマのブロック「アイコンボックス」に、簡単に切り替えられる12種類のスタイルを追加するカスタマイズをご紹介します。このカスタマイズをすることで、視覚的なアクセントが加わ...
Cocoon ワードプレスのカラーパレットを自由に変更・追加する方法【Cocoon対応】
ワードプレスのブロックエディタ（Gutenberg）では、文字色や背景色の変更に便利な「カラーパレット」が用意されています。しかし、標準で用意されている色は原色に近いビビッドなカラーが多く、自分のサイトに合わないと感じることがあるかもしれま...
Cocoon 【Cocoon】SNSでURLをシェアしたときの画像、ちゃんと設定できてる？OGP設定方法
SNSでサイトや記事をシェアしたときにOGP画像を表示する方法をご紹介します。意外と設定していないデフォルトの方が多いのでは？イメージを伝えて読者に訪れてもらえるようなサイトにしましょう。
Cocoon 超簡単！Cocoonのブロック機能でサイト型トップページを作る方法
Cocoonを使ってオリジナルのトップページを作りたいけど、どこから手を付けたらいいかわからない……そんな方に向けて、ワードプレステーマ「Cocoon」とブロックエディタ（Gutenberg）を活用した、サイト型トップページの作成手順をわか...
Cocoon Cocoonで作るサイト型トップページ｜オシャレなSWELL風（HTML、CSS使用）
「Cocoonでブログを運営しているけれど、トップページを“サイトっぽく”見せたい」──そんな方に向けて、固定ページ＋HTML＋CSSを活用した「サイト型トップページ」の作成方法を丁寧に解説します。この記事では、コードをそのままコピペできる...
Cocoon Cocoonでフルワイド化｜画面いっぱいに幅を広げる＋セクション背景色をつけるカスタマイズ
ワードプレステーマ「Cocoon」はシンプルで扱いやすい反面、画面いっぱいに広がる“フルワイドデザイン”を実現するには少し工夫が必要です。「もっとおしゃれなサイトにしたい」「SWELLのような幅いっぱいのトップページをCocoonでも作りた...
Cocoon Cocoonでピックアップ記事表示するならナビカード！横並び、リボンのスタイルを可愛くカスタマイズ
今回ご紹介するのは、Cocoonの便利な機能『ナビカード』です。特定の記事やコンテンツを目立たせたいときに簡単にピックアップ表示ができるこの機能。Cocoonに標準搭載されていますが、意外と使ったことがない方も多いのではないでしょうか？ナビ...
Cocoon Cocoonカスタマイズの基本｜HTML・CSSの編集とワードプレスをバックアップする方法
ワードプレスのカスタマイズは、サイトの見た目や使いやすさをぐっと向上させてくれます。特にHTMLやCSSを編集することで、細かなデザイン調整やレイアウトの変更も可能に。でも、「どこに書いたらいいの？」「間違えたら元に戻せるの？」と不安になる...
Cocoon Cocoon人気記事ランキング｜表示方法とラベルの色やスタイルを変更するカスタマイズ
Cocoonテーマには独自のアクセス集計機能が搭載されており、そのデータを元に簡単に人気記事ランキングを作成できます。サイドバーやトップページに設置すれば、読者の目を引きやすく記事の回遊率アップにもつながります。この記事では以下の２点につい...
Cocoon Cocoonの通知エリアをカスタマイズ！流れる文字アニメーションとボタンを設定する方法
Cocoonでは、テーマ標準機能を使って通知エリアを簡単に表示できます。通知エリアは、サイト訪問者に重要なメッセージを伝えたり、特定のページへ誘導するための便利な機能です。この記事では、以下の通知エリアのカスタマイズ方法を紹介します。通知エ...
Cocoon Cocoonでアフィリエイトリンクを効果的に配置！自作CTAボックスの作り方と活用法
この記事では、ワードプレステーマ「Cocoon」を使ったCTAボックスの作成手順と活用法を解説します。初心者でも簡単に作成でき、アフィリエイトリンクの効果的な配置に役立ちます。なお、具体的な作成手順は有料公開となっています。詳しくは「作成手...