ワードプレス初めてのカスタマイズ(その1)

ワードプレス

こんにちは。ブログ大好き白くま軍曹です。

ワードプレスでブログを始めたいときに、「30分でブログが開始できます」などというサイトを調べて、レンタルサーバーと契約し、ワードプレスをインストールするまで(上の画像)は、割と簡単にできますよね

しかし、レイアウトをカスタマイズしないと、すごく味気ないレイアウトになってしまい、誰も見てくれないということになってしまいます。

そこで、自分自身試行錯誤してみた結果、最低限必要なカスタマイズの内容とその方法について解説します。

この記事が必要な人

  • ワードプレスをダウンロードしたけどそこから何をしていいかわからない
  • カスタマイズってなんだ?
  • かっこいいページを作るにはどうしたらいいの?

カスタマイズってなに?

カスタマイズの必要性

カスタマイズする前

ワードプレスをインストールした状態は、いうなれば真っ白の大学ノートのようなものです。
自分だけが見る日記であればここにそのまま書きたいことを書いていってもいいのでしょうが、わざわざワードプレスを使う人は、他人に見てもらいという思いがあるはずです。

そのためには、見た目をよくする必要がありますね。また、関連した記事を見たいなぁというときに、その記事にジャンプする機能があれば閲覧してくれた人に便利です。そうすると、「このサイトは便利だな」と思ってもらえるでしょう。

そのためにカスタマイズが必要です。カスタマイズ(customize)とは、自分の好みに合わせて、作り返すことという意味ですが、もともと、カスタマー(costomer、お客様)という言葉もあるとおり、サイトの訪問者のためにもカスタマイズが必要だと考えましょう。

カスタマイズの優先順位

最優先でやるべきこと

ワードプレスをインストール後、最優先でやるべきことは以下のとおりです。

・パーマリンクの設定
・テーマの選択
・キーカラー、フォントの設定

上記以外にも、
・ヘッター、フッター、サイドバーなどの設定
・サンプル記事の削除
・不要なプラグインの削除
・メタ情報の削除
・サイトマップの作成
etc・・・

と初期設定はたくさんあるのですが、とりあえず、記事を書きやすくすることを優先してみました見た目がしっかりしていると、執筆意欲も沸きますもんね。

そのほかの設定は、記事が増えてきて「邪魔だな」と思ってからでもいいと思います。

パーマリンクの設定

パーマリンクとは、わかりやすく言うと、それぞれの記事に割り振られた住所のようなものです。
ですから、パーマリンクを設定することによって、記事がどんな内容か知ることができるのです。


ダッシュボード→設定→パーマリンクにカーソルを合わせると、下のような画面が出ます。
投稿名にチェックが入っていればオーケーです。そうでなければ投稿名にチェックを入れましょう。

テーマの選択

テーマとは、ウェブサイトをデザインするためのテンプレートのことです。
テンプレートとは、型板という意味のことです。

テーマを選択することによって、ページのどの辺にどんな文書をどのくらいのサイズで配置するかなどができるようになります。

テーマには大きく分けて有料のものと無料のものがあります。また、専門知識があれば自分で作成することもできます。まぁ、そんなことができる人は、超初心者向けサイトなど必要ないと思います。

最初は無難に無料テーマを選択するほうがよいでしょう。
まだよくわからないものにお金をかけたくはないですからね。
また、最近は無料テーマも有料のものとひけをとらないらしいです。

というわけで、無料テーマの「Cocoon」を選択しましょう。

ほかのサイトでも触れられていますが、Cocoonを有効化するときは、同時にCocoon childも有効化して、Cocoon childをカスタマイズしましょう。その理由は、Cocoon自体がアップデートされたときに、今までカスタマイズした内容が変化してしまうかららしいです。

Cocoon childを有効化したら、カスタマイズをクリックしてみましょう。

こんな画面が出るはずです。

左側に注目してください。実は、サイトのほとんどすべてがここでカスタマイズ可能なのですが、ある程度詳しくないと、???となってしまいます。

そのため、ダッシュボードから、「Cocoon設定」を選択し、こちらの画面でいろいろな設定を行っていきましょう。

上図の赤い楕円の中に、いろんなタブがありますが、これを使い、様々なカスタマイズを行っていきます。

まず、スキンを選択しましょう。
と気楽に言いましたが、

スキンとは、ブログの外観を変更できるというとっても便利なもので、テーマにより様々なスキンが用意されていますが、気に入ったスキンを探すのは一苦労です。外出するのにオシャレな服を着たいけど、服がいっぱいありすぎてどれにしたらいいのかわからないといった感覚でしょうか。

先ほどの、Coconn設定の画面で、「スキン」を選択し、画面を下にスクロールすると、スキン一覧が、たくさん出てきます。どれを選ぶか迷っちゃいますね。

ちなみに、タイトルの左にある画像にマーカーを持っていくと、デモ画像を見ることができます。

スキンにより、タイトルやサブタイトル、ヘッター、サイドバー、フッターなどがある程度設定されています。
もちろんここからさらにデザインや色をかえたりカスタマイズできますが、スキンによっては背景色などに制限がある場合もあります。

選んだスキンが気に入らなかったら、いつでも変えられるので、好みの色や雰囲気で選べばいいと思います。

キーカラー、フォントの設定

スキンによっては、もうそのまま使えるよ~という方もいらっしゃるかもしれませんが、より自分好みのサイトを作るためには、キーカラーとフォントを設定しておいたほうがいいでしょう。

キーカラーというのは、サイト全体のポイントになる部分の背景色です。具体的には、見出し、サイドバー、表、引用部分などです。「サイトキーカラー」は背景に、「サイトテキストカラー」は文字(テキスト)に反映されます。

ちなみに、サイドバーの色などは、CSS(ワードプレスで使用されるプログラム言語、スタイルシートとも言います)を使うとカスタマイズ可能ですが、最初のうちは知らなくても大丈夫です。

キーカラーは、好きな色を選んでいいのですが、スキンの主体の色と合わせたほうが見やすいんじゃないかと思います。

次に、フォントを設定します。「全体」をさらに下にスクロールしていくと、「サイトフォント」の選択画面が出てきます。お好みのフォントを選びましょう。個人的には、小杉丸ゴシックが好きです。

ついでに、サイトをスマホで見ることを想定し、「モバイルサイトフォント」を確認しておきましょう。デフォルトの数値で問題ないのですが、もっと大きい(小さい)字で見てもらいたい場合は変更できます(あまりオススメはしません)

それから、サイドバーの場所についての設定を行います。

サイドバーとは、記事の横に表示されるもので、過去に投降した記事、アーカイブ、プロフィールなどを表示するものです。
「全体」をさらに下にスクロールすると、「サイドバーの位置」が表示されます。ほとんどのサイトでは、サイドバーは記事の右側になっているので、「サイドバー右」になっていることを確認しましょう。

最後に、一番下(一番上にもある)「変更をまとめて保存」をクリックして変更を保存するのを忘れないようにしましょう。これを忘れると、今までの設定が反映されません。

まとめ

まとめ

ワードプレスをダウンロードしたら、

・パーマリンクの設定
・テーマの選択(初心者は無料のCocoonがオススメ)
・スキンの選択
・キーカラー、フォント、サイドバーの位置の決定
を最初にやりましょう!
(それ以外はボチボチやればオーケー)

とりあえずここまでやれば、記事を作成することは可能です。

もっとカスタマイズしたい方は、次の工程として
・タイトル画面の編集
・ヘッター、フッターの編集
・サイドバーの編集
などをやっていきましょう。続きはこちら

それではお疲れさまでした!