WordPressを使用するとデザインの変更や機能のカスタマイズ、データの管理を手軽に行える多機能なブログサービスを作成することができます。


実際、このTechAcademyマガジンもWordPressを使って作られたサイトです。他にも企業のコーポレートサイトやブログサイトなどの多くはWordPressを使われているのです。


サイト作成に便利なプラットフォームなので、ぜひ使えるように理解していきましょう。


そもそもWordPressとは何なのかよく分からない方は、今さら聞けない!WordPressとは【初心者向け】をご覧ください。


 


なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。


 



大石ゆかり


田島メンター!!WordPressのことはなんとかわかったんですけど、どうやって使うんですか〜?





田島悠介


WordPressを使うにはインストールや初期設定が必要なんだ。





大石ゆかり


なんだか難しそうですね・・・。





田島悠介


きちんと手順に従えば簡単にできるよ。インストールさえしてしまえば、簡単に記事の作成とかサイトデザインとかもできるから。それじゃあ教えてあげるね。





大石ゆかり


よろしくお願いします!!!




 


目次



 


WordPressのインストール手順


用意するもの



  • PHP・MySQLが使用できるサーバー(レンタルサーバーなど)

    以下の条件があります。


PHP バージョン 5.6 以上

MySQL バージョン 5.6 以上 または MariaDB バージョン 10.0 以上

(2016年11月時点)



  • FTPクライアント(今回はFileZillaを使用します)

  • 独自ドメイン(yahoo.co.jpのように自分のサイトを公開する場合に必要です)


独自ドメインレンタルサーバーについては別途記事内で比較しています。合わせてご覧ください。


 


本体の入手とサーバーへのアップロード


まず、以下のサイトにアクセスしましょう。


https://ja.wordpress.org/


このボタンをクリックしてWordPress本体をダウンロードします。



ダウンロードし、解凍した「wordpress」という名前のフォルダを任意の半角英数字の名前に変更します。ここではwpとしています。(変更せず、「wordpress」のままでもOKです)


FTPクライアントを使用してサーバーに本体をアップロードします。今回はFileZillaを使用します。

サーバーに接続し、WordPressを設置したい場所にフォルダごとアップロードします。



アップロードしたフォルダのある場所にアクセスします。








例えばhttp://xxxx.ne.jp/に「wp」と名前変更したWordPressフォルダをアップロードした場合、アクセスする場所はhttp://xxxx.ne.jp/wpとなります。また、これがそのサイトのアドレスになります。

 


初期設定とインストール


データベースの設定を行います。「さあ、始めましょう!」のボタンをクリックします。



データベース名ユーザー名パスワードデータベースのホスト名を入力し、「送信」ボタンをクリックします。これらは使用しているレンタルサーバーにより設定が異なります。



以下は、レンタルサーバーのスターサーバーでの例です。(管理画面の「データベース設定」から見ることができます)パスワードはこのデータベースで設定したものを入力します。


また、データベースの文字コードは「UTF-8」にしておきます。




「インストールを実行」をクリックします。



ここではWordPressサイトの基本的な設定を行います。また、これらの項目は全て後でいつでも変更できます。

「検索エンジンがサイトをインデックスしないようにする」にチェックを入れるとサイトが検索エンジンに表示されない状態にしておくことができます。


入力後「WordPressをインストール」をクリックします。



インストール完了のメッセージと、ログイン用のユーザー名とパスワードに関する情報が表示されます。



続いてログイン画面が表示されます。設定したユーザー名とパスワードを入力し「ログイン」をクリックします。



 


管理画面の基本設定


ログインするとWordPressの管理画面が表示されます。


記事の投稿やサイトデザインの変更、プラグインの追加や各種設定はこの画面から行います。



 


サイトの基本情報変更


左メニューの「外観」から「カスタマイズ」を選択します。



「サイト基本情報」を選択します。



サイトのタイトルとキャッチフレーズはここからいつでも変更できます。



 


ログイン・ログアウト方法


管理画面からログアウトする場合は上メニューのユーザー名から「ログアウト」を選択します。



再び管理画面にログインするときはサイト上の「ログイン」(テーマにより表示されないものもあります)か、WordPressフォルダ内にあるwp-login.phpにアクセスすることでログイン画面に移行することができます。








例えばhttp://xxxx.ne.jp/wpというサイトの場合はhttp://xxxx.ne.jp/wp/wp-login.phpがログイン画面へのアクセスになります。


 


記事の投稿


左メニューの「投稿」から「新規追加」を選択します。



「ここにタイトルを入力」の部分にタイトル、下の欄に本文を入力します。



また、「メディアを追加」ボタンからは画像を挿入することができます。



入力が完了したら「公開」ボタンをクリックすると記事がサイトに反映されます。




 


予約投稿の方法


「公開」ボタンを押せば、その瞬間記事として公開されますが、中には決まった時間に公開したいと思う人も多くいるでしょう。


記事編集ページの右上にある「公開」と書かれた項目をご覧ください。


「すぐに公開するor予約投稿」の右にある編集をクリックします。



公開する日時のフォームが出現して、時間を自由に決めることができます。トップページには出したくないから過去の記事として公開したい、明日の9時に公開したいので、予約投稿にする際に便利です。



今より先の時間に設定すると、「公開」から「予約投稿」というボタン名に変わります。



設定した時間になったら自動的に公開されるので、時間に合わせて手動で公開する必要がなく便利な機能でしょう。


 


カテゴリとタグの管理


WordPressでは投稿した記事を分類するために、カテゴリーやタグを利用することが出来ます。一般的に、カテゴリーは、記事を大まかにグループ分けする場合に使われ、タグはさらに細かく分ける場合に用いられています。


WordPressで投稿する記事は、必ずカテゴリーを選択しなければなりませんが、タグは必ずしも設定しなくてもよいことになっています。


新規カテゴリーの作成方法


ログインした後、「投稿」から「カテゴリー」を選択すると、カテゴリー新規追加、既存のカテゴリー編集の画面が開きます。



名前にカテゴリー名を書いて、下のほうにある新規カテゴリーを追加ボタンを押すと、新規カテゴリーが追加されます。


スラッグというのは、カテゴリーのアドレスにつける別名みたいなものです。スラッグを設定しない状態で、未分類のカテゴリー一覧の記事を表示した場合、アドレスが以下のようになります。


http://あなたのHPのURL/category/%E6%9C%AA%E5%88%86%E9%A1%9E/

ブラウザのURLを見てみると、


http://あなたのHPのURL/category/未分類/

と表示されていますがそれはブラウザが気を利かせて、日本語に変換してくれただけで、本当はURLエンコードされた日本語文字列になっています。


コピーしてテキストエディタや掲示板などの入力欄に貼り付けるとわかります。未分類のカテゴリーに対して、not-categoryなどのスラッグをつけると「http://あなたのHPのURL/category/not-category/」でアクセスできるようになります。


また、カテゴリーに親カテゴリーを指定することで、カテゴリーに階層構造を持たせることも出来ます。


 


新規タグの作成方法


ログインした後、「投稿」から「タグ」を選択すると、タグの新規追加、既存のカテゴリー編集の画面が開きます。



タグもカテゴリーと同じで、スラッグを利用することが出来ます。


タグは、記事投稿時に複数設定することが出来るので、該当するものを設定しましょう。


 


ユーザー管理


WordPressでは、複数人で管理することも出来て、それぞれ権限を設定することでセキュリティを向上させることが出来ます。


管理画面のユーザーをクリックすると、新規登録・編集画面になります。



権限グループごとに何ができるのか


新規追加の前に、権限について見ていきます。権限には以下の5種類のグループがあります。



  • 購読者:WordPressにログインすることが可能。プロフィールの変更が出来る。

  • 寄稿者:記事を投稿できる。ただし、編集者や管理者が許可しない限り公開状態には出来ません。

  • 投稿者:記事を投稿できるが、他のユーザーが作成した記事は扱えないことと、固定ページ作成は出来ない。

  • 編集者:他のユーザーが作成した記事や固定ページなども扱えるが、デザインやプラグインなどWordPressの設定に関わるものは扱えない。

  • 管理者:全ての権限がある。


となっています。寄稿者は記事を投稿できるものの、公開状態にするには編集者以上の権限を持つユーザーの許可が必要。


投稿者は、記事を投稿できるものの、カテゴリーなどの作成や管理権限が必要なもの、他のユーザーが作成した記事の編集は行えません。


編集者は、ほとんど全ての作業が可能ですが、設定にかかわるものは変更できないです。


管理ユーザーに権限を設定することで、複数人の管理人がいてもセキュリティが守られるようになっています。


 


新規ユーザーの登録方法


管理画面の「ユーザー」をクリックすると、登録されているユーザー一覧が表示されます。


ページトップに「新規追加」ボタンがあるので、こちらをクリックしましょう。



 


必要な情報を設定した後、権限を決めて追加ボタンを押すと追加できます。



権限を間違えると、全ての記事が削除されてしまう恐れもあるので注意が必要です。


 


ユーザーの削除方法


管理者の権限を持つユーザーでログインすると、削除することが出来ます。



 


パーマリンクの設定


パーマリンクでは、記事ページなどのURLをカスタマイズすることができます。「設定」から「パーマリンク設定」でパーマリンクの編集を行うことができるので、確認してみましょう。


 


URLとは、通常であれば、ファイルの場所を示しています。


例えば、URLが「http://ほにゃらら.com/aisatsu/ohayou.html」だった場合「aisatsu」というフォルダの中の「ohayou.html」というファイルの情報が返されます。


ところがWebサーバーの設定でこれを変更することが出来ます。WordPressのインストール先のフォルダに.htaccessファイルがあります。


中身について詳細は解説しませんが、要求したファイルやフォルダがない場合、全てのアクセスを「index.php」というファイルに集める、という設定になっています。


index.phpにアクセスを集めて、ブラウザのアドレスから判断して、プログラムでデータベースから検索して結果を表示しています。


WordPressのデフォルトの設定では、2017年4月18日に投稿した場合のURLは、


http://あなたのURL/2017/04/18/hello-world/

などのようになっています。この/2017/04/18/hello-world/の部分が、パーマリンクになります。


デフォルトでは、日付と投稿名でデータベースから記事を取得しているようです。この部分をある程度自由に変更することが出来ます。


 


パーマリンクの変更


パーマリンクを変更した場合、どのようにURLが変わるのかを見てみます。


パーマリンクの設定の変更画面は、管理画面から設定、パーマリンク設定をクリックします。



デフォルトの状態は、日付と投稿名です。2017年の4月に投稿した記事であれば、


/2017/04/投稿した記事のタイトル/

というURLになります。


基本に設定すると「/?p=123」という、記事に設定されている番号が付けられます。これはデータベース上で管理されている、その記事唯一の番号です。


月と投稿名だと「/2017/04/投稿した記事のタイトル/」になります。数字ベースだと「/archives/123」といった形になります。


投稿した記事のタイトルだけという設定もあり「/投稿した記事のタイトル/」というURLにすることも可能です。


 


パーマリンクのカスタム構造


パーマリンク設定では、自分でカスタマイズすることもできます。構造タグというものを使用します。詳しくは使い方を参照してください。


カテゴリーベースを変更することも出来ます。カテゴリーベースのところを.(ドット)にすると「/category/カテゴリー名/」になるURLが「/カテゴリー名/」に短縮することも出来ます。



ただし、その場合投稿記事のパーマリンクが「/記事のタイトル/」になっていた場合、重なる可能性があります。


記事の投稿名がhello-worldで、カテゴリーにhello-worldがあった場合どうなるでしょうか?


どちらも「http://あなたのURL/hello-world/」でアクセスできてしまいます。この場合、投稿した記事が優先して表示されてしまい、カテゴリー一覧が表示されなくなるので注意が必要です。


 


テーマ


WordPressは「テーマ」という機能によりサイトのデザインを簡単に変更することができます。


各種テーマは公式が作成したものやユーザーが公開しているものが使用できます。個人や企業でWordPressのテーマを作っているところも多いので、費用をかけなくても十分整ったサイトを作ることができるはずです。


 


テーマの変更方法


左メニューの「外観」から「テーマ」を選択します。



インストール済みのテーマの一覧が表示されます。上の「新規追加」かテーマ一覧内の「新しいテーマを追加」をクリックします。



テーマは新着や人気順から探せる他、右上の「テーマを検索」からキーワードを指定して見つけることができます。



テーマをインストールし、一覧画面から「有効化」をクリックするとサイトに反映されます。



 


テーマの例


「WP Portfolio」テーマは、ポートフォリオ作成に適したテーマです。記事作成時にアイキャッチに指定した写真やイラストなどを一覧できるため作品を見せやすくなっています。



 


おすすめのテーマ


各シチュエーションで使えるWordPressのテーマを紹介します。国内ではブログサイトやコーポレートサイトをWordPressで利用している企業が多いですが、海外ではECサイトなどもテンプレートが用意されているので、ぜひ使ってみてください。


以下では、ブログサイト、ECサイト、コーポレートサイトに分けてそれぞれ人気のテーマを紹介しています。


ブログサイト


アルバトロス



かなり多くのブロガーが利用しているオープンケージのWordPressのテーマ。


その中でも王道のアルバトロスをおすすめしたいと思います。有料ではありますが、技術的なスキルが全くない人でも簡単におしゃれなWebサイトを作れるのが大きな特徴です。


カスタマイズもかなり自由に行えますし、一度買ってしまえばずっとサイトを運営できるので、多くのブロガーから人気なのでしょう。


アルバトロス


 


賢威



SEOに強いブログ・サイトを作りたい方におすすめのテーマです。


ウェブライダーという様々な企業のSEOコンサルを担ってきた会社が開発を行っています。


サイトのテーマだけでなく、SEOに関するマニュアルも載せているので、集客にも力を入れたい人にとっては一石二鳥なテーマになるはずです。


賢威


 


Riba Lite



画像のサムネイルが大きくバックに表示されているタイプのサイトです。


カメラでよく写真を撮ったり、トップページで写真を強調させたいときにおすすめのテーマです。


ダウンロード / DEMO


 


Hueman



よく見るニュースサイトのような作りになっているテンプレートです。


サイドメニューも充実しており、どこに何を置くか難しい技術を使わなくても選択するだけで設定することができます。個人のブログサイトとしても活用できるので、ぜひ活用してみてください。


ダウンロード / DEMO


 


ECサイト


Santa Cruz



一般的なECサイトのデザインにしたい人におすすめです。


カテゴリも細かく設定できますし、洋服などを販売する際に写真にマウスオーバーすると他の写真も出てくるといった仕掛けもあります。


スマホで見るとカートに入っているアイテム数、購入金額がトップで確認できるのでユーザーとしても使いやすいでしょう。


ダウンロード / DEMO


 


Make



縦長の写真が印象的ですが、全身のコーディネートや縦長動画などを見せる際に使えるテンプレートです。


雑誌を読んでいるような感覚でスマホ上で買い物ができるので、何度も訪れたくなるでしょう。一貫性を伝えやすいので、ブランディングを意識したサイトを作りたい人にはおすすめです。


ダウンロード / DEMO


 


Fukasawa



白を基調としたデザインでより一層アイテムを引き立てるテンプレートでしょう。


商品自体も白をバックに写真を撮っているので、シックな印象を与えますね。ブランディングとしての見せ方としても使えるのでおすすめです!


ダウンロード / DEMO


 


コーポレートサイト


Zerif Lite



WordPressのテンプレートの中でも非常に多機能で、出来ないことは無いんじゃないかというくらい多くのことを実現できるはずです。


また、デザイン面でもスクロールすると横からフォームが出てくるパララックス仕様になっており、おしゃれにも見えるでしょう。


ダウンロード / DEMO


 


Sydney



画像がディスプレイいっぱいに表示されたインパクトの大きいテンプレートです。


トップページに会社情報、事業内容、メンバー、SNSアカウント、ニュースなど多くの情報も載せられるのでスクロールしていて飽きが来ないでしょう。


ダウンロードDEMO


 


他にも初心者におすすめの無料で使えるWordPressのテーマを紹介しているので、合わせてご覧ください。


 


プラグイン


WordPressではプラグインという拡張機能を使うことによってサイトにさまざまなシステムを追加することができます。


アクセス解析を行うものや問い合わせフォームを追加するもの、スライドショーを表示させるものなどさまざまなプラグインがあります。


 


プラグインの検索とインストール


左メニューの「プラグイン」から「新規追加」を選択します。



テーマのときと同様に、新着順や人気順・キーワードでの検索でプラグインを探すことができます。「今すぐインストール」ボタンをクリックするとプラグインがWordPressにインストールされます。



インストールされたらすぐに利用できるわけではなく、まず有効化をしなければなりません。


 


プラグインの有効化


左メニューの「プラグイン」から「インストール済みプラグイン」を選択します。



インストールされているプラグインの一覧が表示されます。

使用したいプラグインの「有効化」をクリックします。



 


プラグインの例


SNSボタンのプラグイン


「Social Media Feather | social media sharing」プラグインを使用すると、サイトの記事にFacebookやTwitterなどの共有用アイコンを追加することができます。利用するサービスやアイコンの大きさなども自由にカスタマイズが可能です。


記事をシェアしてもらうためにもSNSボタンはぜひとも設置しておきましょう。



 


記事編集で役立つプラグイン


TinyMCE Advanced



記事作成をする前に必ず入れておきたいプラグインです。


ビジュアルエディタに追加できる各機能を手軽に設定できます。


TinyMCE Advancedの使い方


 


Video Gallery



YouTubeやVimeoといった外部の動画を記事内に埋め込むことができるプラグインです。


URLを入力するだけで追加できるので、簡単に設定できるはずです。


Video Gallery


 


SEO対策に役立つプラグイン


All in One SEO Pack



SEO対策全般の設定をまとめて行えるプラグインです。


FacebookやTwitterといったSNSとの連携、SEOにおいて欠かせないタイトルタグ・ディスクリプションタグの設定も行えるので、まず最初に入れておきましょう。


All in One SEO Packの使い方


 


Google XML Sitemaps



XMLサイトマップを作成してGoogleに更新を通知させることができます。


サイトマップがあることでサイトにどんなページが存在するのかGoogleに認識させることができるので、SEOの効果も見込めます。


Google XML Sitemapsの使い方


 


セキュリティ対策に役立つプラグイン


Acunetix WP Security



サイトの脆弱性をチェックして、それに合わせた対策を行うプラグインです。


サイト内のファイルのセキュリティレベルが一目でわかり、セキュリティ対策として十分ではないと判断されると通知が来る便利なプラグインです。


いつも使うわけではないですが、セキュリティを万全にしておきたい際はぜひ入れておきましょう。


Acunetix WP Securityの使い方


 


Throws SPAM Away



記事を投稿すると英語のスパムコメントが発生する場合があります。


投稿されたコメントに日本語が含まれていなかったり、有害と認定されたIPは無視することができるので、いざという時に便利でしょう。


Throws SPAM Away


 


WordPressで最初に入れておくべきプラグインも合わせてご覧ください。SEO対策やサイト改善に役立つプラグインを多々紹介しています。


 


WordPressで知っておきたいその他の設定


ここではWordPressで本格的にサイト運用していく上で覚えておきたい設定です。


SEO対策をより強化したり、サイトの表示を早くしたり、デザインを自分の好きなようにカスタマイズしたりと様々な使い方ができます。


全て最初に設定する必要はありませんが、WordPressの操作に慣れてきたらぜひともチェックしておきましょう。


 


サイトのデザインをカスタマイズする


WordPressのCSSを編集する方法


子テーマを使ってカスタマイズする方法


WordPressでスマートフォンサイトに対応させる3つの方法


 


記事投稿時の設定


投稿を予約する方法


記事を非公開にする方法


WordPressでカテゴリーを設定する方法


WordPressでタグを設定する方法


関連記事を表示させる方法


 


ウィジェット(サイドバー)の設定


ウィジェットを編集する方法


RSSボタンを設置する方法


人気記事を表示するプラグイン3選


検索フォームを追加する方法


 


固定ページやフォームを作成


固定ページを作成する方法


問い合わせフォームを作成する方法


 


アクセス解析の設定


Google Analyticsと連携させる方法


アクセス解析に便利なプラグイン10選


 


様々なシチュエーションに使える設定


サイト内に検索フォームを設置する方法


サイトの情報をバックアップする方法


サイトが真っ白で表示されなくなった時の対処法


WordPressのページ表示速度を高速化できるプラグイン5選


 


まとめ


過去にWordPressでサイトを作ろうとした経験がある人は分かると思いますが、最初のインストールや設定部分が一番骨の折れる作業です。ここでつまずいて諦めてしまう人も多くいます。


せっかくおしゃれなサイトをコーディングせずとも形にすることができるので、ぜひ一度流れをつかんでおきましょう。WordPressの使い方を覚えておけば、今後Webサイトを作る際にもすぐ完成できるはずです。



大石ゆかり


一からコードを書かずにこんなに簡単にサイトが作れるんですね。それにテーマやプラグインもいっぱいあって、選択するだけで使えますし。





田島悠介


そうだね。大まかなテーマを選んでから自分でテーマを触ってデザインを変えることもできるから、自分の作りたいようにも作れるよ。





大石ゆかり


そうなんですね!今度、自分なりのサイトを作ってみます!





田島悠介


うん。わからなかったらまた聞いてね♪





大石ゆかり


はい!お願いします!




 


[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。


情報提供元: TechAcademyマガジン
記事名:「 WordPressの使い方!初心者でもサイト作成が簡単に