バズログカテゴリ: ホームページ制作

WordPressで人気記事の一覧を表示させたい。

サイドバーやヘッダー下等に人気の記事を一覧で表示させているサイトをよく見かけます。

人気記事一覧をサイト上に表示させる事によって、サイトへ訪れたユーザーの滞在時間が伸びる傾向がありSEO的にも人気記事の設置はオススメです。

でもなんだか難しそうだな…。

サイト上に人気記事を一覧で表示させる方法は２つあります。

• プラグインを使う方法
• プラグインは使わない方法

プラグインを使えば、誰でも簡単に人気記事一覧をサイト上に表示させる事が可能です。

最も簡単に人気記事の一覧を表示させる方法から、プラグインを使わないで設置する方法まで詳しく紹介していきます。

1：【一番かんたん！】人気記事を一覧で表示させる方法

WordPressで人気記事を一覧で表示させる際に、最も簡単な方法はプラグインを使用する方法です。

プラグインの中でも「WordPress Popular Posts」を使用すれば、面倒な作業なく人気記事一覧を表示させる事ができます。

WordPress Popular Postsは、自身が設定した時間内のアクセス数を逐一解析して自動で人気記事をランキング形式で表示させる事が可能です。

今回はWordPress Popular Postsを使ってサイドバーに、人気記事一覧を表示させる方法を紹介します。

1-1：WordPress Popular Postsの使い方から設置完了までの手順

「WordPress Popular Posts」プラグインを使って、サイドバーへ人気記事一覧を表示させていきましょう。

(1) 「WordPress Popular Posts」検索・インストール➡️「有効化」

WordPress Popular Postsをプラグイン新規追加画面で検索し、インストール後に「有効化」して下さい。

(2) 外観➡️「ウィジェット」開く

プラグイン有効化後、外観からウィジェットを開きましょう。

 

(3) ウィジェットに「WordPress Popular Posts」が追加されている

ウィジェットに「WordPress Popular Posts」が追加されていない場合には、プラグインが有効化されているか確認しましょう。

(4) 「WordPress Popular Posts」をサイドバーの表示させたい箇所へドラッグ＆ドロップ

WordPress Popular Postsをマウスで掴んで、サイドバーの表示させたい箇所へ移動させましょう。

(5) サイドバーのウィジェットエリアに追加される「▼」をクリック

WordPress Popular Postsの横にある「▼」をクリックしてタブを開きます。

(6) WordPress Popular Postsの設定

• ① タイトル名を変更可能
• ② 人気記事で表示させる件数の変更可能
• ③ 表示順を選択可能
• ④ 計測期間を選択可能

• ⑤ 「メイン画像を設定を表示」を選ぶとアイキャッチ画像表示が可能

下のサイズ変更で、表示するアイキャッチ画像のサイズ感を調整できます。

上記の様に設定したら、「保存」をクリックし変更内容を保存しましょう。

プレビューで見てみると以下画像の様に表示されます。

以上で人気記事一覧を表示させる設定は完了です。

2：プラグインなしで表示させる方法

プラグインなしで人気記事の一覧を表示させたい。

プラグインはとても便利で簡単に使用する事が出来ます。

しかし先ほど紹介した「WordPress Popular Posts」プラグインは、アクセス解析ごとにデータベースとやり取りをしているので記事数が増えるとサイト自体が重くなくなってしまう可能性があるのです。

その様な状況を避けるには、自作で最新記事一覧を作成する必要があります。

今回は初めてでも出来る様に、分かりやすく解説していきましょう。

流れは以下の通りです。

• ① function.phpに追記する
• ② 表示させたいテンプレートにコードを追加する

上記の手順通りに方法を紹介します。function.phpやテンプレートを編集するので必ずバックアップを取る様にして下さい。

また、コピーペーストで出来る様にコードも全て紹介しましょう。

2-1：① function.phpに追記する

人気記事を一覧で表示する為に、まずはfunction.phpに関数を追加します。

以下コードをそのままfunction.phpに追加しましょう。

1. // function.phpに追記する //
2. function getPostViews($postID){
3.     $count_key = ‘post_views_count’;
4.     $count = get_post_meta($postID, $count_key, true);
5.     if($count==”){
6.         delete_post_meta($postID, $count_key);
7.         add_post_meta($postID, $count_key, ‘0’);
8.         return “0 View”;
9.     }
10.     return $count.‘ Views’;
11. }
12. function setPostViews($postID) {
13.     $count_key = ‘post_views_count’;
14.     $count = get_post_meta($postID, $count_key, true);
15.     if($count==”){
16.         $count = 0;
17.         delete_post_meta($postID, $count_key);
18.         add_post_meta($postID, $count_key, ‘0’);
19.     }else{
20.         $count++;
21.         update_post_meta($postID, $count_key, $count);
22.     }
23. }
24. remove_action( ‘wp_head’, ‘adjacent_posts_rel_link_wp_head’, 10, 0);

2-2：② 表示させたいテンプレートにコードを追加する

function.phpに表示する為のコードを追加したら、続いて表示させたい箇所へ以下コードを追加します。

今回はサイドバーへ表示させたかったので、sidebar.phpに追加済みです。

ここまで上記の手順でコードを追加していくと、以下画像の様に人気記事が一覧で表示されます。

3：人気記事を横並びで表示させる方法

人気記事を一覧で横並びに表示させたい。

ヘッダーすぐ下あたりに、人気記事が横並びで表示されているサイトをよく見かけますね。

自分のサイトもそんな風にカッコよくしたい！

紹介する方法で設定すれば、簡単にヘッダー下に人気記事一覧を横並びで表示する事が可能です。

使用するのは先ほど紹介したプラグイン「WordPress Popular Posts」です。

WordPress Popular Postsを有効化した状態で、２つのシートにコードを加えるだけで簡単に人気記事一覧をヘッダー下に表示させる事が出来ます。

手順は以下の通りです。

• ① WordPress Popular Postsを有効化
• ② index.phpにコードを加える
• ③ cssでデザインを整える

WordPress Popular Postsは事前に有効化しておきましょう。追加するコードについて紹介していきます。

3-1：index.phpにコードを追加する

WordPress Popular Postsのプラグインを有効化したら、index.phpにコードを追加します。

contentすぐ下部分に、以下コードを貼り付けてcontent部分に人気記事が一覧で表示される様に指定しましょう。

3-2：CSSでデザインを調整する

CSSでデザインを調整していきましょう。

今回実際に使用したCSSコードは以下になります。

幅やデザイン等は自由に調整してみて下さいね。

index.phpとCSSにコードを加えると下記画像の様に、ヘッダー下あたりに人気記事が表示されます。

ぜひ参考にしてみて下さい。

まとめ

WordPressで人気記事を一覧で表示させる方法について紹介してきました。

人気記事を一覧で表示するにはプラグインを使う事で簡単に表示させる事が可能です。

また横並びに表示させるのも、プラグインを使えば難しい作業はありません。

ぜひ参考にしてみて下さい。

WordPressで最新記事を一覧で表示させたい。

上記の様にお考えではありませんか？

多くのサイトでトップページに最新記事を表示させているのをよく見かけます。

サイトへ訪れたユーザーに、他のページも見てもらう事ができる可能性も広がるので便利な機能ですよね。

最新記事一覧を表示させる方法は2つあります。

• プラグインを使って表示させる
• プラグインを使わずに表示させる

２つの方法がありますが、圧倒的に簡単なのはプラグインを使う方法です。

HTMLやCSSが分からなくても、あっという間に最新記事を表示させる事が出来ます。

しかしプラグインを導入すると、サイト自体の動きが遅くなるというデメリットが生じてしまいますよね。

プラグインを使用したくないと考えている場合でも、簡単に最新記事を一覧で表示する事ができる様に今回は2つの方法について詳しく解説して行きましょう。

1：プラグインを使って表示させる２つの方法

できるだけ簡単に、最新記事一覧を表示させたい。

HTMLやCSSをいじらずに、できるだけ簡単に表示させる方法が知りたいとお考えではないでしょうか。

プラグインを使用すれば、HTMLやCSSが分からなくても簡単に最新記事を一覧で表示させる事が可能です。

最新記事を表示させるオススメのプラグインは2つあります。

• What’s New Generator
• Newpost Catch

２つのプラグインがありますが、大きく違う事はアイキャッチ画像を表示させられるかどうかです。

アイキャッチ画像を表示させたい場合には「New post Catch」がオススメです。

利用用途に応じて、使用するプラグインを選びましょう。

２つのプラグインの使用方法について解説します。

2：What’s New Generatorの使い方

What’s New Generatorは、設定しておけば「自動」で最新記事が投稿された事をサイト上に表示させることが可能です。

また、ショートコードが貼れる場所(トップページ・サイドバー・固定ページ・投稿ページ)であればどこでも最新記事一覧を表示させる事ができます。

マガジンサイトや、企業ホームページなどに使用したい場合に、What’s New Generatorはオススメなデザインです。

2-1：設定方法

さっそくWhat’s New Generatorの設定方法を紹介していきます。

What’s New Generatorを使う事で、上記画像の様な最新記事一覧をサイト上に表示させる事が可能です。

(1) 「What’s New Generator」と検索しインストール➡️「有効化」する

プラグイン追加画面で「What’s New Generator」と検索しインストール後、有効化して下さい。

(2) 設定➡️「What’s New 設定」クリック

プラグイン有効化後、設定の中に「What’s New 設定」が表示されます。

(3) What’s New Generatorの設定をする

最新記事一覧のタイトルや、表示件数・Newマークの表示有無を変更・選択し「変更を保存」をクリックします。

(4) ショートコードをコピー、表示箇所に貼り付ける

ショートコードをコピーして、最新記事一覧を表示させたい箇所に貼り付けて保存し完了です。

以上の設定だけで簡単に最新記事をサイト上に表示させる事ができます。ぜひ参考にしてみて下さい。

3：Newpost Catchの使い方

Newpost Catchは最新記事一覧をアイキャッチ画像付きで表示させる事が可能です。プログやメディアサイト等を運営している場合には、アイキャッチ画像付きで最新記事を一覧で表示させたい場合が多いでしょう。

そんな時には「Newpost Catch」のプラグインを使って簡単にサイドバーへ最新記事一覧を表示させるのがオススメです。

3-1：設定方法

Newpost Catchの設定方法を紹介します。

Newpost Catchを使って、上記画像の様にサイドバーへ最新記事を表示させます。上記画像は、何もカスタマイズされていない状態ですがCSSを追加する事で自由にデザインを加えることも可能です。

(1) 「Newpost Catch」を検索・インストール➡️「有効化」

Newpost Catchとプラグイン追加画面で検索しインストールした後、有効化して下さい。

有効化後、最新記事一覧をサイドバーで表示させる設定を「ウィジェット」にて行います。

(2) 外観➡️ウィジェット

(3) 「Newpost Catch」をサイドバー欄に「ドラッグ＆ドロップ」で追加

サイドバー部分に「Newpost Catch」をドラッグ＆ドロップで表示させたい箇所へ追加しましょう。すでにサイドバー部分に「最近の投稿」が入っている場合は削除します。

(4) サイドバーへ「Newpost Catch」が追加される

(5) 設定変更し保存する

• ① タイトル名は自由に変更可能です。
• ② アイキャッチ画像の表示サイズを変更できます。

上記の様に設定し変更を保存すると、以下画像の様にサイドバーへ最新記事が表示されます。

サムネイルのサイズ感や、日付の表示等、変更が可能です。

自分のサイトへ合う様に変更し表示させましょう。

4：プラグインを使わず表示させる方法

最新記事を一覧で表示させたいけれど、プラグインは使いたくないな…。

上記の様にお考えではないでしょうか？

プラグインを使用すればHTMLやCSSが分からなくても、簡単にサイト上で最新記事一覧を表示させる事が可能です。しかしプラグインを使用する事で、サイトが重くなり動作が遅くなる可能性があります。

今回はプラグインを使わなくても簡単に最新記事を一覧で表示させる方法を紹介していきましょう。

4-1：最新記事を一覧で表示させる

最新記事を一覧で表示させる方法を紹介していきます。

最新記事を表示させるには、簡単なget_postsを使って最新記事を表示させましょう。

最新記事一覧を表示させたい箇所に追加するだけで、表示させる事が可能です。

1. <?php
2. $args = array( ‘posts_per_page’ => 5, );  表示記事数
3. $postslist = get_posts( $args );
4. foreach ( $postslist as $post ) :  ループ開始
5.   setup_postdata( $post ); ?> 記事データの取得
6.     <div>
7.         <?php the_date(); ?> 日付
8.         <br />
9.         <?php the_title(); ?> タイトル
10.         <?php the_excerpt(); ?>
11.     </div>
12. <?php
13. endforeach; ループ終了
14. wp_reset_postdata(); 直前のクエリ復元
15. ?>

4-2：表示記事件数を変更する

最新記事一覧に表示する記事数を変更したい場合には、以下コード部分の数値を変更しましょう。

1. $args = array( ‘posts_per_page’ => 5,

まとめ

WordPressで最新記事一覧を表示させる方法を紹介してきました。

方法は大きく分けて２つあります。

• プラグインを使う方法
• プラグインを使わない方法

圧倒的に簡単な方法は、プラグインを使って表示させる方法です。

プラグインを使えば簡単に最新記事を一覧で表示させる事ができます。

ただしプラグインを使いたくない場合には、4章で紹介したコードを使ってサイト上に最新記事を表示させてみてはいかがでしょうか。ぜひ参考にしてみて下さい。

WordPressでサイトは構築したけれど、ブログの書き方が分からない！

上記に様にお悩みではありませんか？

WordPressでコンテンツを執筆した事がない方なら、分からないのは当然の事です。

私も初めの頃は「どうやって記事を投稿するの？」と分からない事だらけでした。

でも大丈夫です。１度覚えれば簡単にブログを書き始める事が出来ますよ！

今回はWordPressでブログを書く方法から、公開するまでの一連の流れを紹介していきましょう。

またブログ執筆時に重要な２つの装飾と、投稿後に取るべき2つの行動について紹介します。

1：WordPressブログの書き方！公開までの７つの手順

WordPressでブログを書きたいけれど、方法が分からない…。

悩んでいても仕方ありません！一緒に手順に沿ってWordPressを操作して書き方を覚えていきましょう。

流れは以下の通りです。

• ① 投稿→新規追加ページへアクセス
• ② タイトルとパーマリンクを入力
• ③ 本文を書く
• ④ カテゴリを選択
• ⑤ アイキャッチ画像を設定
• ⑥ メタタグを設定
• ⑦ 公開

上記７つの手順に沿ってWordPressでブログを書いていきます。

まずはWordPressにログインした状態にしておきましょう。

1-1：① 新規追加ページへアクセス

WordPressでブログを書き始めるには、新規ページへアクセスする必要があります。

以下の手順で新規ページへアクセスしましょう。

(1) 投稿の「新規追加」をクリック

(2) 「新規投稿を追加」画面にアクセス

新規投稿追加画面になります。

新規投稿追加画面でタイトルや本文を入力していきましょう。

1-2：② タイトルとパーマリンクを入力

続いて行うのは「タイトル」と「パーマリンク」の入力です。

(1) タイトル入力

画面上部の「ここにタイトルを入力」と書かれている項目に、タイトルを入力します。

タイトルは検索エンジンに表示される32文字以内が好ましいです。

タイトルの上手な作り方については、以下の記事で詳しく解説しています。

バズらせるなら32文字を意識！SEOのタイトル文字数と4つのコツ

(2) パーマリンク入力

タイトルを決めたら、その下のパーマリンクを英数字表記に変更しましょう。

パーマリンクについては下記の記事で詳しく解説しています。

WordPressでパーマリンクを正しく作る3つのポイントと設定方法

1-3：③ 本文を書く

タイトルとパーマリンクを入力したら、いよいよ本文を書いていきましょう。

赤枠で囲った部分が、本文を執筆する箇所です。

本文執筆時には”ビジュアル”とかかれている部分をクリックすると、簡単に本文を書き始める事が可能です。

WordPressには本文執筆画面が2つあります。

• ① ビジュアル (初心者向き：Word感覚で執筆する事ができる)
• ② テキスト (上級者向き：HTMLやCSSコード等を使って執筆する事ができる)

明らかにビジュアルで本文を執筆した方が、Word感覚で文字を入力する事ができて簡単です。

本文の文字数や書き方については、下記の記事で詳しく解説しています。

SEO対策で文字数の目安は3000字以上！意識すべき5つのポイント

本文を入力したら、カテゴリーを選択しましょう。

1-4：④ カテゴリを選択

カテゴリーを選択します。

画面右側にあるカテゴリーで、適切なカテゴリーにチェックを入れましょう。

適切なカテゴリーを未だ作成していない場合には、この投稿画面で新規カテゴリーを追加する事が可能です。

(1) 「+新規カテゴリーを追加」をクリック

カテゴリーの一覧下にある「+新規カテゴリーを追加」をクリックします。

(2) 適当なカテゴリー名を入力し「新規カテゴリーを追加」をクリック

既存のカテゴリーを選択するか、新規カテゴリーを作成しカテゴリーを選択し終えましょう。

カテゴリーを設定したら、次はアイキャッチ画像を設定していきます。

1-5：⑤ アイキャッチ画像を設定

アイキャッチ画像を設定していきましょう。

アイキャッチ画像は、目を惹く為の重要な画像です。

ブログへ誘導できる様に適切なアイキャッチ画像を設定しましょう。

(1) 画面下の「アイキャッチ画像を設定」クリック

アイキャッチ画像の設定は、画面下か右サイド下に設置されている可能性が高いです。

(2) 左上の「ファイルをアップロード」を開く

(3) 「ファイルを選択」クリック

(4) アイキャッチ画像に指定する画像を選んで「開く」クリック

(5) 指定する画像に「✔︎」が入っている事を確認し「アイキャッチ画像を設定」クリック

(6) アイキャッチ画像の設定が完了

1-6：⑥ メタタグを設定

アイキャッチ画像の設定後、メタタグを設定していきます。

画面下のメタダグを設定と書かれている項目をみてください。

この項目では①メタディスクリプションと②メタキーワードを入力していきます。一つずつ解説しましょう。

〈①メタディクリプション〉

メタディスクリプションは記事の要約を入力します。

検索エンジンに表示されるので80文字以内で簡潔に分かりやすく書きましょう。

〈②メタキーワード〉

メタキーワードは、対策キーワードをそのまま入力します。

１記事１キーワード入力する様にしましょう。

1-7：⑦ 公開

①〜⑥の手順でブログを書いたら、いよいよ公開します。

画面左上の”公開”と書かれているタブ部分の「公開」ボタンをクリックすると公開完了です。

また同じタブ内にある「下書きを保存」をクリックすれば、作成した本文や内容が保存されます。

「プレビュー」をクリックすれば公開時に、どの様に本文が表示されるのか確認する事が可能です。

2：ユーザービリティ向上に繋がる！本文執筆時の２つの装飾

WordPressでブログを書く際に、装飾が大事だという事を忘れないでください。

ズラズラと単調に文章を書かれていても、ユーザーは読む気が失せてしまいます。

ユーザーは出来るだけ本文を読みたくないのです。

そこで、装飾をうまく使う事で文章にリズムができて読んでもらいやすくなります。

WordPressのブログで使用すべき装飾は、主に２つです。

• 文字の装飾
• 見出し

文字装飾と見出しの話をする前に、何も装飾を施さずにズラズラと文章を書いた場合の記事をご覧ください。

上記画像の様にズラズラと書かれていては読む気が起きませんよね。

そこで重要になる2つのWordPressの装飾について紹介していきましょう。

2-1：文字の装飾

ブログを書く際に、文字の装飾を入れただけで大分印象が変わります。

これだけでも十分見やすくなったのでは無いでしょうか。

文字の装飾は「TinyMCS Advanced」というプラグインをインストールすれば、HTMLやCSSのコードを使わず簡単に色などの装飾をつける事が可能です。

(1) 文字を太くしたり

(2) 文字に色をつけたり

(3) 文字にマーカーを引いたり

上記以外にも様々な文字装飾を施す事で、文章が見やすくなります。

「TinyMCS Advanced」プラグインの使い方については下記記事の６章をご覧ください。

WordPressの投稿に表を作成する2つの方法とデザイン変更

2-2：見出し

WordPressで記事を書く際に、忘れてはいけないポイントが「見出し」です。

見出しタグを文章中に付ける事で、記事にリズムを付ける事が出来ます。

また、Googleの検索エンジンにも記事の内容を伝えやすくなるのです。

見出しタグについては下記の記事で詳しく解説しています。

使い方などもぜひ参考にしてみて下さい。

見出しタグの最適化はSEO効果が絶大！設定するときの8つの注意点

3：上位表示を狙え！ブログ投稿後に取るべき2つの行動

WordPressでブログを投稿したら、誰しも検索上位表示されたいと考えるはずです。

しかし立ち上げたばかりのホームページで検索上位表示を狙う事は、大変な事です。

上位表示されるには、そもそもWebページがインデックスされる必要があります。

インデックスされなければ、どんなに良質なコンテンツを配信しても検索上位表示される事は無いのです。

そこで、ブログやコンテンツを配信したらインデックスされる様にクローラーに促しましょう。

インデックスされる様に促すには２つ事を実施します。

• Fetch as Googleを使う
• SNSをアップする

上記２つの事を実施すれば、インデックスを促す事ができて早くクローラーにコンテンツを見つけてもらう事が可能です。詳しく紹介していきます。

3-1：Fetch as Googleを使う

リンク数等が少ない新規サイトの場合、クローラが回遊してくるまでに時間がかかります。

そんな時にはGoogle Search Consoleの一部機能「Fetch as Google」を使う事で、インデックスを促進させる事が可能です。コンテンツを公開したら、まずはインデックスをFetch as Googleで促しましょう。

Fetch as Googleの使い方については、下記の記事で詳しく解説しています。

基本中のキホン！Fetch as Googleの2つの使い方を徹底解説

3-2：SNSをアップする

コンテンツを配信したらSNSにもコンテンツをアップする様にしましょう。

SNSとSEOには直接的な効果は発揮しません。

ただし、SNSで拡散されコンテンツ訪問者数が増えれば自然なリンクが増えやすくなるのです。リンク数が増えると、自動的にインデックスされやすくなります。

コンテンツ投稿後には、SNSへの投稿も忘れない様にしましょう。

まとめ

WordPressのブログの書き方について詳しく紹介してきました。

WordPressでは、新規投稿の追加画面からWord感覚で気軽にブログを書く事ができます。

また文字に色を付けたり見出しを付ける事で、より読みやすいブログを書く事が可能です。

ぜひ参考にしてみて下さい。

パーマリンクって何？どの様に設定するのが一番良いの？

パーマリンクとはインターネットのWEBページごとに作られる個別のページURLの事です。

WordPressでもパーマリンクが設定されています。パーマリンクはコンテンツを配信する上で重要な箇所です。

デフォルトの設定ではなく、Googleが推奨する”シンプルで分かりやすいパーマリンク”にできるだけ早い初期段階で変更する必要があります。

今回は理想とするパーマリンクの作り方から設定方法まで詳しく解説していきます。

1：パーマリンクとは

パーマリンクとは、ブログの個々の投稿、カテゴリーなどの投稿一覧ページへの恒久的（半永久的）な URL です。パーマリンクは、他のブロガーがあなたの投稿やセクションにリンクを張るときや、投稿へのリンクを Eメールで送ったりするときに使います。個別の投稿への URL は常に存在して決して変らないようにすべきです。そういう訳で、「perma」リンクといいます。

引用元：パーマリンクの使い方-WordPress Codex 日本語版

パーマリンクって何？そんなに重要な事なの？

まずはパーマリンクについて分かりやすく解釈できる様に説明しましょう。

パーマリンクとはWEBページごとに設定されるURLです。

上記画像のURLだと赤枠で囲った「/buzzlog/wordpress-header-image/」この部分がパーマリンクになります。この部分はWordPressデフォルトの設定のままだと以下の様に表示されます。

「http://example.com/?p=123」

?p=123だと何に関してのページなのか理解出来ないですよね。

WEBページを運営する際には、パーマリンクをGoogleが推奨するパーマリンク設定に変更する必要があります。また設定は初期段階で行うことが理想的です。

2：理想的なパーマリンクを作る3つのポイント

WordPressデフォルトのパーマリンク設定のままでは理想的なパーマリンクとは言えません。

理想的なパーマリンクにする為に、設定を変更する必要があるのです。

Googleが推奨する理想的なパーマリンクは以下の通りです。

サイトの URL 構造はできる限りシンプルにします。論理的かつ人間が理解できる方法で（可能な場合は ID ではなく意味のある単語を使用して）URL を構成できるよう、コンテンツを分類します。

引用元：シンプルなURL構造を維持する-Google Support

• シンプルで分かりやすく
• 日本語は使わない
• ハイフン( – )を使う

上記３つのポイントを含めてパーマリンクを作成すると以下の様な理想的なパーマリンクになります。

「http://example.com/blue-flower」

シンプルかつ簡潔に表されており、パッと見て何について書かれているコンテンツか理解する事が可能です。

上記の様なパーマリンクにすべき3つのポイントについて詳しく解説していきます。

2-1：シンプルで分かりやすく

パーマリンクを作成する上で最も大切な事は「シンプルで人間が理解できる分かりやすいURL」です。

パーマリンクをパッと見て何について書かれているコンテンツなのかを理解できる様にする必要があります。

例えばWordPressデフォルトのパーマリンク設定だと、コンテンツを配信した時に以下の様にURLが表示されるのです。

「http://example.com/?p=123」

あなたはパッと見て、このURLが何のコンテンツを配信しているのか理解できますか？

理解できませんよね。「青い花」について書いているコンテンツを配信した時にパーマリンクを設定するとしたら、以下の様に分かりやすく表す必要があるのです。

「http://example.com/blue-flower」

上記のURLであれば、パーマリンクを見ただけで「青い花」について書いているコンテンツだと理解する事ができます。

2-2：日本語は使わない

パーマリンクを設定する際に、日本語は使わない事が重要です。

「http://example.com/おはよう」

様々なWEBページを見ていると、上記URLの様にパーマリンクが日本語で表示されている事があります。

日本人の私たちから見ると、理解しやすいURLですがパーマリンクを日本語で表示させる事はやめましょう。

なぜ日本語で表示させてはいけないのか2つの理由があります。

• 理由１：404エラーになる可能性があるから
• 理由２：エンコードされた時にURLが長くなるから

WordPressのバージョンによっては、日本語のパーマリンクだと検出されずに404エラーになってしまう可能性があるのです。また外部ブックマーク時やトラックバックの際にも404エラーが起こる可能性があります。

さらに、エンコードされた際にURLが長くなる可能性もあるのです。

以下の様なURLを見た事はありませんか？

「http://example.com/%82%a8%82%cd%82%e6%82%a4」

上記URLは「http://example.com/おはよう」をエンコードした場合のURLです。

日本語でパーマリンクを作成してしまうと、上記の様にURLが長く理解できない表記に変わってしまったり404エラーになってしまったりする可能性があるのでオススメしません。

2-3：ハイフンを使う

パーマリンクの作成時には、区切り記号を使うと有効的です。

「http://example.com/blueflower」よりもハイフン( – )を使って「http://example.com/blue-flower」の様に、単語ごとに区切る事によって更に分かりやすく表す事ができます。

区切り記号はアンダーバー( _ )ではなくハイフン( – )を使う様にしましょう。

3：パーマリンクは初期段階で設定した方が良い4つの理由

パーマリンクの設定をまだデフォルトのまま使用しているアナタ！

今すぐ設定を見直しましょう。

理想的なパーマリンクに設定するタイミングは出来るだけ早い初期段階で行うべきです。

なぜ初期段階で設定すべきなのか4つの理由があります。

• 理由1：SEO効果がリセットされるから
• 理由2：SNSシェア回数がリセットされるから
• 理由3：リダイレクト設定の手間がかかるから
• 理由4：リンク切れが発生してしまうから

パーマリンクの設定を途中で変更するという事は、いままで使用していたURLから変更になるという事です。

パーマリンクを初期段階で設定すべき4つの理由について詳しく紹介します。

3-1：理由1：SEO効果がリセットされるから

パーマリンクを変更するとSEO効果もリセットされてしまう事をご存知ですか？

Google等の検索エンジンでのインデックスはパーマリンク単位で行われます。

パーマリンクを途中で変更してしまうと今まで積み上げてきた評価がリセットされてしまうのです。

3-2：理由2：SNSシェア回数がリセットされるから

FacebookやTwitter等のSNSで自身のコンテンツがシェアされる事があります。

とても嬉しい事ですが、パーマリンクを変更するとシェア回数がリセットされてしまうのです。

SNSでのシェアは、パーマリンクでシェアをしています。

その為、パーマリンクを変えると全てリセットされてしまうのです。

3-3：理由3：リダイレクト設定の手間がかかるから

パーマリンク設定を途中で変更した場合、古いパーマリンクから新しいパーマリンクへリダイレクト処理を行う必要があります。リダイレクト処理をしておけば404エラーが起こる事もなく自動的に新しいパーマリンクのページへ飛ばす事が可能です。記事数が多いと、その分リダイレクト処理を行う手間が増えます。

面倒な作業が増えてしまうので、パーマリンクは初期段階での設定がオススメです。

3-4：理由4：リンク切れが発生してしまうから

パーマリンクを途中で変更すると、リンク切れの発生が考えられます。

他のWEBサイトで、あなたのリンクが貼られていたとしましょう。

パーマリンクを変更すると、そのリンクが無効になってしまうのです。

自分のサイトであればリンクを貼りなおす事ができますが、他のサイトのリンクを修正してもらう事はまず難しいでしょう。そうなると、今まで貼られていたリンクが全て無効化されてしまいSEO評価も下がってしまいます。リンク数はSEO評価に直結しているので、それが全て無効化されてしまうとなると大ダメージです。

4：正しいパーマリンク設定の仕方

パーマリンクを正しい表示にする為に、WordPressで設定をし直しましょう。

「http://トップレベルドメイン/カテゴリー名/投稿名」

上記の順に正しく表示する様に設定していきます。

設定前のデフォルトの状態だと、コンテンツを投稿すると以下のパーマリンクになっています。

デフォルト状態だと何のページなのか分からないので、以下の手順で設定していきましょう。

• 手順1：カテゴリー名を英語表記に設定
• 手順2：パーマリンク設定
• 手順3：投稿時の設定方法

4-1：カテゴリー名を英語表記に設定

パーマリンクにカテゴリー名を含める場合、デフォルトの状態だと日本語表記になっている事が考えられます。カテゴリー名も英語表記に変更する必要があるので、変更していきましょう。

(1) 投稿→「カテゴリー」クリック

(2) カテゴリー名「編集」クリック

カテゴリーに設定している一覧が表示されます。編集をクリックしましょう。

(3) パーマリンク部分を英語表記に変更

スラッグと呼ばれるパーマリンクの項目を英語表記に変更します。

ここで入力したカテゴリー名がパーマリンクに表示されるのです。

変更後、「更新」を押して変更内容を保存します。

4-2：パーマリンク設定

パーマリンクの設定をデフォルト状態から変更していきましょう。

(1) 設定→「パーマリンク設定」クリック

(2) カスタム構造にチェックを入れる

カスタム構造にチェックをいれて「%category%」と「%postname%」をタグから選び選択しましょう。

%category%と%postname%を選択したら変更を保存しましょう。

この設定を行えば、投稿時にカテゴリー名と投稿名が自動的に入ります。

ただし投稿名は日本語表記のままなので、投稿時に自分で英語表記に変更しましょう。

4-3：投稿時の設定方法

パーマリンクの設定をしたら、パーマリンクにはカテゴリーと投稿名が入る様になります。投稿名(postname)は日本語表記のままなので、投稿時に自分で英数字表記に変更しましょう。

(1) パーマリンクの「編集」クリック

(2) 投稿名を英語表記に変更し「OK」クリック

(3) 設定完了

設定は以上で完了です。

デフォルトのパーマリンクの時とは違い、「カテゴリー1」に入っている「パーマリンクの方法」を紹介しているページなのだと、すぐ理解できるパーマリンクになりましたね。

人間が理解しやすい簡潔なパーマリンクへ設定してみましょう。

まとめ

「パーマリンク」について詳しく解説してきました。

パーマリンクは、出来るだけ短く人間が理解できる言葉で構築する必要があります。

SEO効果にも大きく左右するパーマリンクですので、初期の段階で設定する様にしましょう。

ぜひ参考にしてみてください。

WordPressに目次を表示させたい。

上記の様にお考えではないでしょうか？

WordPressに目次を設置する事でコンテンツ内容が一目で分かる様になり、ユーザーへの利便性が向上するのです。また目次を設置する事によってSEO効果も期待出来るので、WordPressでコンテンツを配信する際には目次の設置をオススメします。

今回はプラグインを使って簡単に目次を設置する方法と、カスタマイズする方法について詳しく解説していきましょう。

1：プラグインを使って目次を作成する方法

WordPressで目次を設置する際に、１から全て自分で目次を作成するのは大変な作業です。

しかしプラグインを使用すれば、10分程度で初心者でも簡単に目次を設置する事が出来ます。

今回は多くの人が利用し高い評価を受けているプラグイン「Table of Contents Plus」を使用して目次を設置する方法を解説していきましょう。

1-1：目次の設置手順

プラグインを使って上記画像の様な目次を作成していきます。

WordPress管理画面にてプラグイン「Table of Contents Plus」をインストールして有効化してください。

プラグインをインストールする方法については下記の記事で詳しく解説しています。

WordPressのプラグインをインストールする方法と出来ない4つの原因

プラグインを有効化したら、以下の手順で目次を設置していきましょう。

(1) 設定から「TOC+」を選びクリック

設定の中に有効化したプラグイン「TOC+」が追加されています。

(2) 目次の設定を行う

Table of Contents Plusの設定画面になります。

以下の通りに設定してみましょう。

• ① 「最初の見出しの前(デフォルト)」を選択
• ②  表示条件は「4」を選択（それ以下だと目次が表示されない可能性有）
• ③ コンテンツタイプを選択 (post/page)
• ④ 見出しテキストは、目次の上にくるタイトル名(好きなタイトルに変更可)

ここまで変更したら画面下へスクロールし、「上級者向け(表示)」をクリックしましょう。

目次のデザインはプレゼンテーションの項目で選択が可能です。

(3) ⑤ 見出しレベルのチェックを外す

見出しレベルの項目で見出しタグをどこまで目次に表示させるか設定出来ます。

細かく区切りすぎると目次が見づらくなるので、h4までがオススメです。

(4) 「設定を更新」をクリックして変更内容を保存する

上記の様に設定したらコンテンツに目次が設置されます。

以上がプラグインを使った目次の設置方法です。

簡単に設置する事が出来るので、ぜひ試してみて下さい。

2：作成した目次をカスタマイズしてみよう

作成した目次をカスタマイズしたいけど、方法が分からないな。

上記の様にカスタマイズをお考えではないでしょうか？

目次の土台はプラグインで簡単に作成する事ができましたね。

カスタマイズのCSSを追加するだけで、下記画像の様に色やフォント・形まで変更する事が可能です。

CSSにコピーペーストで簡単にカスタマイズする方法を紹介していきます。

また、上記3つの目次を使用する際のコードも紹介しましょう。

2-1：目次のカスタマイズ手順

目次のカスタマイズ手順を紹介します。

目次のカスタマイズはCSSにコードを追加するだけで簡単に目次をカスタマイズする事が可能です。

(1) 外観→「テーマの編集」

(2) テーマ編集画面上の「CSSエディター」をクリック

(3) 追加CSSをクリック

(4) 追加CSSにコードを貼り付けて保存

追加CSS部分に下記の様なコードを貼り付けます。

貼り付けたら変更を画面左の「公開」をクリックして保存します。

すると、目次のデザインがピンク色の目次にカスタマイズ完了です。

2-1-2：シンプル目次のコード

上記「シンプルな目次」を表示させるコードです。

2-1-3：水色目次のコード

上記「水色の目次」を表示させるコードです。

2-2：色のカスタマイズ方法

目次の色や形をカスタマイズするには、コード一番上の部分を書き換えれば簡単にカスタマイズする事が可能です。

カラーコードは下記サイトにて取得出来ますので、ぜひ試してみて下さい。

WEB色見本 原色大辞典 – HTMLカラーコード

3：目次のフォントを変更する方法

目次の色は変える事が出来たけれど、フォントが合っていない…。

そんなミスマッチな目次は嫌ですよね。

もちろん目次のフォントも変更する事が出来ます。

ただし、header.phpを変更する必要があるので必ずバックアップを取る様にしましょう。

初心者にも分かる様に解説していきます。手順は以下の通りです。

• ① Google Fontでフォントを選ぶ
• ② header.phpのhead内にコードを追記する
• ③ CSSにコードを追記する

上記の手順に沿って詳しく紹介していきます。

3-1：フォントカスタマイズ手順

目次のフォントを変更する方法を紹介します。

目次のタイトルを上記画像の様に変更していきます。

(1) Google Fontでフォントを選ぶ

まずはGoogle Fontで使用するフォントを選びましょう。

Google Font

(2) 使用するフォント右上の「+」をクリック

(3) 画面右下に現れるタブをクリックして開く

(4) 「@IMPORT」をクリック

(5) <style></style>で囲まれているコードを全てコピー

(6) header.phpにコードを追記する

Google Fontでコピーしたコードをheader.phpに追記しましょう。

(7) WordPress管理画面 外観→「テーマの編集」

(8) テーマヘッダー(header.php)

header.phpを開きます。

head内に先ほどGoogleフォントでコピーしたコードを追加します。

以下の箇所に貼り付けましょう。

上記箇所に貼り付けたら変更を保存します。

ここまで完了したら、Google Fontで先ほどコピーしたコードの下のコードをコピーしましょう。

(9) Googleフォントで2つ目のコードをコピーする

コピーしたら、CSSに追記します。

(10) 目次タイトルのフォント部分を入れ替える

目次タイトルのフォントが書かれている下記の部分を、コピーしたフォントコードに書き換えます。

上記の箇所を入れ替えれば、目次タイトルのフォント変更は完了です。

まとめ

WordPressの目次について詳しく紹介してきました。

目次はSEO効果も期待できるので、コンテンツを配信する際には表示させるべきです。

プラグインを使用すれば簡単に設置する事が出来ます。

また目次の色などを変更したい場合には、#toc_containerの部分を書き換えれば簡単にカスタマイズする事も可能です。ぜひ参考にしてみて下さい。

WordPressの見出しデザインを変更したいけれど、方法が分からないな…。

上記の様にお悩みではありませんか？

HTMLやCSSがよく分からないという方はどの様に変更するのか難しくて分からないですよね。

しかし見出しタグのデザインは、２つのプラグインを使えば初心者でも簡単に変更する事が出来ます。

今回は見出しタグのデザインをカスタマイズする方法から、見出しタグが参考になるサイトまで詳しく紹介していきましょう。

1：見出しタグをカスタマイズする全工程を3ステップで紹介

見出しタグのデザインをカスタマイズしたいけれど、方法が分からない…。

見出しタグとは<h1></h1>といったHTMLタグで作成するもので、検索エンジンやユーザーに向けて重要な役割を果たします。そんな見出しタグのデザインを変更するには、HTMLやCSSの知識が必須です。

しかし「そんなの分からないよ！面倒だよ！」というアナタの為に、2つのプラグインを使って簡単に見出しタグのデザインをカスタマイズする方法を紹介します。

見出しタグのデザインを変更する工程は3ステップです。

• Step1：2つのプラグインを有効化
• Step2：AddQuicktagでタグを追加
• Step3：Simple Custom CSSでhtmlを追加

上記３つのステップを踏みながら、見出しタグのデザインを変更していきましょう。

1-1：Step1：2つのプラグインを有効化

見出しタグのデザインをカスタマイズする為に2つのプラグインをインストールして有効化しておきましょう。

• AddQuicktag
• Simple Custom CSS

タグを簡単に追加する為のプラグインと、カスタムCSSを容易に追記するプラグインです。

プラグインのインストール方法については下記記事にて詳しく解説しています。

WordPressのプラグインをインストールする方法と出来ない4つの原因

1-2：Step2：AddQuicktagでタグを追加

プラグイン有効化後、AddQuicktagにて見出しタグのタグを追加します。

(1) 設定から”AddQuicktag”を選択する

(2) タグの追加画面になる

(3) ３つの項目を埋める

• ボタンのラベル・ラベル名にはタグの名前を入力・・・h1やh2など
• 開始タグと終了タグを入力・・・見出しタグh2であれば<h2></h2>
• 一番右の□にチェックを入れる

上記３つの項目を埋めたら、一番下の”変更を保存”を選択します。

h1やh3等の見出しタグを追加したければ同じ様に追加していきましょう。

見出しタグのタグを追加したら、AddQuicktagで行う設定は以上です。

1-3の章へ進みましょう。

1-3：Step3：Simple Custom CSSでhtmlを追加

有効化したプラグイン”Simple Custom CSS”で見出しタグデザインのコードをカスタムCSSで追加していきます。事前に見出しタグデザインに指定したいデザインのコードを取得しておきましょう。

今回は、h1タグを下記画像のデザインに設定していきます。

上記の見出しタグデザインのコードを以下コードを使用します。

h1 {
padding: 0.4em 0.5em;
color: #494949;
background: #f4f4f4;
border-left: solid 5px #7db4e6;
border-bottom: solid 3px #d7d7d7;
}

コードが準備できたら、早速カスタムCSSへ追加していきます。

(1) 外観から”カスタムCSS”を選択する

(2) コードを入力し”カスタムCSSの更新”をクリック

h1 {
ここにコードを貼り付ける
}
h1・h2・h3に指定したい見出しタグデザインのコードを以下の様に貼り付けて更新しましょう。

カスタムCSSでデザインコードを追加したら、見出しデザインの設定は完了です。

投稿画面での見出しタグの使い方を紹介します。

① 見出しにするタイトルを選択して「Quicktags」の中から使用する見出しタグを選びましょう。

たったこれだけで見出しタグのデザインカスタマイズは完了です。

プレビューで見てみるとカスタマイズしたデザインに切り替わっています。

以上が見出しタグのデザインを変更する方法です。

3：見出しタグデザインが参考になるサイト

見出しタグのデザインを決めたいけれど、よく分からないな…。

CSSの知識が無いと見出しタグのデザインコードなんて作成できませんよね。

そんなアナタでも大丈夫！見出しタグのデザインコードが取得できるとても親切なサイトを紹介します。

コピーペーストでコードを取得できる様になっていて、そのままカスタムCSSへ貼り付ければ初心者でも簡単にオシャレな見出しタグデザインに変更する事が可能です。そんな親切なサイトは「サルワカ」です。

68個の見出しタグデザインのコードを紹介しているので、きっと気にいるデザインがありますよ。

ぜひチェックしてみて下さい。

CSSのコピペだけ！おしゃれな見出しのデザイン例まとめ68選

4：見出しタグはなぜ重要？２つの理由を紹介

多くのサイトで見出しタグの重要性について語ってるけれど、何がそんなに重要なの？

上記の様に見出しタグの重要性に気づいていないのではありませんか。

見出しタグのデザインをカッコよくする事も重要ですが、見出しタグを設定する本来の重要性が2つあります。

• ユーザービリティの向上
• Google検索エンジンに認識させる

4-1：見出しタグ2つの重要性

見出しタグを設定する事で、ユーザーが記事を読みやすくなる傾向があります。淡々と何も強弱がない文章よりも、見出しタグでリズムを付けることによってコンテンツが読みやすくなります。

コンテンツが読みやすくなると最後まで読んでもらえる可能性が上がり、ユーザービリティの向上へ繋がるのです。更に、見出しタグはGoogleの検索エンジンにも影響を与えます。

見出しタグ<h1></h1>をきちんと付ける事によって、検索エンジンにも伝えやすくなります。

正しく見出しタグを使用してSEO効果に繋げる事ができるのです。

もっと見出しタグについて知りたい場合には、下記の記事をご覧下さい。

見出しタグの最適化はSEO効果が絶大！設定するときの8つの注意点

まとめ

見出しタグのデザインについて詳しく紹介してきました。

見出しタグのデザイン変更は、2つのプラグインを使う事でHTMLやCSSが分からなくても簡単にカスタマイズする事が可能です。

さらに見出しタグはSEO効果も発揮する重要な役割があります。

サイトデザインに合った見出しタグにカスタマイズして使用していきましょう。

フッターのデザインをカッコよく変更したいな〜

フッターはサイトの最下部にありますが、最後までサイトを見てくれたユーザーに向けてナビゲーションサイトマップとして活用する事の出来る重要な箇所です。

そんなフッターのデザインを編集する事によって、ブランドイメージの訴求やサイト内デザインの統一性を出す事が出来ます。今回はフッターデザインについて詳しく解説していきましょう。

またフッターのカスタマイズはSEO対策にはならない理由についても解説します。

1：フッターのデザインが素晴らしいサイト9選

フッターデザインを変更したいけれど、どんなデザインが良いのかイメージが湧かないな…。

今回はフッターデザインが素晴らしい9サイトを紹介します。

• オールイン株式会社
• 株式会社リブセンス
• ふじ交通有限会社
• ぽっぽさんの写真館
• 株式会社アパレルウェブ
• 茶舗木陰
• Family Mart
• 株式会社 東亜不動産
• おかもと歯科医院

フッターはサイトのナビゲーションの役目を果たす重要な部分です。

どんなサイトなのかフッターを見ただけですぐに理解する事が出来ます。どんなデザインにするか思いつきで決めるのではなく、サイトのデザインやブランドイメージに沿ったフッターデザインにすると良いでしょう。

ぜひ参考にしてみて下さい。

1-1：オールイン株式会社

オールイン株式会社は求人広告代理サービスや採用コンサルティング、採用クリエイティブ支援サービスを提供している会社です。サイト自体とてもカッコイイ赤と黒のデザインで統一されており、フッター部分も黒と白文字のシンプルかつオシャレなデザインになっています。

オールイン株式会社サイトURL

1-2：株式会社リブセンス

株式会社リブセンスはインターネットメディア運営会社です。

サイト自体が青色のデザインで構成されており、フッター部分もサイトデザインに合っていて統一性が感じられます。またフッターの一番下部分は、じわじわと色が出て文字が浮かび上がる仕組みになっていて面白いです。

株式会社リブセンスサイトURL

1-3：ふじ交通有限会社

ふじ交通有限会社は足立区にあるタクシー会社です。

ふじ交通有限会社のサイトフッターには写真が適用されています。

会社の事業内容であるタクシーの写真を載せる事で、企業イメージが浮かびやすくなります。

フッターに写真を起用するのも良いデザインの一つですね。

ふじ交通有限会社サイトURL

1-4：ぽっぽさんの写真館

ぽっぽさんの写真館は、西日本旅客鉄道株式会社が保有する車両や駅等の写真を収録された写真のデータ集を提供しています。

ぽっぽさんの写真館のサイトで適用されているフッターは、メイン画面とフッターとの境目がない様に見せるデザインです。サイト内容の電車が描かれており、見事にサイトイメージを表しているフッターだなと感じます。

ぽっぽさんの写真館サイトURL

1-5：株式会社アパレルウェブ

株式会社アパレルウェブはソリューション事業・プラットフォーム事業・海外事業等を手がける会社です。

フッター部分はうまくカテゴリー分けされていて見やすい構成になっています。フッター上部には各支店情報を載せており、下部にはサイトマップを載せているのです。また支店情報にはGoogleMapのリンクが貼られていて、支店場所をすぐに確認する事ができる親切心が感じられます。

株式会社アパレルウェブサイトURL

1-6：茶舗木陰

茶舗木陰は、兵庫県伊丹市にある日本茶屋さんのホームページです。

サイト自体が「和」な雰囲気で構成されていて、フッター部分も「和」のイメージに沿ったデザインとなっています。店舗情報他の情報は、きちんとカテゴリー分けされておりナビゲーションの役目を果たしているフッターです。

茶舗木陰サイトURL

1-7：Family Mart

コンビニエンスストア、Family Martのフッターを紹介します。

大手企業のコンビニエンスストアになれば、沢山の商品とキャンペーン情報・企業情報からポイントまで沢山の情報がサイト内で提供されているはずです。

Family Martのフッターでは、沢山の情報がシンプルかつ分かりやすくカテゴリー分けされています。かなり沢山の情報がフッター部分に入っていますが、シンプルに表示されているのでフッターを見れば探している情報にたどり着く事は間違いないでしょう。

Family MartサイトURL

1-8：株式会社東亜不動産

東亜不動産は熊本市と熊本市近郊の不動産を取り扱っている会社です。

東亜不動産のフッター部分は、ユーザーの目的ごとにカテゴリー分けされています。

「買いたい・売りたい・借りたい」の目的別に分けられており、サイトナビゲーションの役割を見事にはたしています。不動産屋さんのサイトを利用するユーザーの目的を達成する為に考えられて作られた素晴らしいフッターデザインです。

株式会社東亜不動産サイトURL

1-9：おかもと歯科医院

おかもと歯科医院は大阪府吹田市にある歯医者さんです。

おかもと歯科医院のフッターは、住所・電話番号・営業時間・マップの記載があります。

また、フッター部分にはネット予約ページへのリンクも貼られているので来診への誘導に繋がっていますね。

歯医者さんのホームページを利用するユーザーのニーズをよく考えられたデザインです。

おかもと歯科医院サイトURL

2：フッターのデザインの編集方法

フッターデザインの編集方法が知りたい！

フッターデザインの編集はWordPress管理画面の”ウィジェット”からドラッグ&ドロップで簡単に行う事ができます。

(1) 外観から「ウィジェット」を選択

(2) ウィジェットで機能を追加し編集

上記のウィジェット画面でフッターのデザインを編集する事が可能です。オレンジ色で囲った部分で機能を選んで、赤枠で囲った部分のフッターにドラッグ＆ドロップで機能を追加・編集する事が出来ます。

フッターにメニューを追加する方法については、下記の記事をご覧下さい。

初心者の為のWordPressでフッターメニューの作成と追加する2つの方法

3：フッターのカスタマイズはSEO対策にはならない理由

フッターをカスタマイズすればSEO対策になる？

上記の様に考えてフッターをカスタマイズするのであれば、その考えは間違っています。

以前まではフッター部分に上位表示を狙いたいキーワードやリンクをたくさん付ける事でSEO対策になると考えられていました。

しかし現在ではフッター部分のリンクはコンテンツとGoogleからみなされないのでSEO対策には全くならないのです。フッター部分にリンクを沢山付ける事よりも、良いコンテンツを増やして検索上位表示を狙う方が懸命で正しい判断と言えます。

まとめ

WordPressのフッターデザインについて紹介してきました。

フッターデザインは、サイトを最後まで見てくれたユーザーに重要な部分を知らせるナビゲーションの役割を果たします。サイト・ブランドイメージに沿ったデザインにする事によって、どの様なサイトか表す事も可能です。また、カテゴリー毎にきちんと分ける事によりユーザーが探している情報を見つけ易くする手助けを行う事も出来ます。

「一番下の部分だから適当でいいや…」ではなく、”ユーザーに伝えるべき事を記載する”重要な箇所である事を忘れずにフッターデザインを編集してみてはいかがでしょうか。

ぜひ参考にしてみて下さい。