WordPressテーマ Cocoon カスタマイズ

WordPressテーマのCocoonをカスタマイズする方法をまとめているサイトを集めてみました。カスタマイズを行う時はいつも参考にさせてもらっています。

何種類かのテーマを使ってきましたが、 Cocoonは機能が豊富で使用するプラグインの数も少なくなる、設定がわかり易い、カスタマイズする時にソースが見やすいことからCocoonに落ち着きました。テーマのバージョンアップも行われており、無料といえど安心して使えるテーマです。

Cocoon

ブロックエディターの複数ブロックをグループブロックを使ってまとめて装飾する方法
ブロックエディターの「グループ」ブロックを利用することで、複数のブロックをまとめて装飾することができます。 複数ブロックをまとめて装飾 まずは本文を以下のように記入します。 次にまとめて装飾したいブロックを複数選択し「段…
ブロックエディターの段落ブロックをスタイルオプションで装飾する方法
ブロックエディターのデフォルトブロックである「段落」ブロックを装飾する方法です。 まずは、段落に文字列を記入します。 ブロックメニューの「スタイル」項目を選択します。 装飾一覧が表示されるので、その中から目的のものを選択…
Cocoon 2.2.1公開。段落・複数ブロックをまとめて装飾する機能を追加。
今回のバージョンアップ(v2.2.1.3)で、ブロックエディターの「スタイル」オプションを追加しました。 以下はv2.2.0.5からの変更点です。 機能追加 段落ブロックにスタイルオプション追加 グループブロックにスタイ…
投稿のメインカテゴリーを選択する方法。意図したカテゴリーをラベルに表示する設定。
Cocoonでカテゴリーを複数選択しているとき、 例えば上記のような選択をしているときで「カスタマイズ」を「アイキャッチ」に表示したいとき、以下のように意図しないカテゴリーラベルが表示されることはないでしょうか? 「パン…
Cocoon 2.2.0公開。投稿のメインカテゴリ設定機能追加。
Cocoon 2.2.0.3にバージョンアップしました。 Cocoon 2.1.9からの変更点。 機能追加 メインカテゴリ機能の追加 外部ブログカードサムネイル編集用のフック追加(詳細) メインカテゴリ機能の追加 カテゴ…

Cocoonテンプレートカスタマイズ

コメントウィジェットの日時フォーマットを変更する方法
ボックスメニューで外部リンクの場合は「新しいタブ」で開くカスタマイズ方法
Cocoonのリンクマネージャー機能を無効にする方法
カルーセルの表示をPHPコードで制御する方法
アピールエリアの表示をPHPコードで制御する方法

ビバ★りずむ

CocoonスライドインのNaviメニュー!背景など可愛くカスタマイズするCSS
Cocoonテーマのアップロード方法!インストールなど失敗する原因・対処方法付き。超初心者さん向け❦
Cocoon親テーマのバージョンアップでWordPress公開ページでエラー!原因の調べ方
Cocoon検索フォームのカスタマイズ!デザイン変更、入力フォーム文字変更
Cocoonタブボックスのタイトルをビジュアルエディタで変更したい!コピペカスタマイズ
Cocoon!headerロゴ・ヘッダー背景画像をCSSだけでページ毎にスタイル変更するカスタマイズ
テーマCocoonで記事内に入れたFont AwesomeのTwitterアイコンがAMPで表示しないので対応させた方法
Cocoon一覧タイトル:h1タグを装飾・h1タグタイトル前に画像を入れる時のCSS
Cocoon!トップに戻るボタンを画像にし、サイズ・hover画像を変えるコピペCSSカスタマイズ
Cocoonナビメニューに階層を付けたとき、孫メニューが はみ出し見えない対処:コピペCSS

リスブロ

【Cocoon】CTAボックスの画像にもリンクさせクリックできるようにする
【Cocoon】デフォルトのボタン色を変更するCSSカスタマイズ
【Cocoon】エントリーカードのカテゴリーラベルを非表示にするCSSカスタマイズ
【Cocoon】スマホ時のロゴ画像ぼやけ対策・サイズの調整方法
【Cocoon】コメント欄を見やすくカスタマイズしてみたよ【CSS公開】
【Cocoon】コメントが来やすいコメントフォームにCSSカスタマイズしてみよう!
【Cocoon】検索窓をオシャレにカスタマイズ!
【初心者向け】CocoonにCSSカスタマイズを追加する方法と適用されない場合の注意点。
決定版!WordPressテーマ「Cocoon」を導入したらはじめに読む記事。
【Cocoon】フォント設定、どれがオススメ? Webフォントで表示速度はどうなる?

WEB-ASHIBI

Parallels Desktop のアップグレード方法や注意点を解説!
macOS Sierra から Catalina にアップグレードしてみた結果
【Cocoon】ヘッダー下にピックアップコンテンツを表示する方法
【Cocoon】ヘッダーのシンプルなカスタマイズ
【Cocoon】サイドバーにおすすめ記事一覧を表示する方法
【MW WP Form】郵便番号で住所自動入力をボタンで実装する
7 Plus から iPhone 11 に機種変更しなかった3つの理由
【Cocoon】アフィリエイトリンクをオリジナルボタン化する方法
簡単!イラストレーターでオシャレなアイキャッチ画像を作るコツ
【保存版】無料で商用利用も可能なフリーイラスト素材サイト58選

Purple Life

『Cocoon』SNSボタン/ソーシャルボタンのカスタマイズ(コピペ)
『Cocoon』お好きな記事の一覧がカンタンに作れるショートコード
『Cocoon』細かいカスタマイズ(まとめ&備忘録)CSSコピペでOK!
WordPressテーマ『Cocoon』に変更Simplicity2後継テーマはマジでスゴイ

PLUS PLUS

Cocoonの投稿記事タイトル上部か下部にカテゴリ・タグを表示させるカスタマイズ
Cocoonのpreで表示させるコードの行間を小さくしてコンパクトにするカスタマイズ
【初心者向け】無料テーマCocoon搭載ショートタグ機能の便利な使い方!
cocoonのサイドバーにあるカテゴリ・アーカイブをカスタマイズ!
Cocoonの目次をおしゃれっぽくカスタマイズする【WordPress】
Cocoonのブログカードラベルの色をそれぞれ変えるカスタマイズ!
Cocoonの新着一覧をオシャレな感じにカスタマイズ【WordPress】
Cocoonでコンテンツエリアをフェードイン表示させるカスタマイズ
Cocoonのプロフィールボックスを有料テーマJIN風にカスタマイズ
【WordPress】Cocoonのヘッダーロゴ表示に動きを付けるカスタマイズ

コメント