サイト型トップページの作り方を公開しています!Check

デザイン切り替え

  • 「Cocoonって便利だけどデザインがちょっと味気ない…」
  • 「有料テーマみたいにオシャレな見た目にできたらいいのに」
  • 「難しいCSS編集は苦手。でも人とは違うデザインにしたい!」

そんなお悩み、5分で解決できます。

サイドバーで選ぶだけ。

  • ワンクリックでデザインを自由に切り替え
  • 同一ページ内で異なるデザインを組み合わせOK
  • 一度導入すれば、サイト全体で使い回せる

実装はとってもカンタン

必要なのは、コードを2か所に貼り付けるだけ
初心者でも迷わず設定できるように、具体的な手順(コード)を記載しています。

機能性と見た目の両立を、このカスタマイズで実現しませんか?

すべて、このサイトで実装しているお気に入りばかりです。

Cocoon

Cocoonタイムライン(ステップブロック)おしゃれ化カスタマイズ|最大6種類のデザイン切り替え

2025.9.26_選べるデザインにステップ式(番号)を追加しました。NEW!WordPressテーマ「Cocoon」には、標準でタイムラインブロックが用意され...
Cocoon

カラム固定を解消!Cocoonボックスメニューを2〜6列に切り替える方法

Cocoonのボックスメニューは、アイコン付きのメニューを簡単に設置できる便利な機能。サイトの回遊性を高め、読者を目的のページへスムーズに導く効果があります。し...
Cocoon

Cocoonラベルボックスをシンプル&おしゃれにカスタマイズ!使い方・デザイン例・CSSコードまとめ

Cocoonの「ラベルボックス」情報をまとめるのに便利な機能ですが、余白が狭かったり、見出しの後ろに線が残ったりして、もう少しすっきりさせたいという声もよく聞き...
Cocoon

Cocoonアコーディオン(トグル)をカスタマイズ!10種類のデザインでスッキリ魅せる

2025.8.28 デザインと実装コードを見直し、よりシンプルに修正をおこないました。WordPressテーマ「Cocoon」のアコーディオンボックス、使ってい...
Cocoon

Cocoon白抜きボックスをおしゃれにカスタマイズ!複数デザインの使い分け方法

更新情報2025.10.10_デザイン2種追加しました「影付き」「ステッチ(白)」Cocoonの「白抜きボックス」は、箇条書きやカスタムカラーが使えるシンプルな...
Cocoon

Cocoonブログカードをカスタマイズ!タイトル・サムネイル・抜粋文・URL表示をワンクリック選択

2025.9.26 テキストリンクスタイルの微調整をおこないました。有料テーマSWELLではブログカードの表示スタイルを自由に切り替えられるのをご存じですか?「...
Cocoon

Cocoonタブブロックの使い方&おしゃれカスタマイズ|ワンクリックで12デザイン切替

2025.8.28 デザインと実装コードを見直し、よりシンプルに修正をおこないました。WordPressテーマCocoon(2.7.3~)に標準搭載された、待望...
Cocoon

Cocoonタブ見出しボックスをカスタマイズ!おしゃれデザイン切り替えで使いやすく

2025.10.01更新:選べるデザインに「リボンタイプ」「丸吹き出し」を追加しました。Cocoonの「タブ見出しボックス」はシンプルで使いやすいですが、もっと...
Cocoon

Cocoonアイコンボックスをおしゃれにカスタマイズ|クリックで簡単デザイン切り替え

2025.8.26 デザインと実装コードを見直し、修正をおこないました。Cocoonアイコンボックスは、アイコンとテキストを組み合わせた魅力的なボックスデザイン...
Cocoon

Cocoon新着・人気記事・ナビカードを横並びに!カラム数をワンクリックで変更する方法

Cocoonの新着記事・人気記事・ナビカードを横並びに表示する方法を解説。PC3列・スマホ2列などカラム数もワンクリックで切り替え可能。コピペで簡単導入できます。
スポンサーリンク