只今、サイトリニューアル中です。過去記事はこちらから確認できます
PR

WordPressでCocoonを使う

Web作成

Cocoonとは

WordPress用の高機能テーマ

CocoonとはWordPress用のテーマ。国産でありかる無料、多機能なテーマです

カスタマイズ次第では有料版の「SWELL」に近いデザインに近づけることもできます

「Xserver」とも提携しています

更に多様なスキンがあるのでお好みのデザインもできます

Cocoonをダウンロード

ダウンロードする前に

Cocoonは「親テーマ」と「子テーマ」があり、両方ダウンロードする必要があります

親テーマ : Cocoon本体 更新はこの親テーマのみ
子テーマ : デザインや細かい動作などはこのテーマで編集します

「Cocoon 親テーマ ダウンロード」 「Cocoon 子テーマ ダウンロード」をそれぞれダウンロード

親テーマ 「cocoon-master.zip」
子テーマ 「cocoon-child-mater.zip」

Cocoonのインストール

親テーマのインストール

WordPressにログインし、管理画面を開きます
左のメニューにある「外観」から「テーマ」をクリック

画面内にある「新しいテーマを追加」をクリック

「テーマのアップロード」をクリック

「ファイルを選択」をクリックし、ダウンロードした「cocoon-master.zip」を選択し「今すぐインストール」をクリック

※ここでは「有効化」はしません

子テーマのインストール

「テーマページへ移動」をクリック
親テーマの時と同じように「新しいテーマを追加」をクリック

「テーマのアップロード」をクリック

「ファイルを選択」をクリックし、ダウンロードした「cocoon-child.master.zip」を選択し「今すぐインストール」をクリック

ここで「有効化」をクリック 子テーマが有効化されます

Cocoonを手動でインストールする

Windowsなどのローカルサーバーでは上記の方法だとインストールできない場合があります
その場合は手動でインストール必要があります

Windows11(10)での方法

親テーマ 「cocoon-master.zip」をクリック 表示された「cocoon-master」をコピー
     (WordPress)/wp-content/themes/ にペースト(保存)

子テーマ 「cocoon-child-master.zip」をクリック 表示された「cocoon-child-master」をコピー
     (WordPress)/wp-content/thremes/ にペースト(保存)

WordPressの管理画面から「外観」→「テーマ」のページにて「cocoon-child-mater」を有効化

Cocoonにおける親テーマと子テーマの扱い方

親テーマは基本的なデザインを担い、更新も親テーマが行います

一方子テーマはカスタムテーマになります。こちらで編集したデザインなどが優先されます

親テーマが更新されても、ユーザが編集した子テーマはそのまま残る仕様になっています

子テーマでよく使われるファイルは「function.php」「javascript.cs」「style.css」でこの3つのファイルを編集していきます

コメント

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