初心者でもわかる!ワードプレスの使い方を徹底解説!

最初に設定しておきたいWordPressの使い方 ダッシュボードの基本操作
ホームページの作り方に関する記事一覧はこちらをご参照ください。
【ここだけ見れば作れちゃう!】初心者向けホームページの作り方まとめ
 

今回は、これからワードプレスを初めて触る初心者の方向けに、管理画面を中心としたWordPressの使い方について説明していきます。
 

■2分でわかるWordPressでホームページ作成動画

※2017年10月11日時点での手順になります。
 

 

【メルマガ登録はこちら!!】
ワードプレスの便利な使い方情報をGET

WordPress 自分でホームページ・ブログを作成したい個人事業主のためのWebスクール・教室 ウェブストエイト

 

WordPressとは 基本的使い方と管理操作

WordPressとは

ワードプレスのロゴ
 

はじめに、ワードプレスの仕組みについて簡単に説明します。
 

もともとWordPress(ワードプレス)は、2003年にブログを作成するシステムとして登場しました。その後、徐々に進化・発展していき、今ではブログ以外にも企業のホームページ・ウェブサイトとして多く利用されています。
 

そして、現在ではホームページ作成するためのシステム(CMS)のなかでは世界・日本共にNo1の非常に有名なシステムとなりました。
 

2016年時点 世界のワードプレスシェア

2016年時点 世界のワードプレスシェア

2015年時点 日本のワードプレスシェア

2015年時点 日本のワードプレスシェア

 

その特徴として、豊富なテーマ(デザインテンプレート)やプラグイン(スマホのアプリのようなもの)があり、オリジナルのデザインで会員サイトやネットショップなどを作ることも可能です。
 

WordPress テーマ 追加画面

WordPress テーマ 追加画面

 

ワードプレス プラグイン追加画面

ワードプレス プラグイン追加画面

また、ワードプレス自体は無料で誰でも利用でき商用利用も可能ですので、勉強すればだれでもワードプレスでホームページを作ることができます。
 

以下はワードプレスの構成、いわゆるシステムの実体です。
ワードプレスの構成
 

通常のホームページの場合は、HTMLファイルや画像ファイルなどのファイル類で構成されますが、
 

ワードプレスはこれらのフォルダ・ファイル類に加えて、MySQLと言われるデータベース(データの蓄積される場所)を利用しています。
 

実はブログ情報(文章)などもデータベースに蓄積されていて、このデーターベースとHTML・CSS・PHPなどのファイル類と連携して、ワードプレスのシステムを提供しています。
 

▲▲目次に戻る▲▲

 

WordPressへのログイン

WordPressを管理・設定するためには、まずWordPressへログインしなければなりません。
 

下記のURLでアクセスするとログイン画面が表示されます。
http://WordPressをインストールしたドメイン/wp-admin/
 

管理用のユーザーIDとパスワードを入力します。

WordPress ログイン画面

WordPress ログイン画面

 

管理者でログイン成功すれば、管理画面が表示されます。

WordPress ダッシュボード(管理画面)

WordPress ダッシュボード(管理画面)

 

WordPressの管理画面

ここでは、WordPressの管理画面でよく使う下記の項目を中心に説明していきます。
 

WordPress 管理画面 (ダッシュボード)

WordPress 管理画面 (ダッシュボード)

 

項目内容
投稿ブログとして利用できる機能です。時系列で最新情報が一番上に表示されていきます。お知らせ情報やブログなど投稿機能を利用するのが一般的です。
固定ページ会社情報やお問い合わせページなど決まった場所の決まった箇所に表示しておきたいページを固定ページで作成します。ページ作成の機能自体は投稿とほぼ同じです。
外観その名の通り、サイトの外観(デザイン)系の設定を外観から設定します。テンプレートやメニューバーなどもここで設定できます。
プラグインスマートフォンでいうアプリの追加機能です。お問い合わせ機能やサイトマップなどWordPress自体が持っていない機能をプラグインという形で追加することができます。
設定サイト名やURLの構造設定、トップページの設定などの各設定ができます。

 

それでは、順番に説明していきます。
 

▲▲目次に戻る▲▲

 

WordPress 投稿の使い方

 
「投稿」はブログとして利用できる機能です。お知らせ情報やブログに書くような内容を書くのが一般的です。
 

また、ブログ一覧(初期状態だとトップページ)ページでは時系列で最新の投稿一覧が表示されています。

投稿一覧ページでは書いたブログが時系列順で一覧で表示されます

投稿一覧ページでは書いたブログが時系列順で一覧で表示されます

 

投稿を追加するには、管理画面から投稿>投稿一覧を選択します。投稿一覧が表示されますので新規登録ボタンを押下します。

WordPress 投稿機能

WordPress 投稿機能

 

投稿画面が表示されます。タイトルと記事の内容を記述していきます。
 
ワードプレスの投稿画面
 

投稿のビジュアルエディタとテキストエディタ

投稿画面では、HTMLなどのコードを知らなくてもビジュアル的に記事を編集・表示してくれるビジュアルエディタHTMLで細かい書き方ができるテキストエディタがあります。
 

下記はビジュアルエディタです。HTML文を知らなくても視覚的に記事を作成することができます。書きやすいので、はじめはこちらのビジュアルエディタを利用して文章を書くと良いと思います。

WordPress ビジュアルエディタ HTML文を知らなくても視覚的に記事を作成することができる

WordPress ビジュアルエディタ

 

また、TinyMCE Advancedなどのプラグインを利用するとワードのように文字色を変えたり、フォントの設定をしたりすることができるようになります。
 
TinyMCE Advancedインストール後のWordPress ビジュアルエディタの状態

 

下記はテキストエディタです。HTML文で記述することができます。インラインでCSSも記述できるので、より細かい表現をすることができるようになります。

WordPress テキストエディタ HTML文で記述することができる。ビジュアルエディタで書いたものもHTML表記されている。

WordPress テキストエディタ

 
 

投稿で画像・動画を追加する

 
画像や動画を追加する場合は投稿画面で「メディアを追加」を押下します。

WordPress 投稿画面

WordPress 投稿画面

 

ファイルアップロードで追加したいファイルをアップロードします。

WordPress  ファイルアップロード

WordPress ファイルアップロード

 

追加したファイルを選択して「投稿に挿入」ボタンを押下します。

WordPress ファイル選択

WordPress ファイル選択

 

投稿画面に画像が追加されたことを確認します。

WordPress 投稿画面 画像追加

WordPress 投稿画面 画像追加

 
 

投稿でアイキャッチを追加する

ブログには「アイキャッチ」という、いわゆるサムネイル表示機能があります。アイキャッチを設定していると、記事の一覧表示で下記のようにサムネイルが表示されます。

ブログ一覧で表示されるアイキャッチ(サムネイル)

ブログ一覧で表示されるアイキャッチ(サムネイル)

 

アイキャッチは投稿画面右下の「アイキャッチ画像を設定」から設定することができます。
アイキャッチの設定
 

前述に説明した画像の追加と同じように、画像ファイルを指定してアイキャッチ画像を設定します。

アイキャッチ画像を追加

アイキャッチ画像を追加

 

ブログ一覧ページで設定したアイキャッチの画像が表示されていれば完了です。

ブログ一覧で表示されるアイキャッチ(サムネイル)

ブログ一覧で表示されるアイキャッチ(サムネイル)

 

投稿でカテゴリー・タグを追加する

記事にはカテゴリーやタグを追加することができます。
 

カテゴリーやタグを追加することで、何のテーマかわかりやすくなったり、カテゴリー・タグ一覧の記事を閲覧できるようになります。
 

WordPress カテゴリーとタグの表示

カテゴリーとタグの表示

 

投稿画面の右下にあるカテゴリーと追加・選択することができます。初期状態は「未分類」というカテゴリーにチェックが付いています。

カテゴリーの追加

カテゴリーの追加

 

追加したカテゴリーにチェックを入れます。

追加したカテゴリーの選択

カテゴリーの選択

 

また、カテゴリーのすぐ下にタグを設定する箇所がありタグの追加ができます。

タグの追加

タグの追加

 

投稿のカテゴリー・タグから新規追加したり、作成したカテゴリ・タグの編集することも可能です。

wordpress 投稿>タグのページ

投稿>タグのページ

 

wordpress 投稿>カテゴリーのページ

投稿>カテゴリーのページ

 

投稿で記事のURLを変更する

 
記事のURLは下記の編集ボタンより変更することができます。
記事を書くとデフォルトでタイトルがURLに表記される
 

初期状態は、記事のタイトルがURLに設定されています。このままではタイトルを変更するたびにURLも変わってしまうため、英語表記に変更することをオススメしています。

パーマリンクを投稿名に設定。初期はタイトル名がURLに設定される

パーマリンクを投稿名に設定。初期はタイトル名がURLに設定される

 

パーマリンクの設定。意味をそのままで英語表記に変更する

意味をそのままで英語表記に変更する

パーマリンク(URL構造)の共通設定は下記をご参照ください。
6-3. パーマリンク設定方法
 

投稿で記事を公開する

 
記事を下書きしたり、プレビューで確認の上、記事が完成したら公開ボタンを押下します。

WordPress 投稿機能

WordPress 投稿機能

 

プレビュー画面

WordPress プレビュー画面

WordPress プレビュー画面

 

公開範囲を設定することもできます。公開状態の項目で編集ボタンを押下します。
記事にパスワードを設定することができる
 

記事にパスワードをつけることができます。パスワードを知っている人だけが記事を閲覧できるようになります。
公開状態で編集ボタンを押下
 

▲▲目次に戻る▲▲

 

WordPress 固定ページの使い方

つぎに固定ページについて説明します。固定ページは投稿とほぼ同じ機能になりますが、通常ナビゲーションバー(メニューバー)にあるような会社情報やお問い合わせページは固定ページで作成します。
 

下記は固定ページをメニューバーに設定した時のサンプルです。
WordPressメニューバー
 

固定ページを押下すると固定ページの一覧が表示されます。追加する場合は「新規追加」を押下します。

WordPress 固定ページ一覧

WordPress 固定ページ一覧

 

固定ページ画面が表示されますので、投稿と同じ要領で記事を作成できます。

WordPress 固定ページ

WordPress 固定ページ

 

投稿にあるような「カテゴリー」といった機能はなく、投稿にように記事一覧にも表示されません。
 

(※)ページ作成の機能自体は投稿とほぼ同じですのでここでは割愛します。
 

▲▲目次に戻る▲▲

 

外観の使い方

外観では、その名の通り、サイトの外観(デザイン)系の設定を設定します。テンプレート(テーマ)やメニューバーの設定も外観からできます。

WordPress 外観

WordPress 外観

 

ここでは、「テーマ」・「メニュー」・「ウィジェット」の3つについて説明していきます。
 

外観>テーマの設定方法

WordPressでは、テーマというデザインのテンプレートを利用します。
 

テーマは自作することもできますが、無料・有料含めて様々なテーマがリリースされていて、それらを利用することができます。
初期状態はサボテンの「TwentySeventeen」というテーマです(2017年10月時点)。
 

ワードプレス テーマ
 

WordPressではそれらの既成テーマを使えば自作しなくても綺麗なデザインのホームページを作ることができます。ここでは、WordPressの公式テーマ(※)を設定する方法を説明していきます。
 

(※)公式テーマはWordPressがそのテーマが一定の基準をクリアしたものと認めたもので、WordPressの管理画面から検索してダウンロードすることができます。
 

WordPressの管理画面上の外観>テーマを選択します。
WordPress 外観>テーマ
 

新規追加ボタンを押下します。
WordPress テーマ 新規追加
 

検索窓で探しているテーマを入力します。ここでは有名なテーマである「Lightning」を使います。
「Lightning」と入力して表示された下記のテーマをインストールします。
WordPress テーマ Lightning インストール
 

有効化します。
WordPress テーマ Lightning 有効化
 

以上でテーマの適用は完了です。
 

トップページを参照するとテーマが適用されて、見た目がガラリと変わっていることがわかります。
 

WordPress テーマ Lightning が適用された
 

補足 サイトからテーマをダウンロードして設定する方法

公式テーマ以外にも無料・有料含めたくさんの魅力的なテーマがリリースされています(※)。
 

(※)グローバル対応や審査時間・プロセスなど問題で、有名なテーマでも公式テーマとして登録されていないものもたくさんあります。審査を経ていないため高品質なものから低品質なものまでいろいろもありますので、気になる方は適用前にテーマ名で検索してそのテーマの評判を確認してみると良いでしょう。

公式以外のテーマは前述のように検索しても出て来ないので、テーマを販売サイトからダウンロードして適用する必要があります。
 

ここでは、テーマをzip形式でダウンロードして適用する方法を紹介します。
 

ここで紹介するサイトは「テンプレートキング」です。テンプレートキングとはWordPressなどのデザインテンプレート(テーマ)や画像素材を無料で利用出来るサイトです。
 

テンプレートキングにアクセスしてトップページで「テンプレート一覧」を押下します。
テンプレートキング

WordPress テンプレートキング トップページ

WordPress テンプレートキング トップページ

 

たくさんのテンプレートが表示されます。好きなテーマを選択してダウンロードを進めていってください。

WordPress テンプレートキング テンプレートの選択

WordPress テンプレートキング テンプレートの選択

 

ダウンロードしたzipファイルを任意の場所に保存しておきます(解凍はしないでください)

テンプレートキング zipファイル

テンプレートキング zipファイル

 

次にWordPress側でダウンロードしたzipファイルを適用します。外観>テーマから新規追加ボタンを押下します。
WordPress テーマ 新規追加
 

テーマのアップロードボタンを押下します。

WordPress テーマのアップロード

WordPress テーマのアップロード

 

ファイルを選択ボタンを押下します。

WordPress テーマのアップロード

WordPress テーマのアップロード

 

先ほどの手順でダウンロードしたzipファイルを選択します。

テンプレートキング zipファイル

テンプレートキング zipファイル

 

今すぐインストールボタンを押下します。

WordPress テーマのインストール

WordPress テーマのインストール

 

インストール完了後回画面に遷移しますので、有効化ボタンを押下します。

WordPress テーマの有効化

WordPress テーマの有効化

 

サイトを表示ボタンを押下します。(http://wordpressをインストールしたURLでもアクセスできます)

WordPress テンプレートキング サイト表示

WordPress テンプレートキング サイト表示

 

ダウンロードしたテーマが適用されていれば完了です。

WordPress テンプレートキング テーマ適用後

WordPress テンプレートキング テーマ適用後

 

外観>メニューバーの設定方法

ここでは、下記のようにナビゲーションバー(メニューバー)を作成する手順を説明していきます。(※)メニューバーの位置や見え方はテーマによって異なります。
 

WordPress メニューが反映されていることを確認

WordPress メニューが反映されていることを確認

 

(※)事前準備として、下記のように固定ページでいくつか記事を作成しておいてください。

WordPress 固定ページ一覧 サンプル

WordPress 固定ページ一覧 サンプル

 

それでは、メニューバーの設定方法を説明していきます。外観>メニューの設定を選択します。

WordPress 外観>メニュー

WordPress 外観>メニュー

 

まずメニューを作成します。ここでは、「Menu1」と入力してメニューを作成ボタンを押下します。

WordPress メニューバーの設定 メニュー「Menu1」を作成

メニュー「Menu1」を作成

 

Menu 1が作成されました。このままメニューを保存ボタンを押下して、作ったメニューを保存します。

WordPress メニューバーの設定 メニュー「Menu1」を保存

メニュー「Menu1」を保存

 

次に作ったメニューに対して、項目を追加していきます。
 

左側にあるリストから追加したい項目を選択します。ここでは事前に作った固定ページの項目をチェックして、メニューに追加します。

WordPress メニューバーの設定 メニューとなる項目を選択

メニューとなる項目を選択

 

追加したメニューは、ドラッグ&ドロップでメニューの順番を変えたり、各メニューの表示名を変更したり、追加・削除することができます。

WordPress メニューバーの設定 ドラッグ&ドロップでメニュー項目の順番を変更

ドラッグ&ドロップでメニュー項目の順番を変更

 

メニュー項目の表示名は▼を押して変更できます。

WordPress メニュー項目(▼)で編集できる

メニュー項目(▼)で編集できる

 

WordPress 外観>メニューの設定 リネーム

WordPress 外観>メニューの設定 リネーム

 

同様に▼(▲)を押して削除リンクから削除することもできます。

WordPress 外観>メニューの設定 削除

WordPress 外観>メニューの設定 削除

 

設定が完了したら、最後にメニューの位置にある「Header Navigation(※テーマにより名称が異なります)」にチェックを入れて保存ボタンを押下します。

WordPress メニューバーの設定 メニューの位置の設定

メニューの位置の設定

 

メニューバー設定完了後にトップページを確認します。設定した通りに表示されていればOKです。

WordPress メニューが反映されていることを確認

WordPress メニューが反映されていることを確認

 

■メニューバーの設定方法(動画版)


 

▲▲目次に戻る▲▲

 

外観>ウィジェットの設定方法

WordPressでは、ウィジェットというページの特定部分の表示をカスタマイズできる機能があります。
 
サイドバーやフッターなどの部分でウィジェットでバナーを追加したり、投稿一覧を表示したりなど設定することができます。
 

ウィジェットは外観>ウィジェットから設定します。
ワードプレス 外観>ウィジェット
 

左側の追加したいウィジェットタイプを選択してドラッグ&ドロップで任意の箇所にウィジェットを追加します。
ウィジェットタイプを選択してドラッグ&ドロップで任意の箇所にウィジェットを追加する
 

下記はテキストタイプのウィジェットです。設定後に保存して完了です。
テキストウィジェットを保存
 

トップページで、サイドバーにテキストウィジェットが追加されたことを確認して完了です。
トップページのサイドバーにテキストウィジェットが追加された
 

▲▲目次に戻る▲▲

 

プラグインの使い方

プラグインは、スマートフォンでいうアプリ機能に相当します。
 

プラグインでは、お問い合わせ機能やサイトマップなどWordPress自体が持っていない機能をプラグインという形で追加することができます。
 

プラグインを選択すると現在インストールされているプラグインの一覧が表示されます。新しくプラグインを追加する場合は、「新規追加」を押下します。

WordPress プラグイン

WordPress プラグイン

 

追加画面が表示されますので、追加したいプラグイン名などで検索してプラグインを追加することができます。

WordPress プラグイン 追加

WordPress プラグイン 追加

 

 

▲▲目次に戻る▲▲

 

設定の使い方

設定では、サイト名やパーマリンク(URLの構造)、トップページ設定などの各種設定ができます。

WordPress 設定

WordPress 設定

 

一般設定

一般設定では、サイト名やキャッチフレーズ、メールアドレスなどを設定できます。

WordPress 設定 一般設定

WordPress 設定 一般設定

 

なお、上記のWordPressアドレス(URL)、サイトアドレス(URL)は誤った設定をするとログインでできなくなる場合もあるため、設定変更の際はご注意ください。
 

表示設定

表示設定では、トップページ(フロントページの)の表示や投稿一覧の表示件数などを設定できます。

WordPress 設定 表示設定

WordPress 設定 表示設定

 
 

フロントページ・投稿(ブログ)ページを設定する

トップページではデフォルトの状態は、最新の投稿記事が表示されている状態です。
トップページではブログが一覧で表示されている
 

ここでは、表示設定からフロントページやブログ一覧のページを設定する方法を紹介します。
 

事前作業として、固定ページでトップページ用の固定ページ「HOME」とブログ一覧用の固定ページ「BLOG」を作成しておいてください。
固定ページでHOMEとBLOGを作成しておきます

 

設定>表示設定で、フロントページの表示でトップページ用の固定ページ(ここでは事前に作成した「HOME」)を設定します。
同様に、投稿に事前に作成した「BLOG」という固定ページを設定します。

WordPress 設定>表示設定 フロントページの設定

WordPress 設定>表示設定 フロントページの設定

 

サイトのトップ(http://WordPressをインストールしたドメイン/)を表示した際に設定した固定ページが表示されていれば完了です。

 

また、BLOGページにブログ一覧が表示されていれば完了です。
 

パーマリンク設定

パーマリンク設定では、投稿ページのURLなどが設定できます。
 
パーマリンクとは、WordPressで作成した投稿(ブログ)のURL形式のことです。下記のようにワードプレスは複数のURL構造から自分の好きな方式を選択できます。

ワードプレス 投稿のURL構造の設定
 

管理する上では上記の基本の「?p=123」などの自動連番が楽ですが、ユーザーや検索エンジン視点で考えると意味のない英数字の羅列よりも意味のある表記の方が理解しやすく推奨されています。
 

また、上記の日付と投稿名「/2017/10/06/sample-post/」などの日付がURLに入れる方式は、古い記事を最新情報に更新した時にURLだけ古い日付で古い情報のイメージを与えるため本サイトでは採用せずに、
 

「http://ドメイン名/投稿名」にして投稿名を英語に修正しておりオススメの設定です。 

パーマリンクを投稿名に設定。初期はタイトル名がURLに設定される

パーマリンクを投稿名に設定。初期はタイトル名がURLに設定される

 

パーマリンクの設定。意味をそのままで英語表記に変更する

意味をそのままで英語表記に変更する

 

なお、複数の投稿でURLが重複した場合は、連番で-2などが自動で末尾に加えられるので重複の心配はありません。

testというURL

testというURL

 

もう一つtestというURLを設定すると自動的に「test-2」と連番が付与される

もう一つtestというURLを設定すると自動的に「test-2」と連番が付与される

 

共通設定は、ダッシュボード(管理画面)にて、設定>パーマリンク設定を選択します。

WordPress パーマリンクの設定 設定>パーマリンク設定

設定>パーマリンク設定

 

ここでは、共通設定で投稿名を選択して保存します。

WordPress パーマリンクの設定 URL構造の設定

パーマリンクの設定 URL構造の設定

 

以上でパーマリンクの共通設定は完了です。
 

▲▲目次に戻る▲▲

 

まとめ

今回は、WordPress 使い方 を理解するために、基本操作画面と以下のよく使う各項目の意味を説明しました。
 

項目内容
投稿ブログとして利用できる機能です。時系列で最新情報が一番上に表示されていきます。お知らせ情報やブログなど投稿機能を利用するのが一般的です。
固定ページ会社情報やお問い合わせページなど決まった場所の決まった箇所に表示しておきたいページを固定ページで作成します。ページ作成の機能自体は投稿とほぼ同じです。
外観その名の通り、サイトの外観(デザイン)系の設定を外観から設定します。テンプレートやメニューバーなどもここで設定できます。
プラグインお問い合わせ機能やサイトマップなどWordPress自体が持っていない機能をプラグインという形で追加することができます。
設定サイト名やURLの構造設定、トップページの設定などの各設定ができます。

 

自分で触ってみないことにはなかなかわからないことも多いと思いますので、興味がある方はたくさん触ってみて覚えてください。
 

ホームページの作り方に関する記事一覧はこちらをご参照ください。
【ここだけ見れば作れちゃう!】初心者向けホームページの作り方まとめ
 

今回は以上になります。最後までご覧いただきありがとうございました。
 

【メールマガジンにて限定情報配信】
WordPressやホームページ作成、SEO対策・ウェブ集客に関するウェブストエイトの独自ノウハウを読者限定で配信しています。まずはお気軽にご登録ください。

詳細はこちら

 

【メルマガ登録はこちら!!】
自分でホームページ制作・Web集客したい個人事業主様向けWebスクール・教室

自分でホームページ作成・Web集客したい個人事業主のためのウェブスクール・教室 ウェブストエイト

大阪の個別指導Webスクール
「WEBST8」

個人事業主様・経営者様・起業副業など
自分のビジネスのために
ホームページの作り方を
習得するスクール

\ 自分で作る選択を! /

詳しくはこちら

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


ABOUTこの記事をかいた人

松本慶

【IT業界でシステムエンジニア歴8年現役Web系フリーランス】

1985年生まれ 立命館大学卒業。 某複合機メーカーで約8年間システムエンジニアとして大阪で勤務後、2016年秋に独立。

「一人一人が創意工夫で思い描く未来を!」 という想いもとに『自分でホームページを作成してWeb集客・売上拡大したい』個人事業主のためのWeb教室・スクール「ウェブストエイト(Webst8)を運営開始。
ウェブやマーケティングなどの覚えたノウハウを自分や周りの目標実現のツールとして使うことにやりがいを感じています。

メルマガ登録はこちら

個人事業主のためのWeb教室・スクール「ウェブストエイト」 ホームページ