WordPress初心者が知っておきたい22のポイント

今回はWordPress初心者の方に向けて「WordPressの基本」や「最初につまずきやすい点」などを紹介していきます。すでに知っている部分はサクッと読み飛ばしてくださいませ（とくに前半は簡単な内容です）。

1. WordPressは自由

WordPressはとにかく自由です。ブログから、企業やお店のホームページ（Webサイト）、掲示板などまで作ることができます。デザインのカスタマイズも自由。細かなところまで、自分好みに変えることができます。これがアメブロやはてなブログと比べたWordPressの何よりの魅力です。

2. 初心者でもテーマでデザインをおしゃれに

せっかくなら、おしゃれなサイトやブログを運営したいですよね。WordPressには「テーマ」と呼ばれるデザインテンプレートが無数にあります。
このテーマ選びがとても重要です。 良いテーマをインストールすれば、カスタマイズをほとんどしなくても、おしゃれなWebサイトが完成します。

（有料のものもありますが）無料でも高品質なものがたくさんあります。

当サイトからもSANGOという名前のWordPressテーマ（有料）を販売しています。興味のある方はぜひチェックしてみてください。

デモサイト

3. パーマリンク設定をはじめに行い、変更は慎重に

パーマリンク設定とは、ページのURLをどのようなルールで表示させるかという設定のことです。

管理画面の左下の「設定」「パーマリンク設定」から変更することができます。

パーマリンクはいくつかの選択肢の中から選ぶことができます。

おすすめは「投稿名」

Googleのガイドラインでは「シンプルで分かりやすいURLにする」ことが推奨されています。また、URLに日付を含めた場合の検索結果の日付について、旧記事では「記事更新時にも検索結果の日付が更新されない可能性（仮説）」と記していました。これは確定した仕様ではありません。URLは記事内容が分かる形を選びましょう。 選択肢の一つとして、投稿名（https://◯◯/sample-post/）を選ぶ方法があります。

投稿ページで末尾の指定を

パーマリンク設定で「投稿名」を選んだ場合には、投稿編集画面でURLの末尾を指定できるようになります。ここには、記事の内容を簡潔に表す短い語句を指定しましょう。英語に限定する必要はありません。上の画像は公開当時のクラシックエディターです。現在のブロックエディターでは投稿設定などからURL末尾を編集します。

パーマリンク設定を変えるリスク

後からパーマリンク設定を変えると、投稿済みの記事のURLまで変わる場合があります。変更するときは旧URLと新URLを対応させ、適切なリダイレクトや内部リンクの更新を計画しましょう。URL変更は検索や既存リンクに影響し得るため、設定は最初によく検討しておくと安心です。

4. WordPressでは複数のファイルを結合して1つのページを生成している

ここではクラシックテーマの仕組みを説明します。複数のPHPテンプレートを組み合わせて、記事ページやトップページなどのHTMLを生成する方式です。ブロックテーマではサイトエディターのテンプレートやパーツを使い、構成と編集画面が異なります。

例えば、記事ページの場合には、サイトタイトルまわりのパーツは「header.php」に、記事のコンテンツ部分は「single.php」に、サイドバー部分は「sidebar.php」に書かれています。

クラシックテーマでは、このようにパーツごとにファイルが分かれ、組み合わせてページを作ります。ファイル構成はテーマによって異なります。ブロックテーマではサイトエディターからテンプレートやパーツを編集できるため、PHPファイルの編集が常に必要というわけではありません。

5. カスタマイズ時には子テーマを使う

WordPress初心者の頃には、何気なくテーマファイルを直接いじってしまうのですが、これには少しリスクがあります。というのもテーマにアップデートがあったときに、せっかく編集したファイルまで上書きされてしまうのです。

親テーマのファイルへ直接変更を加える必要がある場合は、更新時の上書きを避けるため子テーマを利用しましょう。ブロックテーマの画面上でできる変更では、編集方法が異なります。

詳しくはこちらの記事をどうぞ。

WordPressで子テーマを活用して安全にカスタマイズを行う方法

6. WordPressではことあるごとにバックアップを

WordPressではことあるごとにバックアップを取りましょう。

とくに①WordPress/テーマのカスタマイズをする時のバックアップは重要です。コードを書き間違えるだけで、画面が真っ白になってしまいかねないですからね…。

7. FTPなどファイルへアクセスする手段を用意

WordPressではカスタマイズ時のちょっとしたコードのミスにより突然画面が真っ白になり、英語のエラー文だけが表示されることがあります。

カスタマイズ中にエラーが起き、管理画面も開けなくなる場合があります。そのときはサーバーのファイルへアクセスする復旧手段を確認します。FTPソフトはその一つで、契約先のファイルマネージャーやSFTPなどが使える場合もあります。

FTPソフトとは「サーバー」⇔「手元のパソコン」の間でファイルのアップロード/ダウンロードができるソフトのことです。FTPソフトの使い方や導入方法は、下の記事で初心者の方でも分かるように解説しています。

8. カスタマイズで困ったら、まずはキャッシュ消去

ブラウザのキャッシュとは、下図のように画像やCSSなどのファイルを閲覧者のパソコンやスマホに保存しておいて、次に同じ画像やファイルを読み込むときの時間を短縮する仕組みのことです。

皆さんのパソコンの中にも自分のブログのキャッシュが残り「デザインを変えたはずなのに反映されないぞ？」というようなことが起こるわけですね。

キャッシュを消去すると解決するパターン多し

「カスタマイズしたのに反映されない」というときには、まずはブラウザのキャッシュを消去しましょう。例えば、Chromeのキャッシュの削除の方法は下の記事でまとめています。

キャッシュ系プラグインでの消去も忘れずに

「WP Super Cache」などのキャッシュ系のプラグインを入れている場合には、ブラウザのキャッシュの消去とは別にプラグインの設定（管理画面）からキャッシュの消去を行う必要があります。

それでも反映されない場合は…

下記の記事を参考にしてみてください。

9. ブラウザの「検証」は早めに覚えよう

ブラウザには検証機能というものがついています。検証の使い方は今すぐに覚えておきましょう。自分好みにカスタマイズをしたいとき、デザイン崩れを直したいとき、CSSが反映されずに困っているときなどに大活躍します。

検証機能を使うときは、Webページ上の調べたい部分を右クリックして「検証」をクリックします。ブラウザによっては「調査」などの名前になっていることも。

すると、その部分のHTMLと、そのスタイルを決めるCSSが横並びで表示されます。

例えば、デザインが崩れてしまっている部分で検証を使えば「どんなHTML・CSSが書かれていて、何が問題でデザイン崩れが起きているのか」を調べられるのです。詳しい使い方はこちらの記事をどうぞ。Chromeの場合ですが、他のブラウザでも使い方はほぼ同じです。

10. 初心者はプラグインの入れすぎに注意

プラグインはWordPressにさまざまな機能を簡単に付け足すことができる仕組みのことです。

「バックアップを自動で取ってくれるもの」や「問い合わせフォームを簡単に設置できるもの」「画像を自動圧縮してくれるもの」など、たくさんのプラグインを無料で簡単に使うことができます。

このプラグインが便利でついついたくさん入れてしまうのですが、プラグインはときにトラブルのもとになります。テーマとの相性やプラグインどうしの相性が悪ければ、エラーが出ることもあります。
また、表示速度が落ちる原因になります（プラグインによります）。

プラグインを入れるときは慎重に

とはいえ「プラグインを使わない方が良い」というわけではありません。優秀なプラグインはうまく使うべきです。日本語に関する問題がある場合は、環境に応じて「WP Multibyte Patch」の要否を確認しましょう。すべてのサイトで必須という意味ではありません。

11. WordPressで不具合があったら、プラグインを停止してみる

デザイン崩れやエラーが起きたときは、直前の変更やサイトヘルスを確認し、プラグインの競合も切り分けます。稼働中のサイトではバックアップなど復旧の準備をしてから、必要に応じてプラグインを一つずつ停止・再有効化して原因を調べましょう。

12. スマホやタブレット表示までチェック

WordPress初心者〜中級者にありがちなのが、自分のパソコンで見た時の表示ばかり気にしていて、スマホやタブレットで見たときにデザインが崩れてしまっている、ということです。 カスタマイズを行ったときには必ずスマホ表示までチェックしましょう。

パソコンからスマホ表示を確認

わざわざスマホで開かなくても、PCブラウザからスマホ表示を確認できます。ブラウザによって確認方法はまちまちなのですが、例えばChromeの場合にはさきほど紹介した「検証」から調べられます（解説）。FirefoxやSafariの場合には、ツールや開発メニューから「レスポンシブデザインモード」を選びます。

13. やりたいことがあったり困ったりしたらググる

WordPressに関する記事は検索すればたくさんヒットします。何かやりたいことがあったり、困ったことがあったりしたら、まずは「WordPress ◯◯」や「WordPress ◯◯できない」というように検索してみましょう。人気のテーマを使っているのであれば、そのテーマ名を入れるのも効果的です。

英語でも検索してみよう

もし日本語でヒットしない場合には、英語で検索してみるのも良いかもしれません。やはり英語だと情報量が格段に違います。普段の検索エンジンに英語を入力すると、日本のサイトが中心にヒットしてしまうので、GoogleのUS検索（旧案内）のリンクも掲載当時の方法として残します。現在は検索言語や地域設定を確認して英語の資料を探せます。

14. ビジュアルエディタで困ったら、テキストエディタで

画像は公開当時のクラシックエディターです。ここでは「ビジュアル」と「テキスト」のタブを切り替えられます。現在の標準はブロックエディターで、ブロック単位の編集やコードエディターなど操作が異なります。

クラシックエディターで表示やプレビューがおかしい場合は、「テキスト」タブで該当箇所のHTMLを確認できます。現在のブロックエディターでは、問題のブロックやコード編集画面を確認します。変更前に内容を保存し、不要なタグだと確認できた箇所だけ修正しましょう。

15. ページの読み込み速度を上げよう

旧出典では、モバイルページの読み込み時間が1秒から5秒になると直帰の確率が90%高まると報告されました（掲載当時のソース）。この数値を現在のサイトの成果として保証するものではありません。WordPressサイトでも実際の計測と改善を進めましょう。具体的な方法は次の記事で解説しています。

この記事で紹介している方法は例えば以下のようなものです。

ちなみに読み込み速度は、Googleが提供するPageSpeed Insightsというツールを使えば、簡単に計測できます。

16. 画像は圧縮しよう

こちらは読み込み速度の話と関係するのですが、とくに重要なのでこのページでも取り上げておきます。画像のサイズは読み込み速度を遅くする大きな原因になります。必要以上に大きな画像は使わないようにしましょう。

画像は圧縮（とくにPNG画像）

とくにPNG画像は思いのほか大きなサイズになってしまいがちです。そこでおすすめなのが「PNG圧縮」というWebサイトです。

無料、会員登録不要、ソフトインストールは不要。画像をドラッグしてアップロードするだけで圧縮が始まります。圧縮方式や設定によって画質が変わる場合もあるため、変換後の見た目と容量を確認しましょう。

まとめて圧縮したい場合はプラグインを

「EWWW Image Optimizer」というプラグインを使うと、WordPressに画像をアップロードした時に自動で圧縮を行ってくれます。既にアップロード済みの画像もまとめて圧縮することもできる優れもの。

画像挿入時に最適なサイズを選ぼう

WordPressでは画像をアップロードしたときに、「サムネイル」「中」「大」というように複数のサイズの画像を自動生成してくれます。

画像挿入画面の右下でサイズを選べることも知っておきましょう。

17. XMLサイトマップを確認し、必要に応じてSearch Consoleへ送信

XMLサイトマップとは、サイト内に存在するページ一覧がまとまった地図のようなものです。これを「Google Search Console」というサービスに登録しておくことで、Googleがサイト内のページを把握しやすくなります。

新しいサイトや規模の大きいサイトでは、XMLサイトマップがURLの発見を助けることがあります。WordPress 5.5以降は標準でもサイトマップが作られます。Search Consoleへの送信は状況に応じて検討でき、送信してもクロールやインデックス登録が保証されるわけではありません。

18. アイキャッチ画像はCanvaを使えば無料＆簡単

アイキャッチ画像を作りたいときには、Canvaというデザインツールを使うのがおすすめです。たくさんのテンプレートが用意されており、少し編集を行うだけでおしゃれなデザインの画像を作ることができます。

ブラウザ上で編集ができるため、ソフトをインストールしたりする必要もありません。

アイキャッチ画像のデザインのコツについては、次の記事にまとめています。

19. SNSでシェアされたときのアイキャッチ画像表示をチェック

WordPressで各投稿に登録したアイキャッチ画像は、（テーマやプラグインで設定ができていれば）X（旧Twitter）やFacebookでシェアされたときにも使われます。

Twitterカード/OGP設定をしよう

このような「シェアされたときのリンクの表示を最適化する設定」は、X（旧Twitter）カード設定やOGP設定と呼ばれます。最近だとテーマ側であらかじめ設定されていることも多いですね（サルワカのテーマSANGOでも設定済みです）。詳しい解説は別の記事にまとめました。

アイキャッチ画像がどのように表示されるかを確認しよう

X（旧Twitter）やFacebookでシェアされる画像の表示サイズや切り抜き方は、サービスや表示場所で変わります。文字などを画像に入れていると、中途半端な位置で切り抜かれて不格好になってしまうことがあります。

20. 画像はドラッグで挿入できる

地味に時間短縮になるのがこちら。画像を投稿編集画面へドラッグしてアップロードできます。画像は現在のブロックエディターでは画像ブロックやメディアライブラリからも選べます。複数の画像をまとめて扱うときは、挿入先と順番を確認しましょう。

21. 意味を持つ画像には代替テキストを記入

画像は公開当時の編集画面です。現在のブロックエディターでは画像ブロックの設定から「代替テキスト」を入力できます。こちらは「画像が表示されなかったとき」や「ページコンテンツが音声により読み上げられるとき」などに使われます。

つまり、代替テキストが「スマホの通信制限がかかってしまって、文字はなんとか読み込めたけど画像は読み込めなかった」なんていう時に表示されたりするわけです。
また、検索エンジンは画像の内容を判断するうえで、代替テキストを見ています。画像の目的や文脈に合う説明を入れましょう。意味を持たない装飾画像は空の代替テキストが適切な場合もあります。

画像の「鉛筆マーク」は公開当時のクラシックエディターの操作です。現在は画像ブロックの設定から、挿入後でも代替テキストを編集できます。

代替テキストの書き方は？

簡潔に書きます。SEO対策になるからと言って、キーワードを詰め込むのもやめましょう（スパムとみなされる可能性もあります）。「画像が読み込まれなかったとしても、代替テキストにより画像内容が把握できる」のが理想です。詳しくは、次の記事が参考になります。

22. 無料素材を活用しよう

こちらはWordPressに限った話ではないですが…。最近だと高品質な写真、イラスト、アイコンを無料配布してくれているサイトがたくさんあります。

例えば、Unsplashというサイトでは美しい写真がたくさん配布されています。Unsplashの写真は商用利用も可能ですが、写真の無加工販売や競合サービスを作る目的などには制限があります。利用前に現行ライセンスを確認しましょう。

Unsplash

WordPress初心者の方が知っておきたいことをまとめてきました。WordPressはユーザーが多いので、ググればだいたい答えが見つかります。困ったら、まずは調べてみましょう。