サイトマップ(全ページ一覧)

ワードプレスで固定ページを作って、メニューやウィジェットを整えよう!

ワードプレスで固定ページを作ってメニューやウィジェットを整えよう!

 

ちびこママです!
icon-twitter Chibiko_mama

前回の記事で、

  1. ロリポップ!でレンタルサーバーを契約
  2. ムームードメインで独自ドメインを取得
  3. ワードプレスをインストール
  4. 無料テーマのCocoonを入れる

ここまでの流れを書きました。

これでブログを始められますが、記事を書く前に、見た目をもう少し整えたい!という方もいると思います。

今回は、「固定ペ―ジ」の作り方、メニューやウィジェットの設定方法を解説します♪

最初にやっておこう!パーマリンクの設定

記事を書く前に、やって欲しい作業があります。「パーマリンク」の設定です。

パーマリンクとは

パーマリンクってなに…?

ページの個別のURLであり、(基本的に)ずっと変わらないURLです。

当サイトのURLは、https://www.akaeho.net

この記事のURLは、https://www.akaeho.net/wp-page-menu-widget/

wp-page-menu-widget」の部分が、「パーマリンク」です!簡単だね!^^

パーマリンクは、なるべくシンプルで、何のページなのか、分かりやすい文字列が最適。

サイトマップなら、https://www.akaeho.net/sitemap/だと、分かりやすいよね。

 

(基本的に)とカッコ書きにしたのは、別に変えようと思えば変えられるから。

でも、後から変えると大変。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」で、パーマリンクを変更できます。

固定ページの作り方

固定ページってなに?

投稿と何が違うの?

固定ページとは

以下のようなページのこと。パーマリンク用の英語も付けておきます。ご参考にどうぞ♪

  • ホーム(home)
  • 当サイトについて(about)
  • プロフィール(profile)
  • お問い合わせ(contact)
  • よくあるご質問(faq)
  • サイトマップ(sitemap)
  • プライバシーポリシー(privacy-policy)
  • ご利用規約(terms)

これらの中から、ご自身のブログに必要なページを作ればOK。

記事を書くのが「投稿」、サイト運営上必要なページは「固定ページ」で作る、と覚えておけば、とりあえず大丈夫です。

ホーム(フロントページ)を作る場合

「あかえほ」ではホーム(フロントページ)を作っています。

ホーム
「あかえほ」は赤ちゃん向けの創作絵本サイトです。パラパラめくれるウェブ絵本、印刷できるPDF絵本をご提供しています。読み聞かせを気軽に始めたい方へ。

デフォルトの状態では、新着記事一覧がトップページになります。ホームを作るかどうかはお好みでOK。ただし、作る場合はちょっと設定が必要です。

 

まず、固定ページ新規作成で、あなたのブログのトップページを自由に作りましょう!

パーマリンクは「home」にします。

固定ページ-ホーム

こまめに「下書きとして保存」をしてね。完成したら公開をクリック。

「https://あなたの独自ドメイン/home/」というURLのページができました。

このままだと、「home」というパーマリンクが無いと、“ホーム”にたどり着けません

 

そこで、「home」を“ホーム”(フロントページ)であるとワードプレスに認識させます。

フロントページの設定

設定表示設定で、「ホームページの表示」→「固定ページ」を選択

ホームページ:「ホーム」を選択

※自分がつけた固定ページのタイトルが、ここに表示されます。

 

下にスクロール→変更を保存

 

これで、独自ドメインにアクセスすると“ホーム”(フロントページ)が表示されるようになりました!

フロントページ

Cocoonをお使いの方へ

  • ホーム(フロントページ)のSNSボタンは消したい!
  • でもホーム以外のページには付けたい!

という方は、以下のコードを「カスタムCSS」にコピペし、更新してください。

.sns-share, .sns-follow{display:none;}
  • 「ホーム」というタイトル文字も消したい!

という場合は、以下のコードを。

.entry-title{display:none;}

 

「カスタムCSS」という項目は、編集画面を下にスクロールするとあります。

Cocoon-カスタムCSS

このカスタムCSSは、Cocoonの独自機能です。

このページにのみ適用できる、装飾のようなものです。

「当サイトについて」と「プロフィール」は、ひとまとめでもOK

サイトの説明や自己紹介のページです。

当サイトについて
「あかえほ」はちびこママが運営する無料の創作絵本サイトです。赤ちゃんから幼児向けの絵本をご提供しています。

文字数が少ないなら、「当サイトについて」というページの中に「プロフィール」という見出しを作り、自己紹介を兼ねてもOK。

見出しとは

ん?見出しって…?

見出しは、編集画面の「段落 ▼」というプルダウンから選んで設定します。

見出しタグ選択画面

見出しを使うと、読者にとっても見やすく、検索エンジンにとっても文章構造を理解しやすいページになります。

ワードプレスの場合、「見出し2」から使います。

ワードプレスではページタイトルが「見出し1」に設定されています。

本文の中で「見出し1」を使うと構造がおかしくなるんです。

 

見出し6までありますが、今は気にしなくてOK。(長文を書いたり、見出し2の中で更に細かく分けたい場合に使います。)

見出しをいくつか付けたい場合は、まずは「見出し2」だけ使っていれば問題ないです。

お問い合わせフォームを設置する

こちらの記事で、「Jetpack」というプラグインをご紹介しました。

Jetpackには、お問い合わせフォームを簡単に設置する機能があります

コンタクトフォーム設置

お問い合わせフォームを追加」をワンクリック!以上!(笑)

項目は編集可能です。

サイトマップを設置する

テーマCocoonを使っている方は、ショートコードで簡易的なサイトマップを設置できるようになりました。

 

Cocoon以外の方は、いろんな方法があると思いますが、手っ取り早いのはプラグインを使う方法です。

ここでは「PS Auto Sitemap」というプラグインをご紹介します。

 

プラグイン新規追加で、検索窓に「PS Auto Sitemap」と入力します。

サイトマッププラグイン

今すぐインストール」→「有効化

 

次に、固定ページでサイトマップページを作ります。

PS Auto Sitemap

ビジュアル/テキスト→「テキスト」をクリック。テキストモードに切り替えます。

 

以下をコピペし、公開ボタンをクリックします。

<!-- SITEMAP CONTENT REPLACE POINT -->

 

公開ボタンを押した後、アドレスバーを見てください。

アドレスバーでページIDを確認

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

 

設定PS Auto Sitemap

PS Auto Sitemap設定画面

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

 

サイトマップが出来上がりました!

サイトマップ

設定PS Auto Sitemap→「スタイルの変更」でデザインを選べます♪

プライバシーポリシーは後回しでもOK

固定ページの一覧の中に、最初から「プライバシーポリシー」の下書きがあります。

中を見ると雛形になっていて、書き変えて使えるようになっています。

が、今は何もせず、公開しなくてOK。

 

個人ブログにプライバシーポリシーって必要なの?

個人ブログでプライバシーポリシーが必要になるのは、主に以下の場合。

これらのサービスを利用する場合、「プライバシーポリシー」に必要事項を明記する必要があります。

Googleアナリティクス・サーチコンソール

アクセス解析などを行い、サイトの改善に役立つ無料ツールです。

慌てて設定しなくていいです。ブログを始めてから1~2ヶ月経過して、10~20記事くらい書いてからで大丈夫。

プライバシーの開示に関するポリシーアナリティクスヘルプ

Googleアドセンス

クリック型の広告です。審査に合格すれば設置できます。ブログを収益化できる代表的なサービスです。

コンテンツ ポリシー 必須コンテンツAdSenseヘルプ

Amazonアソシエイト

通販サイト・アマゾンの、成功報酬型の広告(アフィリエイト)です。審査に合格すれば設置できます。

Amazonアソシエイト・プログラム運営規約Amazonアソシエイト

 

 

いずれのサービスも、できたてホヤホヤのブログに設置するような代物ではありません。今はスルーでOK。よって本記事では解説もしないので悪しからず。

ご参考までに、当サイトのプライバシーポリシーはこちら

参考にしていただいて構いません。が、完全にコピペしてしまうと、あなたのサイトがコピーサイトと認定され、ペナルティを受ける可能性があります。

メニューの設定方法

固定ページができたら、「グローバルメニュー(ナビ)」を設定しましょう!

「グローバルメニュー(ナビ)」とは、当サイトで言うなら、ピンクの帯のこれです。↓

グローバルメニュー

早速、設置していきましょう!

なお、テーマCocoonバージョンです。他のテーマを使っている方はご参考程度に。

 

外観メニュー→「メニュー名」にお好きな名前を入力→メニューを作成

メニュー作成

 

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

メニューに追加

固定ページ以外もメニューに追加できます。

 

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

メニュー構造

一番上にあるメニューが、グローバルメニューの一番左に来ます。

 

「メニュー設定/メニューの位置

ヘッダーナビ」・「モバイルヘッダーナビ」に✔→メニューを保存

メニューを保存

お好みで細かい設定もできます。サイトを見てみましょう。

 

グローバルメニューが設置されました!

グローバルメニュー

 

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

グローバルメニュー-Cocoon

ウィジェットの追加/削除

ウィジェットって?

  • サイドバーやフッターにプロフィールを載せたり
  • 新着記事・人気記事などを表示できる

ミニメニューのようなもの。

以下の6つのウィジェットが、サイドバーに最初から設置されています。

  1. 検索
  2. 最近の投稿
  3. 最近のコメント
  4. アーカイブ
  5. カテゴリ―
  6. メタ情報

ウィジェットを追加できる場所(ウィジェットエリアと呼びます。)は、テーマによってかなり違います。

Cocoonはこんな感じ↓

ウィジェットエリア-Cocoon

これ、かなり多いです。

すごく便利なんですが、最初はどこを使えばいいか分からないと思います。

まずは「サイドバー」、「フッター左/中/右」/「フッター(モバイル用)」あたりから設定してみましょう。

ウィジェットを追加する

試しに、

  • 「フッター左」に「プロフィール」
  • 「フッター中」に「新着記事」
  • 「フッター右」に「人気記事」

このようにウィジェットを入れてみます。

ドラッグ&ドロップでも、追加したい場所をクリックしてで選択してもOK。

動画でどうぞ。↓

ウィジェットを削除する

ウィジェットの削除は簡単です。

削除したいウィジェットを選んで、「削除」をクリックするだけ。

ウィジェットの削除

 

初期設定のウィジェットのうち、「最近のコメント」と「メタ情報」は、削除していいと思います。

特に「メタ情報」は、読者にとって全く必要ないウィジェット。しかも、不正ログインの原因にもなり得ます。

「メタ情報」ウィジェットは消しておくのが無難です。

最後に

お疲れさまでした!(*´ω`)

  • パーマリンクの設定
  • 固定ページの作成
  • メニューの設定
  • ウィジェットの追加/削除

上記について、かなり駆け足で書かせていただきました。

ここまで来れば、あとはどんどん、記事を書くのみ!思う存分、ブログライフをお楽しみください♪

 

最後までお読みいただき、ありがとうございました。

タイトルとURLをコピーしました