WordPress ブロックパターンとは。パターンの作り方・使い方

本記事は広告が含まれる場合があります WordPress

ブロックパターンとは?WordPressパターンの作り方・使い方

WordPressではブロックパターンと呼ばれるブロックの組み合わせて利用できる便利な機能が用意されています。

ブロックパターンを利用することで、一つ一つのブロックで一からページを作るよりも、簡単にページを作成することができます。また、好きなパターンを作成し登録することも可能です。

今回はWordPressのブロックパターンの使い方や作成方法を解説します。

 

本記事は、WordPress 6.4.2&:Lightningバージョン: 15.17.1を利用しています。ご利用の環境によって操作画面が異なる場合がありますので、あらかじめご了承ください。

 

ブロックパターンは複数のブロックからなるデザインレイアウト

ブロックパターンは、複数のブロックが組み合わさって作られたデザインレイアウトのことを言います。

ブロックパターンを利用することで、1からレイアウトを組んでいく必要がなくなったため誰でも簡単におしゃれなレイアウトを作成することが可能になっています。

パターンブロックの一例

 

2023年8月にリリースされたWordPress6.3以降では管理画面から簡単にブロックパターンの登録ができるようになっています。また再利用ブロックがパターンブロックと統合されました。

2024年1月時点で、パターンは従来の再利用ブロックの特性を引き継いだ「同期パターン」と、従来のブロックパターンである「非同期パターン」の2種類に分類されます。

同期パターンと非同期パターンの違いについては後ほど詳しく解説します。

 

既に用意されているブロックパターンを使う方法

WordPressに標準搭載されているブロックパターンを使用するには、ブロックエディターの編集画面左上の「+」アイコン(ブロック挿入ツールを切り替え)をクリックします。

編集画面左上の+マークをクリック

 

「パターン」をクリックします。

「パターン」タブをクリック

 

そうするとパターンのカテゴリー一覧が表示されます。今回は試しに「ギャラリー」の中にあるパターンを追加してみましょう。

「ギャラリー」をクリック

 

ご利用のテーマやプラグインによっては、独自のパターンが用意されている場合もあります。

「ギャラリー」をクリックすると、いくつかギャラリーで使えそうなおしゃれなパターンが表示されるので、好きなものをクリックします。

 

これでパターンの追加ができました。なお、パターンの中の画像やテキストは後から編集して自分好みにカスタマイズができます。

 

同期パターンと非同期パターンの違い

WordPress6.3以降、従来の再利用ブロックがパターンブロックと統合されるようになったことから、パターンには「同期パターン」と「非同期パターン」と呼ばれる2つの分類ができました。

  • 同期パターン・・・再利用ブロックの特性を受け継いだパターン。1ヶ所変更すると他の箇所にも影響する(=同期している)
  • 非同期パターン・・・従来のブロックパターン。1箇所変更しても他の箇所には影響しない(=非同期)

 

同期パターンは再利用ブロックの特性を受け継いだパターンです。あるページで使用されている同期パターンを編集すると、その他のページで使用されている同じ同期パターンも内容が変更されるようになります。

同期パターンの解説図

 

一方、非同期パターンは従来のブロックパターンのことで、特定のページで内容を編集しても他のページで使われている非同期パターンには反映されません

非同期パターンの解説図

 

WordPress6.2以前は同期パターンは「再利用ブロック」、従来のブロックパターンは「ブロックパターン」と別機能とされていたため、異なる場所で作成・管理をする必要がありました。

しかし、6.3以降のWordPressでは同じ場所から作成・編集ができるようになっています。

 

あわせて読みたい関連記事

同期パターンについては「【WordPress再利用ブロック】使い方と編集・管理方法」をご参照ください。

 

ブロックパターンを新規作成・登録する方法

以下では、同期パターン・非同期パターンの作成方法を1つずつ解説します。

※本環境ではWordPress6.4.2を使用しています。ご利用のバージョンによっては操作画面が異なる可能性がありますので、あらかじめご了承ください。

 

同期パターンを作成・登録する方法

同期パターンを作成するには、パターンにしたいブロックを全て選択して上ツールバーにある「︙」(オプション)をクリックします。

パターンにしたいブロックを全選択して「︙」(オプション)をクリック

 

「パターンを作成」をクリックします。

「パターンを作成」をクリック

 

任意の「パターン名」「カテゴリー名」を入力した後、「同期」にチェックを入れてから「生成」をクリックします。

パターン名やカテゴリー名を入力し、「同期」にチェックを入れてから「生成」をクリック

カテゴリーは入力しなくても問題ありませんが、その場合「未分類」として管理されるようになります。

 

これで同期パターンの作成ができました。

同期パターンが追加された

 

作成された同期パターンは、標準搭載されているブロックパターンを呼び出す際と同じ方法で使えます。

ブロックエディターの編集画面左上の「+」アイコン(ブロック挿入ツールを切り替え)をクリックします。

編集画面左上の+マークをクリック

 

「パターン」をクリックします。

「パターン」タブをクリック

 

パターン生成時に設定したカテゴリー名(今回は「カスタムパターン」)をクリックします。

「カスタムパターン」をクリック

 

そうすると先ほど登録したパターン(パターン1)が追加されているので、クリックすることで好きなページで呼び出すことができます。

登録したパターンが追加されている

 

パターン名で検索して呼び出し可能

「+」(ブロックを追加)からパターン名を検索することで、登録したパターンを呼び出すことができます。

「+」(ブロックを追加)からパターン名を検索して、呼び出すこともできる

 

非同期パターンを作成・登録する方法

非同期パターンも同期パターンとおよそ同様の方法で作成することができます。

パターンにしたいブロックを全て選択して上ツールバーにある「︙」(オプション)をクリックします。

「︙」(オプション)をクリック

 

「パターンを作成」をクリックします。

「パターンを作成」をクリック

 

パターン名(必須)とカテゴリー名(任意)を入力し、「同期」のチェックを外してから「生成」をクリックします。

パターン名やカテゴリー名を入力し、「同期」のチェックを外してから「生成」をクリック

※カテゴリーを入力しなかった場合「未分類」として管理されるようになります。

 

これで非同期パターンの登録ができました。

登録された非同期パターンは同期パターンの際と同様の方法で、呼び出すことができます。


 

補足:作成したブロックパターン一覧を確認する方法

作成したブロックパターン(同期・非同期パターン)一覧を確認したい場合は、「http(s)://ドメイン名/wp-admin/edit.php?post_type=wp_block」にアクセスします。

例)ドメイン名がwebst8.comの場合・・・http(s)://webst8.com/wp-admin/edit.php?post_type=wp_block

 

そうすると、作成した同期・非同期パターンの一覧が表示されるので、こちらからパターンの編集や削除などができます。

これまでに作成した同期・非同期パターンの一覧

 

まとめ

まとめです。今回はWordPressのブロックパターンの概要や登録方法、使い方を解説しました。

ブロックパターンを利用することで、一つ一つのブロックで一からページを作るよりも、簡単にページを作成することができますのでぜひ活用してみてください。

 
そのほかWordPressの詳しい使い方については以下の記事で解説しているので、興味がある方はこちらもご覧ください。

 

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

 

「業者に任せたけど、更新ができない」「本で独学は時間がかかりすぎる・・」そんなお悩みの方も多いのではないでしょうか。

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

詳細はこちら

YouTubeチャンネル開設しました!

WEBST8 YouTube Channel 開設
最大月間50万PVの当ブログをベースに、Youtube動画配信にてWordPress、ホームページ作成、ブログのことについてお役立ち情報を随時配信していきます。

ご興味ある方はぜひチャンネル登録をしていただけますと幸いです。

おすすめ記事3選

【徹底解説】レンタルサーバーおすすめ比較7選WordPress対応

【おすすめレンタルサーバー比較総まとめ】WordPress対応5社

WordPress(ワードプレス)でブログ・ホームページを始めようと思った時に、レンタルサーバー選びでどれが良いのか迷うことも多いのではないでしょうかこれからWordPressでホームページやブログを開設するためにレンタルサーバー選びを検討している方はこちらをご覧ください。

【WordPressの始め方総まとめ】ワードプレスブログの作り方9STEP

WordPressの始め方総まとめ

WordPress(ワードプレス)でブログを始めようと思った時に、サーバー・ドメインの手続きなどわからないことだらけで困っているというお悩みをお持ちの方も多いのではないでしょうか。本記事では、WordPressでブログやアフィリエイトを始めたい初心者を対象にWordPressの始め方をご紹介していきます。

【総まとめ】WordPress(ワードプレス)ホームページ作り方

【総まとめ】WordPress(ワードプレス)ホームページ作り方

WordPressでホームページを自作しようと思った際に、「ドメイン?サーバー?たくさん調べることがあって何から手をつけたら良いのかわからない」というかたも多いのではないでしょうか。この記事ではWordPress初心者の方を対象にWordPressでホームページを作る方法をご紹介していきます。

-WordPress