About
このブログについて
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/grayish-pattern-cat-img-1.jpg)
WordPressTheme Cocoonのスキン、grayishのブログのフロントページを作るデモページです。
各セクションのパターンはダウンロード可能になっています。
使用している画像はダミーです。実際にご利用の際はご自身の用意した画像に置換してください。
PickUp!
上段:大きい横型、下段:4列
New Post
新着記事
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-plugin-autoplay-640x360.png)
Cocoonの新着記事ブロックなどをスライダーにできるプラグイン作りました
新着記事ブロックなどの追加CSSクラスに指定のクラス名を入力することで、自動で横方向にアニメーションするスライダーにできます。
等速で無限ループするタイプと、記事ごとにスナップするノーマルタイプから選択します。
細かいカスタマイズはできませんが、手軽に記事のスライダーをつくることができます。
grayishを使用していないCocoonスキンなしでも動作します。いくつか注意点がありますので、記事の内容をよくご確認になってからご利用ください。
2024.09.06
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-domain-ssl-640x360.jpg)
独自ドメイン取得したら、SSL化(httpからhttpsへ)してからサイトを作ろう。中途半端なSSL化にご注意
サイトを途中まで作ってから独自ドメインのSSL化を行う場合、WordPressでは他にも設定の変更が必要な箇所があります。Cocoonの公式マニュアルを見ながら手順を確認しましょう。
SSL化が中途半端な状態ですとgrayishのロゴ設定機能が動作しないことがあります。
2024.09.02
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-catch-orderedposts-640x360.png)
Cocoon新着記事ショートコードの新機能で任意の記事一覧を表示可能に。初心者さん向けに使い方を解説します
新着記事ショートコードで任意の記事一覧を表示させる手順をショートコードに慣れていない、初心者さん向けに解説します。ナビカードでも同様な記事一覧を作れますが、新着記事ショートコードの新しいオプションordered_postsで記事のIDを指定するだけでよいので、より手軽に作れます。
また、grayishのフロントページ向け配布パターンに含まれている、新着記事表示用パターンでも使用可能です。こちらについても編集手順を説明しています。
2024.08.28
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-header-logo-640x360.jpg)
ロゴ設定の機能追加します。※Cocoon ver2.7.4.1以降で利用可能(24/09/02 独自ドメインSSL化に関する内容の追加)
ロゴ設定の機能追加のお知らせです。Cocoon ver2.7.4.1以降で利用可能です。PC時のフロントページ以外のヘッダーロゴと、モバイル時のロゴを任意の画像に変更可能になります。
テーマカスタマイザーでメディアにある画像を設定できます。
2024.06.132024.09.02
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-mask-pat-640x360.png)
境界線をなみなみ、ギザギザにしてみよう。直線などの区切り線もご紹介。
サイト型フロントページに使えるシリーズ、今回は境界線をなみなみやギザギザにできるCSSを紹介します。
また、画像やカバーブロックを直接円弧、斜めに切り抜きするCSSも紹介します。
さらに区切り線として使用可能な、直線・なみなみ・ギザギザのパターンも配布します。
2024.06.04
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-news-640x360.jpg)
Cocoon ver2.7.3.5でのgrayish不具合情報※ver2.7.4で修正
現在公開されている、Cocoon v2.7.3.5でのgrayishの不具合についてお知らせします。
2024.05.292024.06.03
Category
おすすめカテゴリー3選♪
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/grayish-pattern-cat-img-3.jpg)
Design
フロントページタイプやCocoonブロック、コアブロック、ウィジェットのデザイン見本です。
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-plugin-autoplay-240x135.png)
Cocoonの新着記事ブロックなどをスライダーにできるプラグイン作りました
2024.09.06
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-coccon-tab-blk-1-240x135.jpg)
Cocoonタブブロックのgrayishスタイル見本
2024.04.302024.06.03
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-sitelogoimg-240x135.jpeg)
サイトロゴを簡単に作りたい。CanvaとAdobe Expressの使用例
2023.11.012023.11.27
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-manual-widget-sample-1-240x135.jpg)
ウィジェットの表示場所とスキンスタイル見本
2023.09.022023.11.29
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-catch-canva-2-240x135.jpg)
メインビジュアルやアイキャッチの画像作成には、Canvaがおすすめ
2023.08.262023.11.27
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-Article-block-core-240x135.jpg)
ブロックエディタ見本 コアブロック
2023.08.172024.01.11
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/grayish-pattern-cat-img-2.jpg)
Manual
基本設定からカスタマイズまでマニュアルを揃えています。
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-plugin-autoplay-240x135.png)
Cocoonの新着記事ブロックなどをスライダーにできるプラグイン作りました
2024.09.06
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-domain-ssl-240x135.jpg)
独自ドメイン取得したら、SSL化(httpからhttpsへ)してからサイトを作ろう。中途半端なSSL化にご注意
2024.09.02
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-catch-orderedposts-240x135.png)
Cocoon新着記事ショートコードの新機能で任意の記事一覧を表示可能に。初心者さん向けに使い方を解説します
2024.08.28
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-header-logo-240x135.jpg)
ロゴ設定の機能追加します。※Cocoon ver2.7.4.1以降で利用可能(24/09/02 独自ドメインSSL化に関する内容の追加)
2024.06.132024.09.02
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-mask-pat-240x135.png)
境界線をなみなみ、ギザギザにしてみよう。直線などの区切り線もご紹介。
2024.06.04
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/grayish-pattern-cat-img-3.jpg)
Notes
grayishを使用する際に前もって読んでいただきたい注意事項などをまとめています。
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-plugin-autoplay-240x135.png)
Cocoonの新着記事ブロックなどをスライダーにできるプラグイン作りました
2024.09.06
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-domain-ssl-240x135.jpg)
独自ドメイン取得したら、SSL化(httpからhttpsへ)してからサイトを作ろう。中途半端なSSL化にご注意
2024.09.02
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-news-240x135.jpg)
Cocoon ver2.7.3.5でのgrayish不具合情報※ver2.7.4で修正
2024.05.292024.06.03
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-news-240x135.jpg)
Cocoon ver2.7.3でのgrayish仕様変更のお知らせ
2024.04.252024.04.30
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-news-240x135.jpg)
Cocoon ver2.7.2.2でのgrayish仕様変更のお知らせ
2024.04.012024.04.02
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-news-240x135.jpg)
Cocoon ver2.7.1でのgrayish仕様変更のお知らせ
2024.02.26
Ranking
当サイトの人気記事 shift-mode
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/top-main-cover-640x360.jpg)
フロントページ設定:メインビジュアル
2023.08.012024.01.09
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-Article-font-640x360.jpg)
フロントページ設定:フロントページタイプ
2023.08.012023.12.22
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/grayish-ogp-640x360.jpg)
grayish(グレイッシュ)へようこそ!最初はこの記事から。
2023.09.072024.02.22
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-site-type-640x360.jpg)
サイト型にしたい場合の準備編
2024.02.092024.02.17
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/SPmenu-640x360.jpg)
メニュー設定:タブレット・スマホのヘッダー・フッターモバイルボタン
2023.08.292024.07.15
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/eye-manual-widget-sample-1-640x360.jpg)
ウィジェットの表示場所とスキンスタイル見本
2023.09.022023.11.29
![](https://cocoon-grayish.na2-factory.com/wp-content/uploads/Kaboompics-img-3-1.jpg)
News
2024.09.06カスタマイズマニュアル更新情報
2024.09.02マニュアル確認・注意事項
2024.08.28カスタマイズマニュアル
2024.06.13マニュアル更新情報