WordPressブロックエディターを使いこなす:効率と機能を向上させる上級テクニックガイド

WordPressのブロックエディター(Gutenbergとも呼ばれる)を使っていると、直感的でない機能に出くわすことがあるかもしれません。ブロックテーマを使っていてサイトエディターで操作している場合、いくつかのアクションがわかりにくいことに気づくでしょう。ここでは、使い方をより理解しやすくするために、簡略化した表現をいくつか紹介します。

画像[1] - WordPressブロックエディタを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルなリーチ、迅速な対応
  1. スラッシュ (/) ショートカットコマンド

新しいブロックを追加するたびに挿入ボタンをクリックする必要はありません。もっと便利な方法があります:スラッシュ(/)を入力するだけです。例えば、画像ブロックをページに追加したい場合、「/image」と入力すれば完了です。これは速いだけでなく、簡単です。

画像[2] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. 固定ツールバー

コンテンツを編集していると、フローティングツールバーが邪魔になる。実は、そのツールバーを固定することができる。そうすれば、ツールバーがコンテンツの上に浮いて作業の邪魔になることはありません。簡単に言えば、ツールバーをページの固定位置にドッキングさせ、より集中できるようにする方法だ。ツールバー右上のスリーポイントオプションを選択すると、いくつかのオプションが表示されます。そこで「トップツールバーオプションでツールバーをページ上部にドッキングさせることができます。

画像[3] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. フルスクリーンモード

WordPressを使用中にサイドバーが邪魔になる場合は、簡単に非表示にすることができます。ページの右上にある3つの点をクリックし、「フルスクリーンモード」オプションを選択するだけです。これでサイドバーが消え、すっきりとした編集インターフェイスでコンテンツ作成に集中できます。

画像[4] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. 干渉なしモード

WordPressのブロックエディターにはインターフェイス要素が多すぎて注意が散漫になると感じている方は、気が散らないモードをお試しください。ページの右上にある3つの点をクリックし、「気が散らないモード」を選択するだけで、編集ページ以外のインターフェース要素がすべて非表示になります。こうすることで、より爽やかな環境でコンテンツの編集に集中することができます。

画像[5] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

ブロック・ツールバーやその他のコントロールを表示するには、ページの上部にマウスを置くだけで、これらの機能が表示される。

画像[6] - WordPressブロックエディターを使いこなす:効率性と機能性を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. フォーカスモード

編集中にコンテンツの特定のブロックに集中したい場合は、フォーカスモードを使用できます。このモードでは、編集中のブロックがハイライトされ、他のブロックが目立たなくなるので、編集作業に集中できます。

画像[7] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

使いたいブロックをクリックするだけで、そのブロックがハイライトされる。

  1. ドラッグ&ドロップで画像を入れ替える

ページや投稿に画像を追加する方法はすでにご存知でしょう。しかし、ドラッグ&ドロップで既存の画像を置き換えることもできることをご存知ですか?新しい画像を古い画像の上にドラッグするだけで、素早く簡単に入れ替えることができます。

画像[8] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

上のスクリーンショットでは、ページ上の画像を置き換えるために使用される画像をファイル上にいくつか用意しており、新しい画像は自動的にメディアライブラリに追加される。

画像[9] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. リスト・ビューを使ったブロックの並べ替えと名前付け

リストビューは、ブロックを整理して配置する効率的な方法です。このビューでは、ブロックの並び替えだけでなく、ブロックの名前を変更して、ブロックの内容をより明確に表現することもできます。例えば、ギャラリーブロックの3つの点のオプションをクリックし、「名前の変更」を選択すると、より説明的な名前になります。これにより、個々のブロックの管理と検索が容易になります。

画像[10] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. ブロック・ツールバーを使って複数のブロックをグループ化する

特定のレイアウトを作成するには、隣接する複数のブロックをグループ化することができます。グループ化したいブロックを選択し、ツールバーのグループ化オプションを使用して同じグループに入れます。たとえば、2つの段落を同じグループに入れたい場合は、それらを選択してツールバーのグループ化ボタンをクリックします。こうすることで、全体のレイアウトを簡単に管理・調整することができます。

画像[11] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. 出版プロセスの合理化

ページや投稿を公開する際にクリックする必要性を感じるのであれば、"ポスト"ボタンを2回クリックするのは面倒なので、ワンクリックパブリッシングに設定することができます。方法は簡単で、まずページの右上にある3つの点のボタンをクリックし、次に"プリファレンス"を閉じ、最後に"リリース前のチェックリストの有効化"スイッチ。そうすれば、出版するたびにワンステップの簡単な作業で済む。

画像[12] - WordPressブロックエディタを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルなリーチ、迅速な対応

意外と知らないウェブサイトエディターの機能 以下の機能を使うには、ブロックテーマをインストールする必要があります。ブロックテーマは、ブロックを使ってウェブサイトのすべてのコンテンツを作成、編集、管理できる特別なWordPressテーマです。

  1. テンプレートに画像プレースホルダを設定する

何度も使用するテンプレートやパターンを作成する必要がある場合は、デフォルトのダミー画像だけを挿入しない方がよいでしょう。実際にテンプレートを使用する際には、これらの画像を特定の画像に置き換える必要があるかもしれません。

そのためには、簡単に使える画像プレースホルダーを使うのがいい。例えば、パターンを作り、画像をテキストの左に配置し、画像のアスペクト比を4:3に設定すれば、後でどんな画像を追加しても、自動的にそのアスペクト比に収まります。

画像[13] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

画像ボックスの外側をクリックすると、画像プレースホルダーが表示されます。ボックスには斜めの線が入るので、画像プレースホルダがあることが常にわかります。

画像[14] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

この機能は、クラシックテーマや非ブロックテーマを使用するページエディターや投稿エディターでも使用できますが、最高のエクスペリエンスを得るためにはブロックテーマを使用することをお勧めします。ブロックテーマは、完全なサイトエディタをサポートする唯一のテーマタイプであり、サイトのあらゆる側面をより柔軟に管理できます。つまり、WordPressのパワーを最大限に活用して、より完全なウェブサイトを作成することができます。

  1. スタイルブック

StylebookはBlockテーマ専用の機能で、色、フォント、サイズなど、ウェブサイト全体のスタイルを統一的に設定できます。

この機能を使うには、まずサイトエディターで"タイプ"セクションをご覧ください。次に、目の形をしたアイコンをクリックしてスタイルブックを開き、アクセスします。こうすることで、ウェブサイト全体の外観を簡単に微調整し、統一することができます。

画像[15] - WordPressブロックエディタを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

デザイン・キャンバスのどこかをクリックすると、スタイル・ブック内のすべてのスタイルを編集できるようになります。

スタイルブックは以下のセクションに分かれている:

  • コピー
  • メディア
  • ひねり出す
  • ウィジェット
  • ごかんけいせいぼおん
画像[16] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応

ボタンの背景色を変更するには、"デザイン"タブ

画像[17] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. 変更履歴

WordPress 6.4で導入され、6.5でさらに拡張されたのが、サイトエディタの以下の領域で行われた変更の履歴をさかのぼって表示する機能です:

  • スタイルブック
  • テンプレート
  • モチーフ

スタイルブックの変更履歴を見るには、右上の時計のアイコンをクリックしてください。リビジョンの時系列リストが表示され、それぞれどのユーザーが変更を行ったかが表示されます。

たとえば、特定の日付のリビジョンを選択すると、その時点のデザインを表示できます。これにより、ウェブサイトの変更履歴を簡単に追跡・管理することができます。

画像[18] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応
  1. 輸出入モード

スキーマを作成し、他のサイトで使用したり、WordPress.orgのスキーマ・リポジトリで他のユーザーと共有したい場合は、スキーマを JSONファイル.にサイトエディタがあるとします。パラダイム"セクションには、作成したパターンのリストが表示され、デザインのアイデアを簡単に管理・共有することができます。

画像[19] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、グローバルなリーチ、迅速な対応

3点を選択オプションの後、「ファイルをエクスポート」を選択します。新しいサイトで、もう一度モードセクションに行きJSONインポートを開始します。書類を入れる箱。

画像[20] - WordPressブロックエディターを使いこなす:効率と機能を向上させる高度なテクニックガイド - Photon Flux|プロフェッショナルなWordPress修理サービス、ワールドワイド、迅速な対応

概要

この記事では、スラッシュ(/)ショートカットコマンドなどのショートカットコマンドやドラッグ&ドロップのテクニックを活用してコンテンツの追加プロセスを最適化する方法、フルスクリーンモードやディストラクションフリーモードを活用して編集効率を高める方法など、WordPressのブロックエディタとブロックテーマの高度な機能の数々について掘り下げていきます。さらに、フォーカスモードを使って編集のフォーカスを高める方法や、リストビューとブロックツールバーを使ってページレイアウトを効果的に整理・管理する方法についても解説します。


お問い合わせ
チュートリアルが読めない?無料でお答えします!個人サイト、中小企業サイトのための無料ヘルプ!
カスタマーサービス WeChat
カスタマーサービス WeChat
電話:020-2206-9892
QQ咨询:1025174874
Eメール:info@361sale.com
勤務時間: 月~金、9:30~18:30、祝日休み
© 複製に関する声明
この記事を書いた人: Xiesong
終わり
好きなら応援してください。
クドス0 分かち合う
おすすめ
解説 ソファ購入

コメントを投稿するにはログインしてください

    コメントなし