ブロックエディター版 固定ページの使い方

WordPress

【ブロックエディター版】WordPressの固定ページの使い方を徹底解説

投稿日:2019年6月13日 更新日:

WordPress(ワードプレス)を始めたばかりの初心者の方で、固定ページの意味や使い方がよくわからず、悩んでいる方も多いのでしょうか。
 

今回は、WordPress5.0から標準実装された新エディタ「ブロックエディター」での固定ページ機能の概要や画像の載せ方、見出しの付け方や、、固定ページの親子関係など基本的な使い方について一通り説明していきます。
 

関連記事

従来のエディター「クラシックエディター」版での固定ページの使い方は「【2019年版】WordPress固定ページの使い方を初心者向けに解説」をご参照ください。

 

【WordPress対応】自分でホームページ・ブログを作成したいWebスクールWEBST8
WordPress 自分でホームページ・ブログを作成したい個人事業主のためのWebスクール・教室 ウェブストエイト


 


 

WordPress 固定ページとは

ワードプレス 固定ページ
 

固定ページとは、「会社情報」や「お問い合わせ」のように、ページ単体で完結できるようなページを作成する際に利用する機能です。固定ページで作成したページは投稿と違って投稿一覧の中には表示されないため、メニューバーなどに自分で配置する必要があります。
 
 

■例)固定ページで作成したお問い合わせページ
ワードプレス固定ページの例
 

固定ページと投稿の違い

投稿と固定ページとの違いはなんなんでしょうか??

投稿と固定ページは似ているんですが、一般的に固定ページでは「会社情報」や「お問い合わせ」などページ単体で完結する内容を固定ページで作成します。

 

ワードプレスの投稿と固定ページの違い
 

「投稿」はカテゴリーやタグによりページ同士をジャンル分けして一覧表示することができるのに対して、「固定ページ」は通常カテゴリーやタグという概念がなく、ページ単体で独立しています。
 

項目投稿固定ページ
特徴 ブログのようなコンテンツは投稿で作成する
例)コラム、技術情報、お知らせ・ニュース、イベント、商品ページなど
ページ単体で完結できるようなコンテンツを書くのに向いている。
例)トップページ、会社情報、お問い合わせ、アクセス、採用情報、ランディングページなど
できること
  • カテゴリー・タグによる投稿の関連付けができる
  • 投稿一覧、カテゴリー一覧、タグ一覧から各ページを一覧表示できる
  • 複数のブログタイプ(カスタム投稿タイプ)を作ることができる
  • 固定ページ同士で親子関係を作ることができる
  • ページごとにデザインテンプレートを作成・選ぶことができる
できないこと
  • 投稿同士で親子関係を作ることができない。
  • ページごとにデザインテンプレートを選択することができない。
  • カテゴリー・タグによる投稿の関連付けができない
  • 固定ページ一覧、カテゴリー一覧、タグ一覧などで各ページを一覧表示できない

 

 

現在は新エディター(ブロックエディター)が標準に

2018年12月末にリリースされたWordPress5.0から新しいエディターブロックエディターが標準になりました。これまでのクラシックエディター(ビジュアルエディターやテキストエディター)と違い、ブロック単位でコンテンツを作っていくエディターになります。
 

■従来のエディターと新しいエディター
従来のエディターと新しいエディター(Gutenberg)
 

新エディター(ブロックエディター)の編集画面


 

注意点

 
ホームページ Unavaiableグーテンベルクエディター(ブロックエディター)は、2018年12月にリリースされた比較的新しいエディターです。

現在、有名どころのテーマやプラグインはこの新しい順次エディターに対応していっていますが、全てのプラグインやテーマがこの新しいエディターに対応しているわけではないので、使い方によっては一部正常に動作しない場合もあります。

これからある程度利用者数の多いテーマやプラグインはじきに対応していくものと思われますが、今は過渡期にあたるので、注意しましょう。

 

合わせて読みたい記事

従来のエディター(クラシックエディター)の方が使い勝手が良い人もいるでしょうし、そもそも普段使っているプラグインがGutenberg未対応の場合はこれまで使っていた機能の一部が使えなくなります。その場合は、プラグイン「Classic Editor」を利用することで従来のエディターに戻すことができます。
詳しくは下記の記事をご覧ください。

【Classic Editor】WordPress5系でグーテンベルクから従来エディターに戻す方法

 
以降は最新のブロックエディター版の操作説明になります。
 
 

まずは固定ページの追加・編集・削除方法を覚えよう

固定ページを新規追加する方法

まず試しに固定ページを作成してみましょう。固定ページ>固定ページ一覧(新規追加でもOK)を押下します。
固定ページ>固定ページ一覧
 

固定ページ>新規追加ボタンを押下します。
固定ページ>新規追加
 

ここではタイトルと本文を下記のように入力して「公開」ボタンを押すと固定ページが公開されます。
固定ページの編集画面が表示されます。
固定ページの編集画面
 

まずはタイトルと文章を書いて、プレビューで確認してみましょう。


 

ページを公開しても良い場合は、「公開」ボタンを押下して保存しましょう。ページが公開されて一般の人も閲覧できるようになります。


 

なお、固定ページは投稿のように一覧には表示されません。ですので、通常はメニューバーなどに作成した固定ページを設定していきます。

 
 

メニューバーに固定ページを設定する

次に、作成した固定ページを設定しましょう(メニューバーの使い方を知っている方は本手順不要です)。
 

管理画面から外観>メニューの設定を選択します。

WordPress 外観>メニュー

WordPress 外観>メニュー


 

まずメニューを作成します。ここでは、「メインメニュー」(※)と入力してメニューを作成ボタンを押下します。
メインメニューと入力してメニューを作成する
(※)名称はなんでもOKです。
 

メインメニューが作成されました。事前に作った固定ページが表示されます。先ほど作成した固定ページをチェックして、「メニューに追加」ボタンを押下します。
事前に作成した固定ページにチェックを入れてメニューバーに追加ボタンを押下する
 

追加したメニューは、ドラッグ&ドロップでメニューの順番を変えることができます。


 

最後にメニューの設定を行います。ここではHeader NavigationとFooterNavigationにチェックを入れて最後にメニューを保存ボタンを押下します。
ここではHeader NavigationとFooterNavigationにチェックを入れて最後にメニューを保存ボタンを押下します
 
(※)Header NavigationとFooterNavigationという名称はご利用のテーマによって違います。また、テーマによっては1つしかチェックができない場合も3つある場合もあります。
 

メニューバーに作成した固定ページが表示されていれば完了です。


(※)本例では、無料テーマ「Lightning」を利用しています。
 

ここでは、メニューバーに関する詳しい説明は割愛しますが、メニューバーで固定ページを表示する方法は「WordPressの使い方 メニューバーの作り方」の記事をご参照ください。
 

固定ページの編集方法

つぎに一度作成した固定ページの編集方法を説明していきます。固定ページ>固定ページ一覧をクリックします。
固定ページ>固定ページ一覧
 

タイトル下付近にマウスカーソルを合わせると「固定ページ編集」リンクが表示されますのでクリックします。
固定ページ>編集
 

固定ページ編集画面が表示され、固定ページを編集することができます。
固定ページ編集画面 ブロックエディター版
 

クイック編集では簡単な情報を編集できます。

「クイック編集」では、簡単な情報を編集できます。
固定ページ>クイック編集
 

クイック編集では固定ページ本文以外のタイトルやスラッグ、公開ステータスなどの情報を簡単に編集することができます。
固定ページ>クイック編集画面

 
 

固定ページの削除方法

最後に一度作成した記事の削除方法を説明していきます。固定ページ>固定ページ一覧をクリックします。
固定ページ>固定ページ一覧
 

タイトル下付近にマウスカーソルを合わせると「ゴミ箱」リンクが表示されますのでクリックします。
固定ページ>ゴミ箱
 

以上で削除は完了です。
 

なお、誤って消した場合は、ゴミ箱リンクから復元することができます。
固定ページ>ゴミ箱
 
 

以上で、固定ページの追加・編集・削除方法の説明は終わりです。ここからはより具体的なエディターの基本的な使い方を説明していきます。
 

本例では、「Lightning」というテーマを使用した例で説明していきますので、同じテーマを利用したい方は「Lightning」をご利用ください。
WordPressテーマの適用方法はこちら
 

 

エディターの基本的な使い方を覚える

それでは固定ページエディターの基本的な使い方について詳しく説明していきます。
 

固定ページの編集画面
 

タイトルを文章を書いてみよう

先ほどの繰り返しになりますが、もう一度タイトルと文章を書いてプレビューボタンを押してみましょう。


 

画像を挿入する

次に画像を挿入してみましょう。左上の+ボタンを押して「画像」を選択、自分の好きな画像を選択します。


 
 

見出しを挿入する

次に、見出しを挿入してみましょう。+ボタンを押して、「見出し」を選択します。見出しはH2・H3・H4と複数の見出しが用意されています。


 

見出しは本の章のようなものです。見出しは階層を持つことができます。h1が本のタイトルに相当して、H2は第1章・第2章、H3は第1-1章、第1-2章、H4は第1-1-1章、1-1-2章のような階層です。
 

見出しをつけることで文章が読みやすくなりSEO対策にもなりますので、適切な見出しをつけるようにしましょう。

 

リストを挿入する

リストのアイコンを選択すると、箇条書きを作ることができます。


 
 

固定ページを下書き保存する

ある程度ページを作成したら、保存しましょう。下書き保存を選択すると、下書き(公開していない)でページを保存することができます。


 
 

固定ページを公開をする

ページを公開しても良い場合は、「公開」ボタンを押下して保存しましょう。ページが公開されて一般の人も閲覧できるようになります。


 

下書きに戻す

一度ページを公開してから再度下書きに戻したい場合は「下書きに戻す」ボタンを押下します。


 
 

既存のブロックの間に挿入する

すでに作成したブロックとブロック境目にカーソルを合わせると、既存のブロックの間に新しいブロックを挿入することができます。


 
 

既存のブロックを移動する

既存のブロックの左側の矢印を選択すると、ブロックの順番を変更することができます。


 

SHIFTボタンを押しながら複数のブロックを選択した状態で矢印を選択すると、複数ブロックまとめて順番を変更することもできます。


 
 

既存のブロックを削除する

既存のブロックを削除したい場合は、既存のブロックを選択して、詳細設定アイコンを選択してブロックを削除をすることができます。


 

このように、新しいエディターでは「ブロック」と言われる単位を挿入していくことでページを作成していくことができます。

 

その他の様々なブロック

利用できるブロックはこのほかにもたくさんあります。初期状態で、ブロックエディターでは、下記のブロック種類が用意されています。
 

  • よく使うブロック
  • 一般ブロック
  • フォーマット
  • レイアウト要素
  • ウィジェット
  • 埋め込み

 


 

ここでは、割愛しますが、ブロックエディターの詳しい使い方は 「WordPress Gutenberg(ブロックエディター)の使い方を徹底解説」に記載していますので、ぜひご参照ください。

【2019年最新】WordPressブロックエディターの使い方を徹底解説


 
 

固定ページの色々な使い方を覚える

固定ページでアイキャッチを追加する

固定ページでは「アイキャッチ」という、いわゆるサムネイル表示機能があります。アイキャッチを設定していると、FacebookやTwitterでシェアした際にアイキャッチに設定した画像を表示することができます。
 

アイキャッチは固定ページ編集画面右下の「アイキャッチ画像を設定」から設定することができます。
固定ページ>アイキャッチの設定
 

下記のようにアイキャッチ画像を設定しましょう。


 

固定ページで記事のURLを変更する

 
固定ページのURLは下記のURLスラッグ設定より変更することができます。
固定ページ>パーマリンクの設定
 

下記のようにURLを変更してみましょう。


 

(補足)パーマリンクとスラッグの違い
パーマリンクのほかに「スラッグ」という設定を見かけましたが、スラッグとパーマリンクの違いってなんでしょうか??

パーマリンクはURL全体を指すのに対して、スラッグはURLの末尾部分を指します。

 

WordPress 投稿画面 URLスラッグ
 

パーマリンクとスラッグの違い

パーマリンクとスラッグについての詳しい説明は「【やさしく解説】WordPressのパーマリンクの変更手順とおすすめ設定」をご参照ください。

 

パスワード付き固定ページを作成する

公開範囲を設定することもできます。公開ボタンを押してパスワード設定することができます。
パスワード保護の設定
 

パスワード保護設定をしたページについては、パスワードを知っている人だけがページを閲覧できるようになります。


 
 

テンプレートを変更する

ページによってはサイドバーありページとサイドバーなし(1カラム)ページなどレイアウトを変えたい場合があると思います。
 

固定ページでは、あらかじめ用意されている複数のレイアウトテンプレートからどれにするかを選択することができます。
 

ここでは固定ページのテンプレートの変更方法は、右側にある「テンプレート」から変更できます。
 


(※)テンプレート名や種類は適用しているテーマによって異なります。下記は、サイドバーなし(1カラム)のテンプレートを選択した例です。
 

ページ間で親子関係を作成する

固定ページでは親となる固定ページを指定でき、ページ間で親子関係を作ることができます。
固定ページ親子関係の設定 
 

なお、親子関係を作ると、URLの末尾が「.../親固定ページスラッグ/子固定ページスラッグ/」になります
 

■親ページを指定する例


 
 

固定ページをトップページに割り当てる

トップページは初期状態では、最新の投稿記事が表示されている状態です。トップページを任意の固定ページに割り当てる設定ができます。ここでは、固定ページをトップページに割り当てる表示設定を行なっていきます。
 

ダッシュボードの設定>表示設定を選択します。
設定>表示設定
 

表示設定が表示されます。
表示設定
 

初期設定は、トップページの表示が「最新の投稿」一覧が表示される設定になっています。
表示設定 トップページに最新の投稿一覧が表示される設定になっている
 

トップページに事前に作成した固定ページ(ここではHOME)を割り当てます。
表示設定 トップページに固定ページを設定する
 

これで、トップページを表示すると「HOME」の内容が表示されるようになりました。
ここで設定するんですね!でも、もともとトップページに表示されていたブログ一覧ページはどこに表示されるでしょうか?

ブログ一覧ページも任意に固定ページに割り当てることができます。続けて説明していきますね。

 

「投稿ページ」に事前に作成した固定ページ「ブログ(※)本文は空でOK」を割り当てましょう。
表示設定 投稿ページに固定ページを設定する
 

設定が完了したら最後に変更を保存しましょう。


 

以上で設定は完了です。トップページに「HOME」の内容が、「ブログ」にはブログ一覧が表示されて入れば完了です。

 
 

まとめ

まとめです。今回は、WordPress5.0から標準実装された新エディタ「ブロックエディター」での固定ページ機能の概要や画像の載せ方、見出しの付け方や固定ページの親子関係など基本的な使い方について一通りご紹介しました。
 

本記事で説明した主な内容

    • 固定ページの基本や投稿との違い
    • 固定ページの追加・編集・削除方法
    • 固定ページのメニューバーへの登録方法
    • ブロックエディター版での使い方。見出しやリストなどの使い方
    • 固定ページURL(パーマリンク)の変更方法
    • 固定ページの公開方法。パスワード保護
    • 固定ページの親子設定
    • 固定ページのテンプレートの変更
    • 固定ページをトップページに割り当てる方法

 

従来のエディターと新しいエディター(Gutenberg)
 

まだ少し慣れない部分もありますが、慣れていったらとても便利そうですね!

 

今はまだ未対応やベータ版のプラグインが多いですが、これからどんどん新エディタに対応してくるものも増えてくると思いますので、便利なものは利用するようにしていきましょう。

 

自分で触ってみないことにはなかなかわからないことも多いと思いますので、興味がある方はたくさん触ってみて覚えてください。
 

今回は以上になります。最後までご覧いただきありがとうございました。
 

合わせて読みたい記事

WordPressの基本的な使い方を「【2019年度版 WordPress使い方総まとめ】ワードプレスの使い方を徹底解説」にまとめました。WordPressの使い方をしっかり覚えたい方はあわせてご参考ください。

【2019年版WordPress(ワードプレス)の使い方総まとめ】

 


弊社は、自分でホームページを作ることを推奨しています。「業者に任せたけど、更新ができない」「本で独学は時間がかかりすぎる・・」そんなお悩みの方も多いのではないでしょうか。

個別指導形式のスクールでは、自分の知りたいことをピンポイントで学習・達成でき、自分で更新もできるというメリットもあります。
無料事前相談もしておりますので、まずはお気軽にご登録ください。

詳細はこちら


 

『自分で作る選択を』
自分でホームページ作成・Web集客したいホームページ作成スクール・教室

自分でホームページ作成・Web集客したいホームページ作成スクール・教室 WEBST8

おすすめ記事3選

【2019年度】WordPressブログアフィリエイトにおすすめのテーマ5選

ブログアフィリエイトを本格的に始めるなら、広告の埋め込み機能をはじめ記事装飾・デザイン機能が圧倒的に豊富なブログに特化した有料テーマがおすすめです。 当ブログで利用している「AFFINGER5」や関連サイトで利用している「賢威」をはじめ、アフィリエイトでおすすめ・実績のあるテーマを5選ご紹介していきます。

【初心者向け】WordPressを使ったアフィリエイトの始め方を徹底解説

これから初めてWordPressでアフィリエイトを始めようと思った時に、まず何から手をつけたら良いかわからないという方が多いのではないでしょうか。 本記事では、WordPressでアフィリエイトを始めたい初心者を対象にアフィリエイトの始め方をご紹介していきます。

【2019年版WordPress(ワードプレス)の使い方総まとめ】

本記事ではWordPress(ワードプレス)を使ってホームページまたはブログサイトを作りたい初心者の方向けに、WordPressの導入から使い方まで、総まとめ編として説明していきます。 WordPressの使い方をしっかり勉強したい方はぜひご覧ください。 (※)WordPress5.0から実装された最新のブロックエディター(グーテンベルグエディター)にも対応しています。

-WordPress
-, , , ,

Copyright© WEBST8 , 2019 All Rights Reserved Powered by AFFINGER5.