>> テーマ変更に伴い見づらい箇所や不具合があるかもしれません、ご迷惑をおかけします。→
PR

Cocoonオリジナルスキン:和の色(ピンク)

Cocoon・スキン
この記事は約5分で読めます。

この記事は、Cocoonの独自スキン「和の色」6色のピンクバージョンの詳細になります。

その他のカラーは以下をご覧ください。

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

2020/05/25

・カテゴリー・タグウィジェットデザインを追加。
・Ver2.1.6~の新機能「フロントページ」のインデックスデザインも追加。

 

Cocoonスキン:和(ピンク)

 

Cocoonスキン和(ピンク)

 

基本カラー

ピンク

ピンク #b99d9a #d4bdba #ede5e4
グレー #5d5855 #89817f #d9d9d9

 

ヘッダーとグローバルナビ

和(ピンク)スキン:ヘッダー

 

 

フロントページインデックス

2020/05/25 Ver2.1.6~の機能です。

和(ピンク)スキン

 

「もっと見る」ボタン ホバー時

和(ピンク)スキン

 

エントリーカード

記事一覧でのカード表示

和(薄いブルー)スキン:エントリーカード

 

マウスが乗った時は背景色を変えてふわっと浮き上がります。

和(ピンク)スキン:エントリーカード

ブログカード

上記エントリーカードと動きと色は同じで枠線ありになります。

和(薄いブルー)スキン:ブログカード

 

オンマウス時

和(ピンク)スキン:ブログカード

ページネーション

 

和(ピンク)スキン:ページネーション

 

 

サイドバー見出し(h3)

 

和(ピンク)スキン:サイドバー見出し(h3)

フッター見出し(h3)

和(ピンク)スキン:フッター見出し(h3)

 

カテゴリー・タグウィジェット

和(薄ピンク)スキン

記事内見出し(h2~h5)

 

和(ピンク)スキン:記事内見出し(h2~h5)

 

目次

和(ピンク)スキン:目次

 

 

SNSボタン

 

和(ピンク)スキン:SNSボタン

テーブル

 

和(ピンク)スキン:テーブル

コメント送信ボタン

 

和(ピンク)スキン:コメント送信ボタン

 

ダウンロード

CSSを記述したスタイルシートのみにしていますので軽量です。

すべて3kb程度のZIP形式圧縮ファイルです。それぞれを解答するとフォルダにCSS(style.css)が1つ入っています。

 

フォルダ:skin-wa-pink

 

サーバーへのアップロードについて

ダウンロードしたファイルを解凍し、Cocoon子テーマのskinsフォルダフォルダごとアップロードしてご利用下さい。

 

アップロード場所
/wp-content/themes/cocoon-child-master/skins

 

サーバーへアップロードするには、FTPソフトやSFTPソフトを使います。

サーバーへのファイル転送は、セキュリティ的にFTPよりSFTPの方が安全です。

 

SFTPの使い方は以下をご覧ください。

 

FTPの使い方は以下を参考にして下さい。

 

 

このスキンをカスタマイズ

タブ切替メニュー

2020/05/25追記

Ver.2.1.6~フロントページ用のインデックスにタブも選択可能になった為、トップページのみで使いたい場合は、標準機能でOKかと思います。

詳細は以下の公式サイトをご覧ください。

 

ですので、この部品は以下の場合などに改変してご利用下さい。

  • 各ページのヘッダーや、記事上などに記事一覧を表示したい場合
  • タブの内容を記事一覧ではなく普通のテキストエリアとして使う場合

 

タブで切り替えて、カテゴリー別の最新記事などを表示できるデザイン部品も作成しています。

和(ピンク)スキン用タブメニュー

このスキン用の6色のデザインをコピペ出来ます。

Cocoonのスキン「和の色」用部品:カテゴリー、タグウィジェット
Cocoonの独自スキン「和の色」6色バージョンに使えるタブ切替メニューのデザインです。 元のスキンは以下です。 タブ切替メニュー部品もあります。 サンプル カスタマイズ方法 簡単なCSS追記のみです。 CSS追記は以下のいずれかから行って...
Cocoonのスキン「和の色」用部品:タブ切替メニュー
Cocoonの独自スキン「和の色」6色バージョンに使えるタブ切替メニューのデザインです。 元のスキンは以下です。 カテゴリー・タグウィジェット部品もあります。 このスキン用の5色のデザインをコピペ出来ます。 タブ切替メニュー サンプル 初期...

 

 

その他のオリジナルスキン

その他にもオリジナルスキンを作っています。

黒×ビビッドカラー:5パターン

 

Cocoonのスキン「黒を基調にビビッドカラー5パターン」(Ver2.1.6~対応)
Cocoonの独自スキン「黒」を基調にしたバージョンを作成しました。 2020年3月29日 ブルーとグリーンの2色追加しました。 2020年5月11日 少しデザイン追加し、ダウンロードファイルは軽量化しました。 2020/05/25 ・カテ...

 

 

2020TOKYOオリンピック

 

Cocoonのスキン「2020 TOKYO」オリンピックエンブレムカラー
Cocoonの独自スキン「2020年東京オリンピック」バージョンを作成しました。 2020年東京オリンピックエンブレムの紺と赤を使ったスキンです。 参考:東京2020公認マークガイドライン(PDF) 2020/05/22 カテゴリー・タグウ...

 

プロ野球12球団

 

Cocoonのオリジナルスキン:日本プロ野球シリーズ(Ver2.1.6~対応)
Cocoonの独自スキン、プロ野球の球団テーマカラーを基調にしたシリーズです。 2020/05/25 すべてのスキンを更新しました。 各スキンに、Ver2.1.6~の新機能「フロントページ」のインデックスデザインも追加。 セリーグ 読売ジャ...

 

 

コメント

タイトルとURLをコピーしました