【超初心者向け】WordPressテーマ『Cocoon』の導入方法|ダウンロードから有効化までの流れ

この記事では、無料のWordPressテーマ「Cocoon」の導入方法について解説します。

初心者の方でも分かりやすいように、画像を多く使いつつ専門用語にはなるべく解説を入れています。

この記事の手順通りに進めれば問題なくCocoonが使えるようになるので安心してください。

ではさっそく見ていきましょう。

Cocoonを導入する前に
Cocoonを利用する際は、利用規約に同意した上で利用しましょう。
Cocoonの利用規約【公式】

WordPressにCocoonを導入するための、4つの手順

WordPressにCocoonを導入する手順は以下の4つです。

  • 手順①:PHPバージョンを確認する
  • 手順②:Cocoon(親テーマ・子テーマ)をダウンロードする
  • 手順③:Cocoon(親テーマ・子テーマ)をインストールする
  • 手順④:Cocoon子テーマを有効化する

それでは手順ごとに解説していきます。

手順①:PHPバージョンを確認する

必ずPHP7以上でご利用ください。

出典:Cocoon公式

Cocoonが推奨しているPHPバージョンは、7以上です。

「そもそも、PHPバージョンって何?」と思う人も多いかもしれませんが、やることは簡単で以下の2つです。

  1. レンタルサーバーのPHPバージョンを確認する
  2. PHPバージョンが7以下の場合は7以上に切り替える

もし、7以下のPHPバージョンでCocoonを使用するとエラーが出る可能性があります。そのため、PHPバージョンが7以上になっているか確認しましょう。

PHPバージョンの確認・変更する方法

キーワード「(あなたが使っているサーバーの名前) PHP 切替」でGoogle検索をしましょう。すると各サーバーの解説記事が見つかるので、その記事の手順に従って変更してください。


まずはエックスサーバーにログインしましょう。▲ログインしたら「サーバー管理」をクリックします。

▲画面下部の「PHP ver.切替」をクリックします。

▲Cocoonを使用するドメインの「選択する」をクリックします。

▲現在のPHPバージョンが7.〇〇〜になっていれば問題無いのでそのままCocoonのダウンロードに進みましょう。

▲そうでない場合は「PHPバージョン7.〇〇〜(推奨)」を選択して「変更」をクリックしましょう。

これで「手順①」は完了です。

手順②:Cocoon(親テーマ・子テーマ)をダウンロードする

親テーマ、子テーマとは

詳しくは「テーマのカスタマイズは子テーマがあると便利」で後述しますが、WordPressのテーマには、「親テーマ」と「子テーマ」があります。

親テーマだけを使うことも可能ですが、後々のことを考えると子テーマも一緒に使うのがおすすめです。

以下のURLからCocoon公式サイトにアクセスしましょう。
https://wp-cocoon.com/

▲「ダウンロード」ボタンをクリックします。

親テーマをダウンロード

▲ページを下にスクロールすると「親テーマのダウンロード」という見出しがあるので、その下の「”Cocoonテーマ”をダウンロード」ボタンをクリックします。

▲親テーマのダウンロードが始まります。

子テーマをダウンロード

▲ページをさらに下にスクロールすると「子テーマのダウンロード」という見出しがあるので、その下の「”Cocoon子テーマ”をダウンロード」ボタンをクリックします。

▲子テーマのダウンロードが始まります。

これで「手順②」は完了です。

手順③:Cocoon(親テーマ・子テーマ)をインストールする

WordPressの管理画面にログインしましょう。

▲左サイドメニューの「外観」→「テーマ」をクリックします。

親テーマをインストール

▲「新規追加」をクリックします。

▲「テーマのアップロード」をクリックします。

▲「ファイルを選択」をクリックします。

▲「Cocoon-master-〇〇.zip」というファイルを選択します。

▲「今すぐインストール」をクリック。

▲インストールが完了したら「テーマのページに戻る」をクリック。

子テーマをインストール

▲「新規追加」をクリック。

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

▲「ファイルを選択」をクリック。

▲「Cocoon-child-master-〇〇.zip」というファイルを選択します。

▲「今すぐインストール」をクリックします。

これで「手順③」は完了です。

手順④:子テーマを有効化する

▲子テーマのインストールが完了したら「有効化」をクリックします。

▲有効化が完了したら「サイトを表示」をクリックしてみましょう。

▲このようにCocoonのテーマが反映されていれば「手順④」の完了です。

補足:テーマのカスタマイズは子テーマがあると便利

大事なことなので、もう一度書きますが、Cocoonテーマは「親テーマ」「子テーマ」双方をインストールして、「子テーマ」を有効化して利用することを推奨します。

後から、テーマをカスタマイズしたくなった時に必ず活きてきます。

これをやっておくとやっておかないとでは、後からの手間のかかり具合が全然違います。

出典:Cocoon公式

公式でもアナウンスされていますが、Cocoonをカスタマイズする際は子テーマを有効化しておいた方が便利です。

テーマのバージョンアップイメージ図

理由は、親テーマだけを有効化した状態でカスタマイズすると、親テーマのバージョンアップをした際にカスタマイズした内容が消えてしまうからです。

一方、子テーマを有効化した状態でカスタマイズをした場合は、親テーマのバージョンアップをしても問題なくカスタマイズが引き継がれます。

カスタマイズにも種類がありますが、例えば「テーマエディタ」を使ってカスタマイズする場合はあらかじめ子テーマを有効化しておきましょう。そうすれば親テーマを更新してもカスタマイズがリセットされる心配はありません。

というわけで、「親テーマ」「子テーマ」について簡単に説明しましたが、もっと詳しく知りたい方は「WordPressテーマのカスタマイズで子テーマを使うべき理由、使い方など」をご参考ください。

それでは、最後までご覧いただきありがとうございました。

コメントを残す

メールアドレスが公開されることはありません。