ガイド/コンテンツの作成/パターン/ブロックパターンの使い方

ブロックパターンの使い方

ブロックパターンは、WordPress エディターで数回クリックするだけでサイトに追加できる、あらかじめデザインされたレイアウトです。このガイドでは、サイトにブロックパターンを挿入し、自分のコンテンツに合わせてカスタマイズする方法を説明します。

動画チュートリアル

この動画では、WordPress.com サイトでブロックパターンを使用する方法を紹介します。挿入ツールからデザイン済みのパターンを追加する方法、コンテンツやレイアウトを編集する方法、自分で作成したパターンを再利用する方法を解説しています。

この動画の言語は英語です。
YouTube には、自分の言語で視聴できる自動翻訳機能があります。

自動翻訳字幕を表示するには:

  1. 動画を再生します。
  2. 動画右下の ⚙️ 設定 アイコンをクリックします。
  3. 字幕/CC を選択します。
  4. 自動翻訳 を選択します。
  5. 希望する言語を選びます。

自動吹き替え(実験機能)で視聴するには:

  1. ⚙️ 設定 アイコンをクリックします。
  2. 音声トラック を選択します。
  3. 視聴したい言語を選びます。

ℹ️ 翻訳と吹き替えは Google により自動生成されるため、正確でない場合があります。また、自動吹き替えは現在テスト中で、すべての言語で利用できるわけではありません。注: 字幕の文章は Google 翻訳で生成されるため、完全とはいえませんが、内容の把握に役立ちます。

ブロックパターンの追加

利用できるブロックパターンを見てサイトに追加するには、次の手順に従ってください。

  1. サイトのダッシュボードにアクセスします。
  2. パターンを追加したいページ、投稿、またはテンプレートを編集します。
  3. 編集画面で、左上にある「+ ブロック挿入ツール」をクリックします。
上部ツールバーの左上にある「+ ブロック挿入ツール」を囲むボックス。
  1. 「パターン」タブをクリックします。
  2. 利用可能なパターンを探します。「スターターコンテンツ」「お問い合わせ」「ギャラリー」「ブログ投稿」など、カテゴリー別にコレクションを表示できます。
    • セクション下部にある「すべてのパターンを表示」ボタンをクリックすると、大きなウィンドウでパターンを一覧表示できます。
  3. いずれかのパターンをクリックすると、カーソルがある位置にそのパターンが追加されます。

ブロックパターンをサイトに追加すると、そのパターンはコンテンツの一部になります。ライブラリ内のパターンが今後更新または削除されても、すでにページや投稿に追加されたパターンには影響しません。

📌

ブロックパターンやスターターコンテンツに含まれる画像は自由に使用できますが、外部でホストされており、メディアライブラリには保存されていません。今後変更または削除される可能性があるため、自分の画像に置き換えることをおすすめします。

パターンライブラリ

さまざまな画面サイズでパターンをプレビューし、レスポンシブ対応を確認するには、WordPress.com パターンライブラリを使用できます。パターンの参照、検索、プレビューができるほか、パターンをコピーしてブロックエディターに貼り付けることもできます。

  1. パターンライブラリにアクセスします。
  2. カテゴリーのメニューを使うか、機能やキーワードで検索してパターンを探します。
  3. 使用するパターンが見つかったら、「パターンをコピー」ボタンをクリックします。
    • ログインしていない場合は、各カテゴリーの最初の3つのパターンのみコピーできます。それ以外のパターンをコピーするには、「アクセスを取得」をクリックし、ログインするか無料の WordPress.com アカウントを作成してください。
  4. WordPress.com サイトの投稿、ページ、またはテンプレートのエディターに移動し、キーボードショートカット (Mac の場合は Command + V、Windows の場合は CTRL + V) を使用するか、右クリックして「貼り付け」を選択してパターンを貼り付けます。
  5. 必要に応じて、コンテンツ (画像、テキスト、リンクなど) を編集します。スタイルをサイトエディターで設定したものは、貼り付けたパターンに自動的に適用されます。

ブロックパターンを編集する

ブロックパターンには2つの編集モードがあります。パターンで変更したい内容に応じて切り替えることができます。

  • コンテンツのみ編集モード (デフォルト): パターン内のテキスト、画像、リンクを置き換えます。レイアウトはロックされているため、パターンを構成するブロックを誤って移動したり削除したりする心配がありません。
  • フル編集モード: レイアウト自体を変更します。パターン内のブロックは自由に追加、削除、移動したり、スタイルを変更したりできます。

パターンをページや投稿に追加すると、コンテンツのみ編集モードで開きます。次のセクションでは、各モードについて順に説明します。

ブロックパターンのコンテンツを編集する

ブロックパターンをページや投稿に追加すると、パターンはコンテンツのみ編集モードで開きます。コンテンツのみ編集モードではブロックパターンのレイアウトがロックされるため、レイアウトを誤って崩したりブロックを削除したりすることなく、テキストや画像を安全に編集できます。

コンテンツのみ編集モードでは、エディターに表示される内容と操作できる範囲が制限されます。

  • 「リスト表示」には、パターン内のコンテンツブロック (見出し、段落、画像、ボタン) のみが表示されます。レイアウトを制御する構造ブロック (カラム、グループ、行) は、「パターンを編集」ボタンをクリックするまで非表示です。
  • ブロックサイドバーには、選択したブロックを編集できる「コンテンツ」タブ、パターン内の特定のアイテムを追加・削除できる「リスト表示」オプション、見た目を調整する「スタイル」タブが表示されます。
  • ブロックツールバーには、フル構造編集に切り替える「パターンを編集」ボタンと、スタイルバリエーションを試せる「シャッフル」ボタン (しずくアイコン) があります (バリエーションがある場合)。
リスト表示、コンテンツサイドバー、パターン編集オプションがハイライトされた状態。

表示されているコンテンツブロックをクリックすると、直接編集できます。見出しを選択してテキストを変更したり、画像をクリックして置き換えたり、リンクの URL を更新したりできます。

パターン内の個々のアイテムを編集する

パターン内の一部のブロックには、ボタンブロックやソーシャルアイコンブロックのように繰り返し可能なアイテムが含まれています。コンテンツのみ編集モードのままでも、個々のアイテムを追加・削除できます。

コンテンツのみ編集モードでこれらのブロックを編集するには、次の手順に従ってください。

  1. エディターでパターンをクリックします。
  2. ブロック設定サイドバーを開きます。
  3. ブロック設定サイドバーの「リスト表示」アイコンをクリックします。
  4. 「+」ブロック挿入アイコンをクリックして、同じ種類の項目をもう1つ追加します (個別のボタン、ソーシャルアイコン、リンクなど)。
  5. 各ブロックの右側にある三点メニュー (⋮) をクリックすると、次のオプションが表示されます。
    • 上/下に移動: ブロック内の特定のアイテムを上または下に移動します。
    • 複製: 特定のアイテムの完全なコピーを作成します。
    • 前/後に追加: 既存のアイテムの前後に新しいボタン、リンク、またはソーシャルアイコンを追加します。
    • メモを追加: アイテムにブロックメモを追加します。
    • 削除: 親ブロックからアイテムを削除します。
ブロックパターンのブロック設定サイドバーでリスト表示が開いている状態。

ブロックパターンのレイアウトの編集

ブロックパターンのレイアウトを変更するには、コンテンツのみ編集モードからフル編集モードに切り替えます。変更が終わったら、コンテンツのみ編集モードに戻すと、テキストや画像の編集を続けてもレイアウトがロックされた状態を維持できます。

ブロックパターンのレイアウトを編集するには、次の手順に従ってください。

  1. エディターでパターンをクリックします。
  2. ツールバーまたは設定サイドバーにある「パターンを編集」ボタンをクリックします。
ブロックツールバーの「パターンを編集」オプションがハイライトされた状態。
ツールバー
ブロックサイドバーの「パターンを編集」オプションがハイライトされた状態。
サイドバー
  1. 構造的な変更を行います。ブロックの移動、削除、追加が可能です。
  2. コンテンツのみ編集モードに戻るには、ブロック設定サイドバーまたはブロックツールバーにある「コンテンツのみ編集」ボタンをクリックします。
リスト表示、ブロック設定サイドバー、パターン終了オプションがハイライトされた状態。

独自のパターンの使用

作成したパターンは、ブロック挿入ツールの「パターン」セクションにも表示されます。作成したパターンを追加するには、次の手順に従ってください。

  1. ダッシュボードにアクセスします。
  2. 「ページ」または「投稿」に移動し、任意のページまたは投稿をクリックして編集するか、「外観」→「エディター」からサイトエディターにアクセスします。
  3. 編集画面で、左上にある「+ ブロック挿入ツール」をクリックします。
  4. 「パターン」タブをクリックします。
  5. 「マイパターン」カテゴリーを選択します。
  6. パターンを1回クリックしてコンテンツに追加するか、表示したい場所までドラッグします。
「パターン」セクションから「マイパターン」カテゴリーへの矢印。

独自のパターンの編集と管理の方法についてはこちらをご覧ください。

Copied to clipboard!