初めてのWordPressで行う設定まとめ（設定メニュー編）｜WordPressでビジネスサイトをつくろう【第3回】
- カテゴリー WordPressでサイト制作
前回までで、作成しようとしているビジネスサイトの大まかな全体像を確認しましたら、いよいよWordPressの方の設定に入っていきます。
まずは左メニューの簡単な説明とインストール後に設定したい一般設定の解説を行なっていきます。
各種設定は後からの変更も可能ですが、ページのURLが変更になる場合は、お気に入りしてくれていた人や各種ソーシャルボタンの履歴などがクリアされますので、はじめにしっかりと決めていきましょう。またWordPressでは左メニューは自由にカスタマイズできるものとして考えておくとよいでしょう。
WordPressのインストール画面
はじめからWordPressの簡単インストールなどが入っているレンタルサーバーの場合は、インストールは簡単です。
コントロールパネルから「簡単インストール」ボタンを押して（※ご使用のレンタルサーバーによって異なる）インストール場所を設定するだけで、難しいデータベースなどの設定などをしないでも使用することができますので、初めての人はノンプログラマーの方はWordPressの実装が簡単なレンタルサーバーを選ぶとよいでしょう。
最近はどのレンタルサーバーも簡単に使えるようになっている場合が多いのもWordPressが流行っている理由の一つでしょう。
インストール画面では一番下の「検索エンジンによるサイトのインデックスを許可する」のチェックを外しておきましょう。
チェックをつけておくと作成途中から検索エンジンにヒットしてしまいます。（または作成するサイトをベーシック認証などでパスワードを設定する）
サイト名（ブログ名）の変更やアカウントID情報、パスワード、登録メールアドレスなどの設定は後から変更可能です。
デフォルトの管理画面の左サイドメニュー
WordPressをインストールし、管理画面を見てみると左側のメニューは初期状態のテーマのものとなっています。
これらは違うテーマを使用するとテーマ毎に違うメニューがでてくるものですので、いろいろな書籍やテーマなどによって違っていてもあまり気にする必要はありませんので、まずはWordPress初心者の人は赤枠内の部分の役割を覚えましょう。
また展開してメニュー一覧はこのようになります。
デフォルトの管理画面の左サイドメニューの全体
WordPressの基本情報は「設定」メニューから入力
ここで、まず設定したいのはWordPressの基本情報を決める「設定」メニューですので、それらについてまとめます。
サイトの基本情報を設定するエリア
ここでは赤枠の4つの設定をまず見ていきます。
「設定」→「一般」でサイト情報を管理する
「サイト名」や「キャッチフレーズ（副題）」な投稿時の日付のフォーマットの見せ方などを設定するエリアです。
ブログなどでは記事を投稿した日付を表示しているサイトが多いと思いますが、通常のビジネスサイトで投稿日とかは必要ないという場合はデフォルトのままで構いません。
ビジネスサイトなどでは、更新情報の日付として「日付のフォーマット」で表示方法を決めることに使います。
「設定」→「表示設定」でサイト情報を管理する
ここでは、投稿した記事を1ページ内に表示させる最大数の設定やRSSのフィードへ情報を出す際の表示の設定を行います。
※1ページの表示設定はビジネスサイトではより細かく設定したいので、後ほどプログラムの方でも分岐させます。
またフロントページの設定は今回は使用せずに「最新の投稿」としてありますが、簡単な説明を画像内にいれております。
「設定」→「メディア」で投稿時にアップする画像サイズの設定をする
ここでは、記事を投稿する際に画像をアップロードしたサイズを設定を行います。
WordPressではデフォルトで1枚の画像をアップロードすると他に3枚の合計4枚の画像が用意されます。これらは自分のサイトのデザイン内の見せ方によって決めますので、ページ数やフォーマットが多いビジネスサイトでは、はじめにしっかり決めたい部分となります。
例えば製品紹介ページで大きめの画像を使い、さらにクリックで拡大画像を見せ、トップページではサムネイルというようにする場合などに各サイズを考えてから、元画像の作成とアップロード時に縮小されるサイズを決めます。
一度投稿した後に、画像サイズを変更しても、すでに投稿した画像のサイズは元の画像サイズのままとなってしまいます。
※これらを新しい画像サイズに一括かき出しのプラグインがあります。
これらはサイトのデザイン案の段階でしっかりとルール付けをすることで、後からやり直しを防ぐことができるでしょう。
※この3つの設定以上に別のサイズで画像を書き出すことも可能ですので後ほど紹介します。
今回設定した画像サイズはサンプルサイト用のものです。
どのようになっているかサンプルサイトで確認できます。
http://wordpress-book.webdesignmatome.com/
→TOPページのトピックスページのサムネイル用の画像として使用します。
●中サイズ→幅：300 高さ：0
→セミナー＆製品画像の個別投稿ページ内の画像として使用します。
●大サイズ→幅：460 高さ：0
→トピックス個別投稿ページ内の画像として使用します。
※画像サイズの考え方は作成するサイト構成によってかわりますのでひとつの参考としてご覧ください。
「設定」→「パーマリンク設定」で投稿時のURLを設定をする
「パーマリンク設定」は記事をアップする際のURLになる部分で、ビジネスサイト制作では大変重要なものとなります。
ブログなどでは日記のように考えると記事のURLは日付でも良いと思いますが、たくさんのフォーマットとなるビジネスサイトでは日付だけのURLではわかりにくくなってしまいます。
そこで今回は下記のようなパーマリンク設定を行いました。
投稿時に設定するカテゴリー名と投稿時に設定するスラッグ名をURLとします。
カテゴリー名とスラッグ名について
ここで少しでききた「カテゴリー名」と「スラッグ名」について見ていきます。
カテゴリー名というのは、ブログなどで日記を書く際のカテゴリーを分ける際の名称です。通常サイトの場合は更新性のあるページ「お知らせ」や「セミナー情報」や「製品情報」などをカテゴリーとして使用します
通常サイトを例にした場合にURLとしてお知らせページのURLは「news」、製品情報ページのURLは「products」と作成する場合に、
製品情報 ： www.example.com/products/
ここでこのURLとして使う設定が「スラッグ」になります。
「スラッグ」とは、カテゴリーの作成や記事投稿や固定ページの作成の際に、WordPressによってURLが自動生成されますが、このURLは日本語を入力した場合にURLが置き換わってしまいます。
それを防ぐためにスラッグを半角英数字で任意の名前をつけます。
http://www.example.com/%e3%81%8a%e7%9f%a5%e3
%82%89%e3%81%9b/
と文字化けのように置き換わってしまいます。
この際にスラッグ名に「news」を設定ことによって
http://www.example.com/news/
とすることができます。
このようにすることで「わかりやすく・伝えやすいURL」にしていくことができます。
設定したパーマリンクの設定「/%category%/%postname%/」のcategoryの部分に自分で作成したカテゴリー名に設定したスラッグ名がURLとして設定されます。
また構築時にページや記事の条件分岐の際にもこのスラッグを使うことができます。
パーマリンク設定はこれ以外にも設定方法がいろいろありますので、自分のサイト設計にあったものを使ってあげるとよいでしょう。
今回はサイト構築前のWordPressの設定関連の説明をまとめてみました。
次回は「WordPressのカテゴリーと固定ページのスラッグの違い理解して投稿の準備をする」として、作成するコンテンツリストから「投稿」のカテゴリー分けやスラッグ名「固定ページ」のスラッグ名などの設定をまとめていきたいとおもいます。
本書で作成されたサイトのご紹介
最後にWordPressでビジネスサイトをステップ毎に勧めて完成させていく書籍『WordPress 3.x 現場のワークフローで覚えるビジネスサイト制作』を読んで下さった方のサイトを紹介したいと思います。
もみの木ペンション 山形蔵王・蔵王ペンション村 ファミリーペンション
山形蔵王・蔵王ペンション「もみの木ペンション」さんのサイトが本書を使用して作成していただきました。
ベース部分は本書のステップを活用されて、背景や色のトーンなどを変更し、さらに「jQueryでグラフィックの写真切り替え」「予約フォームプラグインの活用」などカスタマイズして作成されています。
まさに自分が本書を執筆する際に考えていた内容を実際にやっていただいた方がいらしたことにとても嬉しくなりました。
ちょっとした縁で作成された方とメールをやり取りさせていただいた際に疑問に思っていたことがありましたので質問させていただきました。
WordPressというものがあるということを知ったのが、今年の2月。
それまでは、古いホームページビルダーを使い、サイトを作っていました。
WordPressを知ったとき、全く解らず、ちんぷんかんぷんで、プラグインって何？みたいなところからネットで調べまくって、勉強していましたが、理解できずに、本に頼りました。
「WordPressレッスンブック」「WordPressデザインブック」の2冊を購入して、基本のような部分は、それを見ながら学んだと思います。
ですが、ブログサイトを作るには十分かもしれませんがショップサイトだったり、ビジネスサイトに使えるようなデザインにするには、無理でした。
フリーのテーマ配布サイトなども使ったりしましたが、カスタマイズしていても、エラーになったり、思うようなしっくりくるデザインが見つからず悩んでいたところ発売になったばかりのこの本に出会いました。
アマゾンで買ったので中身を見て買えないので、ちょっと不安でしたが思い切って購入しました。
●HTMLやCSSやJQueryなどはどのように勉強されましたか？
ビルダーでサイトを作っている時に、ネットで調べながら勉強しました。
HTML、CSSは、少しはわかりますが深く理解してるかというと、まだまだわかりません。
JQueryは、正直良くわかりません(汗)
●スクールなどでWeb制作を学ばれた経験は？
学校などで、学んだ経験はないです。
ですが、叔父がサイト制作の仕事をしていたので、わからないことは質問したりしましたが具体的に学んだことよりも、
「これからは、wordpressの時代だ！」
とか、
「facebookはもう終わるんじゃないか？」
とか・・・(笑)
wordpressの存在を教えてくれたのは叔父ですが。
●本書の感想をお聞かせください
この本は、Wordpressを少しかじったことがある、という程度の私にでも項目を１つ１つクリアして出来上がっていくサイトを確認しながら、見本を見て、自分のイメージと当てはめて、という作業を繰り返し見本のサイトと同じ配置で、完成できました。
私は用意されている画像を上書きしてオリジナルにしていますがデザインとサイズはそのままなので、記述を変えることなく、簡単にできました。
ビジネスサイトに必要な項目が揃っているのでそこに自分の入れたい情報を当てはめていったら、サイトが出来上がっていたという感じです。
本の題名の通りの、覚えながら完成してしまうので、充実感もあります。
正直びっくりしたのは、はじめはWebを勉強し始めた人が、ペンションのサイトを題材に作成したのかと思っていましたが、Webスクールなどの経験などがなく、WordPressも独学でここまで作ってしまったということに驚きました。
僕は10年以上Webスクールで講師をしていますが、全くの未経験でここまでできるものかとちょっと複雑な気持ちもありますが、これだけ情報がたくさんある時代なのでやればできるのですね！
自分でもWeb制作会社をしていますが、なんか自分が制作の仕事で携わったサイトよりも、このサイトを見せてもらった際の方がうれしく感動しました。
この書籍は企画から9ヶ月位かけて書いた本でしたので書いたかいがありました。
最近は無料でWebサイトが作成できるようなツールなどもあり、このようになるとWeb制作会社の仕事がなくなる！などの声もたまに聞かれますが、世の中には様々な業種や運用形態がありますので、それぞれのニーズがあってよいですし、やっぱり自身で作成されたほうがより細かく運用できるのでよいですよね。
「もみの木ペンション」さんのように自身の仕事のサイトなどを自由に更新できるようにWordPressを活用してくださるお店や会社の方がこれからもでてくるといいなと思い今回はこれまでになります。
スノーボード辞めてしまったので蔵王とか行く機会はなかなかないですが、いつかいってみたいな・・。
この記事を書いた人
著者 : ハヤシユタカ
2001年、有限会社ムーニーワークスを設立。WEB制作の他、書籍執筆、セミナー講演、企業研修などを行う。また、クリエイター育成機関デジタルハリウッドでは1999年より講師として本科WEBデザイナーコースやデジタルデザインコースを担当。 詳しいプロフィールはこちら
WordPressで投稿した記事の内容をループ文を使用して表示させる｜WordPressでビジネスサイトをつくろう【第10回】
WordPressの初期テーマの確認とゼロからのテーマを作成方法｜WordPressでビジネスサイトをつくろう【第5回】