WordPressは、テーマを入れ替えるだけで、レイアウトやアイキャッチ画像の見せ方、スマフォ対応などデザインを変えることができます。表面的なスタイルの変化だけでなく、拡張機能や、SEO内部対策などテンプレート設計も変わります。

Webサイトのコンテンツを最大限に生かすには、SEOに強いWordPressテーマを選ぶことが重要です。「Web集客の成功を目的」としたテーマの選び方と変更時の注意点を解説します。

本題に入る前に、WordPressのテンプレート構造について解説します。WordPressのテーマがどのようなファイルで構成されているのか理解することで、入手したテーマのカスタマイズなどに役立ちます。

テーマとテンプレートの構造

WordPresを始めて使う方は、WordPressテーマのフォルダーを見たところ、「あれ、htmlファイルがない!?」と驚かれた経験がないでしょうか?

WordPressは、phpファイルで構成されいるため、htmlファイルは存在しません。WordPressのテンプレートの階層と役割を知ることは、WordPressの理解が深まるきっかけとなり、ご自身でテーマの選び、編集、カスタマイズするのに場合に役立ちます。

テンプレートの階層と役割

WordPresのテーマとテンプレートの違いをご存知でしょうか? WordPress Codex 日本語版によると、次のように定義されています。

WordPressのテーマはファイルの集合体で、ブログの生成する内容とともにグラフィカルインターフェイスを生み出します。これらのファイルはテンプレートファイルと呼ばれています。

引用元: テーマの使い方 – WordPress Codex 日本語版

つまり、テンプレートが集まって機能する単位がテーマです。テーマごとに機能が異なるので、使用されるテンプレートの種類もテーマによって異なります。テンプレートは、その役割から大きく3つに分類することができます。

次の図は、WordPress Codex 日本語版からの引用です。WordPressのページごとに、どのテンプレートが使用されるのか階層的に示した図です。

テンプレートの階層

ページテンプレートの役割

ページの種類ごとに使用される主なテンプレートファイルを列挙しました。

home.php ホームページ表示

home.phpは、サイトのホームページを表示する時に使用するファイルです。ただし、管理画面の表示設定の「フロントページの表示」で固定ページが選択されている場合、その固定ページが優先的に表示されます。home.phpがテーマに含まれない場合、index.phpが使用されます。

front-page.php フロントページ表示

front-page.phpはhome.phpがテーマに含まれる場合、優先表示されます。home.phpとは違い、管理者画面の表示設定「フロントページの表示」に影響を受けません。

single.php 投稿ページ

single.phpは、投稿ページの表示に使用されるテンプレートファイルです。記事のアイキャッチ画像やタイトル、本文の内容などの表示をカスタマイズしたい場合、single.phpを編集します。

page.php 固定ページ

page.phpは、固定ページの表示に使用されるテンプレートファイルです。固定ページとは、「会社概要」や、「プライバシーポリシー」、「お問い合わせ」など単独で存在するページです。固定ページは、投稿ページとの違い特定のカテゴリーやタグに分類されません。特定のカテゴリーに紐付ける形でページを量産する場合(ブログ作成)は、投稿ページを使用します。

archive.php アーカイブページ

archive.phpは、カテゴリー別の記事一覧、タグ別の記事一覧、日付別の記事一覧、記事作成者別の記事一覧などを表示するテンプレートファイルです。

アーカイブページ種類ごとにデザインをカスタマイズしたい場合、以下のテンプレートファイルをテーマに追加します。

  • category.php:カテゴリー別の記事一覧
  • tag.php:タグ別の記事一覧
  • date.php:日付別の記事一覧
  • author.php:記事作成者別の記事一覧
  • taxonomy.php:カスタム分類の記事一覧

404.php 404 (Not Found)ページ

404.phpは、ネットユーザーがサイトにアクセスした際、サーバー上にページが存在しないことを知らせる時に使用します。

サイトにアクセスしたユーザーを逃さないために404.phpに記事一覧などの表示などの工夫が必要です。

search.php 検索結果ページ

search.phpは、検索結果に使用されるテンプレートファイルです。キーワードが含まれる投稿ページの一覧を表示します。キーワードに該当するページがない場合、ユーザーに探しているページがないことも通知する必要があります。

パーツテンプレートの役割

パーツテンプレートとは、どのページテンプレートでも使用する共通部品です。もし、パーツテンプレートがなかった場合、共通部分(ヘッダーデザインなど)を変更するために、全ページテンプレートを編集しなければなりません。パーツテンプレートは、WordPressのカスタマイズをかかる労力を軽減してくれます。

主なパーツテンプレートは、以下の3つです。

  • header.php:ヘッダー部分の表示
  • footer.php:フッター部分の表示
  • sidebar.php:サイドバー部分の表示

パーツテンプレートをページテンプレート内に呼び出すには、 インクルードタグという関数を使用します。たとえば、get_header() タグは、header.phpを呼ぶ出す機能がありあます。

テーマ選びで気をつけるべきポイント

WordPressには、無料テーマ・有料テーマ、海外テーマ、国産テーマの4項目で分類することができます。それぞれの特長をまとめました。

項目 無料テーマ 有料テーマ
海外製 公式テーマディレクトリから入手。種類も豊富で審査を通過しているので安全。初心者におすすめのテーマ。 テーマ販売サイトから購入。デザイン性が高く高機能なテーマが多い。日本語で書かれたカスタマイズ情報が少ない。
日本製 公式テーマディレクトリ、もしくは個人・企業のサイトから入手。他のサイトと類似したデザインになりやすい。 テーマ販売サイトや個人・企業のサイトから購入。サポートがないテーマ、1サイトしか使えないテーマがあるので注意が必要。

もしあなたがWordPress初心者であれば、日本語に対応している公式無料テーマをおすすめします。WordPressに慣れ親しんだ頃に、Webサイトの運営方針にあったデザインや機能を求め、有料テーマを探すという手順が失敗しないテーマ選びです。

SEOとWeb集客の視点でテーマをチェックする

本格的にWordPressを使ってネットから集客をしたい場合、見た目のデザインだけでなく、検索エンジンにインデックスされやすいSEO内部対策に対応した構造と、Web集客機能があるテーマをおすすめします。初心者の方が有料テーマを購入する場合は、情報交換を目的としたフォーラムや疑問点を解消してくれるメール対応などのサポート体制があるテーマがおすすめです。

有料のWordPressテーマを購入する場合のチェック項目をまとめました。テーマを購入する前に、下記の8項目を参考にしてデモサイトなどで十分に確認してください。

[1]モバイルフレンドリーテストでデモサイトをチェックする

モバイルフレンドリー

モバイル フレンドリー テストとは、Webサイトのスマホ表示をチェックするGoogleの無料ツールです。WebサイトのURLを入力するだけで判定できます。

Googleが>モバイルフレンドリーを重視する背景として、スマホからのネット利用者の増加という傾向があります。

導入を検討しているWordPressテーマのデモサイトを使って、モバイルフレンドリーのチェックをおすすめします。なお、主なモバイル フレンドリーの条件は以下となります。

  • 携帯端末では一般的でないソフトウェア(Flash など)を使用していないこと
  • ズームしなくても判読できるテキストを使用していること
  • ユーザーが横にスクロールしたりズームしたりする必要がないよう、コンテンツのサイズが画面のサイズと一致していること
  • 目的のリンクを簡単にタップできるよう、それぞれのリンクが十分に離れた状態で配置されていること

引用元: ウェブマスター向け公式ブログ

[2]PageSpeed Insightsで表示スピードのチェックする

PageSpeed Insights

PageSpeed Insightsとは、スマホとPC向けのページを表示スピードを測定するるGoogleの無料ツールです。0~100のスコアで判定され、85以上のスコアで合格と判定します。高いスコアを出すために、Webサイトのどこを改善すれば良いか診断結果が表示されます。

Webサイトの表示スピードが遅いと、ネットユーザ−のストレスに繋がり、サイト訪問者の離脱原因にもなります。テーマを購入する前にデモサイトのスピード表示をチェックすることをおすすめします。

[3]meta description(メタディスクリプション)の調整が出来る

meta descriptionとは、htmlのhead内に記述されるページの要約文です。

meta description

上記画像のように検索結果に、meta descriptionが表示されるケースがあるため、その表示内容は、検索ユーザーのクリック誘導に影響を与えます。

WordPressテーマに、meta descriptionの調整する機能があると、クリックされやすい表記に調整することが可能となります。単に、ページ内容をまとめるだけでなく、検索ユーザーが探し求めている情報があることを示すことで、クリック率の向上を図ることができます。

検索結果に表示されてもクリックされなければ、 サイトのアクセス数を伸ばすことはできません。meta descriptionの調整機能の有無はとても重要な要素です。

[4]品質の低いページのnoindexタグ挿入

noindexとは、特定のURLを検索エンジンへ登録させたくない場合に使うタグです。noindexは、htmlのhead内に記述します。

内容が薄く、他のページと重複しやすいページをnoindexに指定することで、Googleから低品質なサイトだと評価されるリスクを回避することができます。

Googleは、低品質なサイトの掲載順位を下げ、同時に、良質なサイトの掲載順位をより適切に評価します。

引用元: Googleウェブマスター向け公式ブログ

低品質なページとは、類似したページ、情報が薄いページです。具体的には、「アーカイブページ」や、「検索結果ページ」などが該当します。これらのページに対して、noindexが設定されているかテーマをご確認ください。

[5]カテゴリページのコンテンツ化

WordPressのカテゴリページは投稿記事のリスト一覧が一般的なデザインです。投稿ページの公開件数が増えることで、カテゴリーページが充実していくるため、単なる記事リストのページではもったいない状態となります。

カテゴリーページごとに説明文(他のカテゴリーと説明が重複しない文)を入れるこで、検索エンジンからの流入増加が期待できます。

新規カテゴリーを追加

WordPressの新規カテゴリー追加の画面には、ページに出力するための説明文を入力する箇所があります。(上記画像を参照)

「この説明はデフォルトではあまり重要な意味を持ちませんが、これを表示するテーマも中にはあります。」と注釈があるように、対応していないテーマも存在するのでご注意ください。

[6]パンくずリストの表示機能がある

パンくずリストとは、サイト訪問者が現在見ているページの階層を視覚的に分かりやすく表示したリンクリストです。名称は、童話「ヘンデルとグレーテル」の主人公が森で迷子にならないように、目印として自分が通った道にパンくずを置いたエピソードに由来します。

パンくずリストには、Googleがサイト内のページをインデックスしやすくなるというメリットもあります。構造化データと呼ばれる記述が採用されたパンくずリストは、検索結果にも反映されるので、クリック率の向上が期待できます。

[7]CTA機能の有無

CTAとは、Call To Action(コール トゥ アクション)の略です。「行動を喚起し、促す」という意味です。「行動」とはズバリ、商品購入です。

しかし、サイト訪問者がいきなり「商品を購入」することはありません。商品比較のため見積を依頼や疑問点を問い合わせ。今は必要としないけど、とりあえず資料を請求する。このような心理状態に合わせたCTAを設置できることが重要です。

CTAには、サイト訪問者のコンタクト情報を収集する機能と、投稿記事の文末や固定記事の文末など、ユーザーの動線を考慮して配置できる機能が理想です。

[8]ランディングページ機能の有無

ランディングページとは、サイト訪問者が初めに訪れる(着地する)ページという意味ですが、ほとんどの場合、Web広告のクリック後に表示する「セールスページ」と同じ意味で使われます。

本格的なランディングページの制作外注には、20万円前後の費用がかかります。Web広告の成果に応じて、ランディングページの最適化をしなければいけませんが、修正のたびに費用がかかります。

ランディングページ機能を有したWordPressテーマが存在します。大きな費用をかけることなく、自分たちで作成し、改良を重ねていけるのが魅力です。

テーマ変更時に役立つプラグイン

WordPressのテーマを変更すると、デザインだけなくテーマに依存している設定まで変わります。本番環境でテーマを変更する前に、やっておくべき準備をまとめました。

テーマ確認用のプラグイン「Theme Test Drive」

Theme Test Drive

公式プラグイン「Theme Test Drive」を使うことで、WordPressの本番環境に影響を与えずにテーマの確認ができます。変更したいテーマを選択し、「現在の状態」をonに切り替えます。

WordPressにログインしているユーザーだけが変更後のテーマを確認できるので、ネット上でサイトを見ている方には、普段と同じテーマが表示されます。管理画面のプラグインから「WP Theme Test」で検索し、インストールしてください。

マルウェアを見つけ出してくれるプラグイン「TAC」

Theme Authenticity Checker

マルウェア (malware) とは、有害な動作を行う意図で仕込まれた「悪意のある」コードです。

公式プラグイン「TAC(Theme Authenticity Checker )」を使うことで、WordPressテーマにマルウェアが仕込まれていないかチェックすることができます。

テーマに問題がなければ、「Theme Ok!」と表示されます。

メンテナンス中の表示が設定できるプラグイン「WP Maintenance Mode」

WP Maintenance Mode

変更から設定が完了するまでの間、サイト訪問者にメンテナンス中であることを告知できるのが、公式プラグイン「WP Maintenance Mode」です。管理画面のプラグインから 「WP Maintenance Mode」で検索し、インストールしてください。

GeneralタブのStatusを「Activated」に切り替えると、Webサイトはメンテナンス中表示になります。メンテナンス中の表示文言は、初期値が英語です。日本語文を入力し設定を保存してください。

テーマ変更後の注意点

WordPressのテーマ変更後に忘れがちな設定作業と注意点をご紹介します。

Googleアナリティクスなどのタグコードの埋め込み

Googleアナリティクスをはじめとする計測用のタグは、テーマごとに設定していきます。テーマ入れ替えにより、これらの設定を再度行う必要があるので、注意してくささい。

メニューの設定

メニューは、テーマによって表示される箇所が異なります。メニューの設定は、WordPressの管理画面 > 外観 > メニューから行ってください。

ウィジェットの設定

ウィジェットもテーマによって設定が変わります。テーマの変更後、ウィジェットの設定も確認してください。WordPressの管理画面 > 外観 >ウィジェットから設定を行います。

テーマ固有の機能とプラグインの衝突

プラグインなしでも機能するよう各種設定が施されているテーマがあります。例えば、Facebook用のOPGをプラグインなしで出力できるなどの機能です。

テーマの表示や機能に影響を与えるプラグインもあります。テーマ変更後に何か不具合が発生した場合は、まずプラグインの利用を停止していくことをおすすめします。

まとめ

そもそもWebサイトとはどのような役割があるのでしょうか。私たちイノ・コードでは、「Webサイトとは、コンテンツを使ったコミュニケーションメディア」と位置付けてます。

ビジネス上のコミュニケーションゴールは、商品販売、サービス利用です。

ネットユーザーはコンテンツに触れることで、感情が変化し考えが定まっていきます。日常会話のようにダイレクトな感情交流を図ることは難しいですが、Webサイトのコンテンツ上であなたの世界観を表現することができます。

WordPressテーマの選び方で重要なことは、SEOに強いだけでなくコンテンツを通じて見込み客を増やしていく機能があることです。