前回までで、WordPressの初期設定までは終わったと思いますので次はテーマの設定をしていきます。
WordPressの便利なところはこのテーマにいくつかのテンプレートが用意されているところです。
無料のものから有料のものまでたくさんあります。
用途に応じて向き不向きもあると思うので、
ブログをやりたいのか、それともネットショップなのかとかそれ次第ですね。
今回ご紹介するのは無料テーマの「Cocoon」なんですが、先に僕がめちゃくちゃ迷った有料のテーマだけご紹介しますね。
それは、こちらの【THE THOR(ザ・トール)】 です。
なんで、有料のテーマと迷ったかというと。
まあなんせ一度挫折もしていますし、今度こそブログを続けていきたい!!って思ったんです。
このテーマを使ったデモサイトなど見るとすごいおしゃれだし、
ホームページに「圧倒的なSEO対策」とか書かれてるし、初心者の僕からしたら飛びつきたくなるような有料テーマでしたね。
でもですよ。当たり前ですけど高いんですよ。(笑)
だから、無料テーマでリベンジしようと思いました。
後は、なんか個人的な意見ですけどどこか有料には頼りたくはない自分もいたんですよね。。
そんなわけで本題に入りまして、僕が迷った末に選んだ無料テーマ「Cocoon」の使い方を説明していきますね!
■Cocoonの使い方
「Cocoon」のダウンロード
まず、このCocoonなんですけど最初からWordPressに入っているテーマではないのでダウンロードをしないといけないです。
まずこちらのサイトを開きましょう。
【Cocoonのダウンロード】
・サイトを開いたら、ヘッダーメニューのダウンロードをクリック。
そして、次の画面で下にスクロールして行くと「親テーマのダウンロード」と出てきますので
“Cocoonテーマ”をダウンロードをクリックしましょう。
え?親テーマ?
って思いますよね。安心してください。この後説明しますのでまず「親テーマ」をダウンロードしましょう。
ダウンロードが終わったら、「WordPressの管理画面」を開いてください。
そしたら、左側のサイドバーから《外観》の《テーマ》をクリックします。
次の画面で左上に《新規追加》ってボタンありますよね。そこをクリックします。
※この画像では僕のブログ管理画面なのですでにCocoonが入ってますが気にしないで下さい。
そしたら、次の画面で今度は左上に《テーマのアップロード》ってボタンあると思います。
そこをクリックしましょう。
そして、ファイルを選択のところで先ほどダウンロードした「Cocoon」のテーマをアップロードします。
※ここで注意して欲しいのが、ZIP形式でって書いてあるのでZIPファイルをアップロードしてくださいね。macだと自動で解凍されちゃうので。
うまくいけば、《外観》の《テーマ》の中に「Cocoon」の親テーマが追加されているはずです。
「Cocoon(子テーマ)」のダウンロード
さあ次に「子テーマ」です。
先ほどダウンロードしたのが「親テーマ」になります。
さっきと同じ要領で、こちらの「Cocoon Child」をダウンロードしてアップロードまでしましょう。
そしたら、管理画面でテーマを有効化します。
ダウンロードしてアップロードするだけでは反映されませんので。
※必ず子テーマ(Cocoon child)の方を有効化してくださいね。
親テーマと子テーマ
さあここまでで、ひとまずCocoonの設定が完了です。
というわけで、「親テーマ」と「子テーマ」について説明していきますね。
まあ名前の通りなんですが、親テーマのファイルの中ではWordPressでサイトを表示させるための重要なファイルが入っています。
そんな親ファイルは度々アップデートされます。
そんな時に、もし親テーマのファイルを自分でカスタマイズしていたとしたらアップデートの影響を受けてしまうかもしれません。
なので、カスタマイズをすることを考えると必ず子テーマを有効化した方がいいです。
子テーマは親テーマの情報を引き継いではいるものの、子テーマに施したカスタマイズは守られます。
なので今後ちょっとしたカスタマイズ方法などを紹介していきますが、全部子テーマですので覚えておいてくださいね。
Cocoonの初期設定
それではCocoonの設定をしていきましょう。
左側のサイドバーに《Cocoon設定》が追加されてますのでクリックします。
プレビューに表示されているのがCocoonの初期設定です。
そして上に何個もタブがありますよね。ここから色んな設定ができます。
・スキン
じゃまずはスキンから。
ここでは、サイトのデザインを簡単に変更できます。
マウスを乗せるとプレビューが出ます。
一番下の「変更をまとめて保存」を忘れずクリックしてくださいね。
・全体
全体設定では、サイトの背景色やテキストの色や文字サイズなどを変更できます。
またサイドバーの表示位置なども変更できます。
サイドバーとはここの赤枠のことです。
・ヘッダー
次はヘッダーです。
ヘッダーとはサイトの上部に表示されるもので、
まあサイト名とかの部分ですね。
ここでは、サイト名の表示の仕方やキャッチフレーズを表示するかしないか、
後はナビゲーションボタンの色や配置の設定ができます。
・タイトル
次はタイトルです。
ここでは、検索エンジンで検索された時のサイト名表示の設定です。
・カルーセル
このカルーセルというところは、この赤枠の部分です。
この辺はもう好みだと思いますが、少しつまづいたところがあって自分なりに解決した方法があるのでもしカルーセルの設定が気になる方はこちらの記事をご覧ください。
・フッター
フッターはここです。
上部に表示されるヘッダーとセットで覚えるといいですね。
色や表示位置、コピーライト設定を行えます。
コメント