Cocoonの使い方やカスタマイズとオリジナルスキン

Cocoon

Cocoon・カスタマイズ

コピペで!Cocoonのグローバルナビをカスタマイズ

Cocoonのグローバルナビバーをカスタマイズしてみます。 コピペで実装できます。お好きなカラーに色変更してご自由にご利用下さい。 アイコンフォント設定方法や、その他のカスタマイズは以下も参考にして下...
Cocoon・使い方

Cocoonでシンタックスハイライトを使う方法(ソースコード表示)

シンタックスハイライト(構文強調 ) とは、テキストエディタの機能で、テキスト中の一部分を、コードの種類・その分類ごとに異なる色やフォントで表示するもので、サイト上でソースコードを表示したい際などに、...
Cocoon・使い方

Cocoonでプロフィール欄を表示する方法と設定

Cocoonは、ウィジェットを使って記事の下や、サイドバーなど 任意の場所にプロフィール欄を簡単に設置出来ます。 プロフィール用画像も、通常は「Gravatar」を使うかプラグインなどを利用しますが、...
スキン

Cocoonのオリジナルスキン「和の色」6色を作りました(Ver2.1.6~対応)

Cocoonの独自スキン「和の色」6色を作成しました。 2020年5月 薄いブルーを追加しました。 2020/05/25 ・カテゴリー・タグウィジェットデザインを追加。 ・Ver2.1.6~の新機能「...
スキン

Cocoon用オリジナルスキン24種:ビビッドカラー・和色・プロ野球など

Cocoon用のオリジナルスキンまとめです。 Cocoonに標準装備の同梱スキン一覧は以下をご覧ください。 2020/05/25 すべてのスキンを更新しました。 各スキンに、Ver2.1.6~の新機能...
Cocoon・設定

Cocoonでヘッダーレイアウトやロゴを設定する方法と表示パターン

Cocoonでヘッダーレイアウトを設定する方法と、レイアウトパターンサンプル紹介、ロゴの設定方法などを解説していきます。 ヘッダー設定 「Cocoon設定」から行います。 「ヘッダー」タブを開きます。...
Cocoon・設定

SerchConsoleで「HTML タグに必須属性がありません」対処法(Cocoon)

Google Serch Console で、以下のようなエラーが出た場合 HTML タグに必須属性がありません。 AMPのロゴ画像を適切なサイズで設定する事で、簡単に解決できます。 解決方法 Coc...
Cocoon・カスタマイズ

Cocoonの文字装飾ボックススタイルをカスタマイズ(アイコン)

Cocoonに初めから用意されている文字装飾のスタイルを好みのデザインや色にカスタマイズしてみます。 文字装飾の一覧は以下にまとめています。 この記事はボックス(アイコン)のカスタマイズ方法です。 カ...
Cocoon・カスタマイズ

コピペで!Cocoonトップページなどに使えるタブ切替メニュー18色

タブで切り替えて、カテゴリーごとの最新記事一覧などを表示するサンプルです。 2カラムレイアウトやボタンなどのデザインや 人気記事一覧表示のショートコードも、 Cocoon標準の機能を利用しています。 ...
Cocoon・カスタマイズ

Cocoonで評価・ランキングの★を好きな場所で表示する方法

Cocoonにはランキング機能があり、評価の★を5段階(0.5刻み)に表示する機能があります。 ランキング機能のサンプル この機能で設定されている★を使って、好きな場所で5段階評価を表示する方法です。...
スポンサーリンク