前回の記事で、
ここまでの流れを書きました。
これでブログを始められますが、記事を書く前に見た目をもう少し整えたい!という方もいると思います。
今回は、「固定ペ―ジ」の作り方、メニューやウィジェットの設定方法を解説します♪
最初にやっておこう!パーマリンクの設定
記事を書く前に、やって欲しい作業があります。「パーマリンク」の設定です。
パーマリンクとは

パーマリンクってなに…?
ページの個別のURLであり、(基本的に)ずっと変わらないURLです。
当サイトのURLは、https://www.akaeho.net
この記事のURLは、https://www.akaeho.net/wp-page-menu-widget/
「wp-page-menu-widget」の部分が、「パーマリンク」です!簡単だね!^^
(基本的に)とカッコ書きにしたのは、別に変えようと思えば変えられるから。
でも、後から変えると大変。1ページごとに自動転送(301リダイレクト)の設定が必要になります。うまく行かないと、検索エンジンの評価が下がることもあります。
パーマリンクを投稿名に設定する
ワードプレスのパーマリンクは、「日付と投稿名」が初期設定になっています。
URLの構造は「西暦/月/日/タイトル/」。
設定→パーマリンク設定で、「投稿名」を選択→変更を保存をクリックします。

投稿画面でパーマリンクを編集する
「投稿名」に設定すると、タイトル欄に入れた文字列が、そのままURLになります。

日本語もそのままURLになります。が、アルファベットで入力し直す方がいいです。
というのも
https://www.akaeho.net/%E5%BD%93%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6/
↑これ、何か分かりますか?
実は、このURLと同じなんです↓
https://www.akaeho.net/当サイトについて/
日本語をURLに含めること自体はOK。
でも、例えばTwitterなどで記事をシェアすると、URLとして表示されるのは、英数記号に変換された文字列となってしまうんです(「エンコード」といいます)。
ちょっと見づらいですよね(^-^;
なので、最初からアルファベットに直しておきましょう。


「編集」→アルファベットで入力→「OK」で、パーマリンクを変更できます。
グーテンベルクエディタ(今現在のエディタ)の場合は右側の「URLスラッグ」からでも変更可能です。
固定ページの作り方

固定ページってなに?
投稿と何が違うの?
固定ページとは
以下のようなページのこと。パーマリンク用の英語も付けておきます。ご参考にどうぞ♪
- ホーム(home)
- 当サイトについて(about)
- プロフィール(profile)
- お問い合わせ(contact)
- よくあるご質問(faq)
- サイトマップ(sitemap)
- プライバシーポリシー(privacy-policy)
- ご利用規約(terms)
これらの中から必要なページを作ればOK。
記事を書くのが「投稿」、サイト運営上必要なページは「固定ページ」で作る、と覚えておけば、とりあえず大丈夫。
ホーム(フロントページ)を作る場合
「あかえほ」ではホーム(フロントページ)を作っています。
デフォルトの状態では、新着記事一覧がトップページになります。ホームを作るかどうかはお好みでOK。ただし、作る場合はちょっと設定が必要です。
まず、固定ページ→新規作成で、あなたのブログのトップページを自由に作りましょう!
パーマリンクは「home」にします。

こまめに「下書きとして保存」を。完成したら公開をクリック。
「https://あなたの独自ドメイン/home/」というURLのページができました。
このままだと、「home」というパーマリンクが無いと、“ホーム”にたどり着けません。
そこで、「home」を“ホーム”(フロントページ)であるとワードプレスに認識させます。

設定→表示設定で、「ホームページの表示」→「固定ページ」を選択
ホームページ:「ホーム」を選択
※自分がつけた固定ページのタイトルが、ここに表示されます。
下にスクロール→変更を保存
これで、独自ドメインにアクセスすると“ホーム”(フロントページ)が表示されるようになりました!

Cocoonをお使いの方へ
- ホーム(フロントページ)のSNSボタンは消したい!
- でもホーム以外のページには付けたい!
という方は、以下のコードを「カスタムCSS」にコピペし、更新してください。
.sns-share, .sns-follow{display:none;}
「ホーム」というタイトル文字も消したい!という場合は、以下のコードを。
.entry-title{display:none;}
「カスタムCSS」という項目は、編集画面を下にスクロールするとあります。

このカスタムCSSはCocoon独自機能です。
このページにのみ適用できる装飾のようなものです。
「当サイトについて」と「プロフィール」はひとまとめでもOK
サイトの説明や自己紹介のページです。
文字数が少ないなら、「当サイトについて」というページの中に「プロフィール」という見出しを作り、自己紹介を兼ねてもOK。
見出しとは

ん?見出しって…?
見出しブロックを追加で使用できます。

クラシックエディタでは、「段落 ▼」というプルダウンから。

ワードプレスの場合、「見出し2」から使います。
ワードプレスではページタイトルが「見出し1」に設定されています。
本文の中で「見出し1」を使うと構造がおかしくなるんです。
見出しをいくつか付けたい場合は、まずは「見出し2」だけ使っていれば問題ないです。
お問い合わせフォームを設置する
ワードプレスには、お問い合わせフォームを簡単に設置する機能があります。
ブロックエディタの中から、「お問い合わせ」や「Form」を検索して選べばOK。
そのまま何も弄らなくても、最低限お問い合わせフォームとして成立します。項目は編集可能です。
※お問い合わせの転送先をgmailに設定している場合は、以下の設定をしないと受信できない場合があるようです。
サイトマップを設置する
テーマCocoonを使っている方は、ショートコードで簡易的なサイトマップを設置できるようになりました。
Cocoon以外の方は、いろんな方法があると思いますが、手っ取り早いのはプラグインを使う方法です。
ここでは「PS Auto Sitemap」というプラグインをご紹介します。
プラグイン→新規追加で、検索窓に「PS Auto Sitemap」と入力します。

今すぐインストール」→「有効化」
次に、固定ページでサイトマップページを作ります。

ビジュアル/テキスト→「テキスト」をクリック。テキストモードに切り替えます。
以下をコピペし、公開ボタンをクリックします。
<!-- SITEMAP CONTENT REPLACE POINT -->
公開ボタンを押した後、アドレスバーを見てください。

URLの中に「post=数字」という文字列があります。この数字をメモしてください。
設定→PS Auto Sitemap

先ほどメモした数字を、「サイトマップを表示する記事」欄に入力→変更を保存
サイトマップが出来上がりました!

設定→PS Auto Sitemap→「スタイルの変更」でデザインを選べます♪
プライバシーポリシーは後回しでもOK
固定ページの一覧の中に、最初から「プライバシーポリシー」の下書きがあります。
中を見ると雛形になっていて、書き変えて使えるようになっています。
が、今は何もせず、公開しなくてOK。

個人ブログにプライバシーポリシーって必要なの?
個人ブログでプライバシーポリシーが必要になるのは、主に以下の場合。
- Googleアナリティクス、サーチコンソールを導入する
- Googleアドセンスの広告を設置する
- Amazonアソシエイトのアフィリエイト広告を設置する
これらのサービスを利用する場合、「プライバシーポリシー」に必要事項を明記する必要があります。
Googleアナリティクス・サーチコンソール
アクセス解析などを行い、サイトの改善に役立つ無料ツールです。
慌てて設定しなくていいです。ブログを始めてから1~2ヶ月経過して、10~20記事くらい書いてからで大丈夫。
Googleアドセンス
クリック型の広告です。審査に合格すれば設置できます。ブログを収益化できる代表的なサービスです。
Amazonアソシエイト
通販サイト・アマゾンの、成功報酬型の広告(アフィリエイト)です。審査に合格すれば設置できます。
Amazonアソシエイト・プログラム運営規約│Amazonアソシエイト
いずれのサービスも、できたてホヤホヤのブログに設置するような代物ではありません。今はスルーでOK。よって本記事では解説もしないので悪しからず。
ご参考までに、当サイトのプライバシーポリシーはこちら
メニューの設定方法
固定ページができたら「グローバルメニュー(ナビ)」を設定しましょう!
「グローバルメニュー(ナビ)」は、当サイトで言うならピンクの帯のこれ↓

早速、設置してみましょう!
なお、テーマCocoonバージョンです。他のテーマを使っている方はご参考程度に。
外観→メニュー→「メニュー名」にお好きな名前を入力→メニューを作成

グローバルメニューに追加したい固定ページを✔→「メニューに追加」

固定ページ以外もメニューに追加できます。
「メニュー構造」に固定ページが追加されます。ドラッグして順番を入れ替えます。

一番上にあるメニューが、グローバルメニューの一番左に来ます。
「メニュー設定/メニューの位置」
「ヘッダーナビ」・「モバイルヘッダーナビ」に✔→メニューを保存

お好みで細かい設定もできます。サイトを見てみましょう。
グローバルメニューが設置されました!

★Cocoonの場合は、Cocoon設定→ヘッダー→「グローバルナビメニュー色」で、帯色や文字色を変更できます。

ウィジェットの追加/削除
ウィジェットとは、
- サイドバーやフッターにプロフィールを載せたり
- 新着記事・人気記事などを表示できる
ミニメニューのようなもの。
以下の6つのウィジェットが、サイドバーに最初から設置されています。
- 検索
- 最近の投稿
- 最近のコメント
- アーカイブ
- カテゴリ―
- メタ情報
ウィジェットを追加できる場所(ウィジェットエリアと呼びます。)は、テーマによってかなり違います。
Cocoonはこんな感じ↓

これ、かなり多いです。
すごく便利なんですが、最初はどこを使えばいいか分からないと思います。
まずは「サイドバー」、「フッター左/中/右」/「フッター(モバイル用)」あたりから設定してみましょう。
ウィジェットを追加する
試しに、
- 「フッター左」に「プロフィール」
- 「フッター中」に「新着記事」
- 「フッター右」に「人気記事」
このようにウィジェットを入れてみます。
ドラッグ&ドロップでも、追加したい場所をクリックしてで選択してもOK。
動画でどうぞ。↓
※ロリポップユーザーの方の場合、カスタムHTML/広告ウィジェットを使おうとすると、セキュリティの関係で保存できないと思います。
ロリポップのユーザー専用ページ→セキュリティ→WAF設定で、お使いのドメインのWAFを無効にしてください。
10分後くらいに設定が反映されるので、保存できるようになるはずです。
これ以外にも、保存できない/403エラーになる等の場合は、WAFを無効にすると大体解決します。
なお編集が完了したら、WAF設定はまた有効にしておくことを強くお勧めします。
ウィジェットを削除する
ウィジェットの削除は簡単です。
削除したいウィジェットを選んで、「削除」をクリックするだけ。

初期設定のウィジェットのうち、「最近のコメント」と「メタ情報」は、削除していいと思います。
特に「メタ情報」は、読者にとって全く必要ないウィジェット。しかも、不正ログインの原因にもなり得ます。
「メタ情報」ウィジェットは消しておくのが無難です。
最後に
お疲れさまでした!
- パーマリンクの設定
- 固定ページの作成
- メニューの設定
- ウィジェットの追加/削除
かなり駆け足で書かせていただきました。
ここまで来れば、あとはどんどん、記事を書くのみ!思う存分、ブログライフをお楽しみください♪
最後までお読みいただき、ありがとうございました。