このページを見ると、初めてWordpressをインストールした方でも、「無料テーマでおすすめのテーマCocoon」を設定することができます。
テーマはまた後で変更することもできますので、とにかく最初、どうデザインを設定すればいいか悩まれていて、早くブログを開始したい方はご参考ください。
まだWordpressをインストールしていない方は以下の「関連ページの情報をご参考いただき、Wordpressをインストールしてからご覧ください。
イメージしたデザインが具体的にあって、そのイメージを実現したく悩まれている方は当店にお問い合わせください。
目次
無料のWordpressテーマ「 Cocoon(コクーン)」を使ってみる
まずブラウザの検索で「Cocoon」のテーマをダウンロードする
Chrome等の検索で
「wordpress Cocoon」
と検索します
表示された結果から「Cocoon | WordPress無料テーマ」をクリックし、「ダウンロード」ボタンをクリックします
※動作環境
PHP7、WordPress5.3以上
親テーマも子テーマもインストールする
※動作確認サーバー（問題なく動作しているサーバー）
- カラフルボックス
- ConoHa WING
- mixhost
- エックスサーバー
- ロリポップ！
- JETBOY
- ヘテムル
- wpX Speed
- シックスコア
- さくらのレンタルサーバ
- バリューサーバー
- IQサーバー
- CPIレンタルサーバー
ページ中ほどにある「Cocoonテーマをダウンロード」をクリック（これが親テーマになります。）
ページをもうちょっと下のほうまでスクロールして、「子テーマ」もダウンロードします。
Wirdpress管理画面にログイン
WordPress管理画面にログインします。
外観＞テーマ
に入ります
「新規追加」をクリックしましょう
「テーマのアップロード」をクリックします
Cocoonの親テーマをアップロード
「ファイルを選択」をクリックして、ダウンロードした「親テーマ」のほうを選びます。
圧縮したZIPファイルが保存されますので、解凍しないでそのままアップロードしましょう。
親テーマのファイル名は今回の場合「cocoon-master-2.2.4.5.zip」というファイル名です。
※ダウンロードしたファイルは通常、PCのダウンロードフォルダに保存されますので、ダウンロードフォルダから選びます
「今すぐインストール」をクリック
アップロードエラーが出てしまった方のみ、もう一度Cocoonのサイトに戻り「低リサイズ版」をダウンロードし、再度親テーマのアップロード作業を行います
エラーが出なければ親テーマはインストールされます
「有効化」をクリックしましょう
親テーマがインストールされました
次に子テーマをインストールしますので、再び「新規追加」をクリックします
Cocoonの子テーマをアップロード
子テーマをアップロードしますので「テーマのアップロード」をクリックしましょう
通常はダウンロードフォルダに子テーマのZIPファイルがあると思われます。
ダウンロードフォルダの中にある子テーマのZIPファイルを解凍しないでそのままアップロードします。
「ファイルを選択」をクリックした後、「cocoon-child-master-1.1.2.zip」を選びます
「今すぐインストール」をクリック
子テーマがインストールされます。
「有効化」をクリックしましょう
子テーマも有効化されました。
テーマの中に親テーマも子テーマも有効化されている状態になります
ここまで作業したら、いったん、サイトを表示してみましょう。
こんな感じになっています
背景画像を設定してみる
Cocoonのテーマをインストールしただけでは、まだまだサイトとしては空っぽですね。管理画面の
「外観」＞「カスタマイズ」にはいりましょう
「背景画像」をクリック
メインビジュアルとなる写真を用意し、
「画像を選択」
をクリックして選びます
「ファイルを選択」をクリックし、画像ファイルを選びます。（ドラッグ＆ドロップでもアップロードできます）
アップロードされると、画像右上に青いチェックマークがつきます
右下の「画像を選択」のボタンをクリックします
「画像の位置」を触ると、写真の表示位置を調整できます。
よければ「公開」ボタンをクリック
サイトを表示して（すでに別タブで表示していたら、画面を更新/最新の状態に更新 をして）確認してみましょう。
こんな感じです。
このページではひとまずここまで。
ブログ記事を投稿していただいても問題ありません。
メニューの表示設定や、さらにデザイン設定を変更できますが、別ページでご案内します。