- 実践 WordPress ホーム
- Learn WordPress 日本語訳
Exploring WordPress 6.6
WordPress 6.6 を紹介する動画が Learn WordPress に公開されています。
英語でもわかりやすいですが、日本語で見たい方のために書き起こしの日本語訳を置いておきます。
書き起こしの日本語訳
生成 AI による翻訳を人力で調整したものです。
00:00- イントロダクション
こんにちは、 Learn WordPress へようこそ。 WordPress 6.6 でリリースされた新機能や改善点をいっしょに探っていきましょう。
00:09- データビューの改善
まずは新しいデータビューの改善点について説明します。 サイトエディターを開いてページをクリックすると、新しいレイアウトがページ用に作成されていることに気づくでしょう。 ここですべてのページと選択したページのプレビューを新しい横配置のレイアウトで確認できます。 テンプレートをクリックすると、デフォルトですべてのテンプレートがグリッドビュー表示されるようになりました。 表示オプションアイコンをクリックすると、表示をテーブル形式やリスト形式に変更できます。 リストに変更すると、すべてのテンプレートと右側のプレビューを閲覧できます。 パターンに移動すると、テンプレートパーツセクションがサイドビューの左上に移動し、その下にパターンが表示されるようになったことに気づくでしょう。 すべてのパターンがすぐに表示され、フィルターと「同期のステータス」を使ってカスタム同期パターンと非同期パターンを確認できます。
01:09- 公開フロー
バージョン 6.6 では、公開フローをデザインし直しました。 重要な情報は明確・ミニマルでコンパクトに右上に表示されます。 「アイキャッチ画像を設定」は上に移動し、ワンクリックで設定にアクセスして更新できます。 さらに、ダッシュボードや投稿エディターで新しいページや投稿を作成するときの体験は、サイトエディター内で作成しているときと同じ一貫したものになっています。
01:42- グリッドレイアウトサポート
もうひとつのすばらしい新機能はグリッドレイアウトのサポートです。 グリッドブロックはグループブロックの新しいバリエーションで、グループ内の要素をグリッドとして表示できます。
いまグリッドブロックとダミーコンテンツを追加しました。 デフォルトでは「自動」が選択されています。 「自動」の場合、最小列幅を使用してグリッドの行と列が自動的に生成されます。 列幅の値を変更すると、すべての列が自動的に更新されます。 単位をピクセルに変更し、列幅を 300 ピクセル、それから 200 ピクセルに変更してみましょう。 また、グリッドはレスポンシブであり、タブレットやモバイルフォンなどの小さいデバイスでもこの幅を維持します。
「手動」のオプションもあり、「手動」を選ぶと必要な列数を正確に指定できます。 再び「自動」を選択し、リストビュー内のグリッドの子を 1 つ選択することにします。 それから、サイドバー設定を開き、「列のスパン」と「行のスパン」までスクロールします。 こちらを使うと、 1 列を複数の列にしたり 1 行を複数の行にしたりできます。 「列のスパン」に 3 と入力すると、このグループブロックは 3 列にまたがり、「行のスパン」を 2 に変更すると、このグループブロックは 2 行にまたがります。 列や行を視覚的にドラッグしてリサイズするやり方でも同じことができます。
03:36- ネガティブマージン
次にネガティブマージンの追加について説明します。 マージン制御をサポートするすべてのブロックに対して、エディター内でネガティブマージンを直接追加できるようになりました。 ネガティブマージンを設定すると、重なり合うデザインをかんたんに作成できます。 例を 2 つ見てみましょう。 ひとつめの例では、見出しブロックの左マージンを -180 ピクセルに変更します。 ふたつめの例では、段落ブロックの上マージンを -100 ピクセルに変更します。 ご覧の通り、ネガティブマージンを使用するとさまざまなデザインの可能性が広がります。
04:21- 同期パターンの上書き
次に紹介する興味深い新機能は、同期パターンの上書き(オーバーライド)です。 念のために説明すると、同期パターンとは編集されるとすべてのインスタンスで更新が反映される再利用可能ブロックです。 今回、その同期パターンのスタイルの制御を維持しながらコンテンツをカスタマイズできるようになりました。
どのように機能するかをお見せします。 パターンを中央で作成し、それをサイト内の複数のページで使用できます。 パターンのコンテンツは個別にカスタマイズできますが、そのデザインを更新する場合は元のパターンで行う必要があります。 中央のデザインを変更すると、パターンが追加されているすべての場所で更新されます。
これを実際に見てみましょう。 この例では、チームメンバーの同期パターンを作成しました。 上書き機能を有効にするには、関連するブロックを選択する必要があります。 見出しブロックを最初に選択しましょう。 サイドバー設定の「詳細設定」に移動し、上書きを有効化します。 適切な名前を付けます。 この場合は「 Team Member Name 」とし、「有効」をクリックします。 続いて、隣の画像ブロックに移動し、上書きを有効にして、わかりやすい名前を付けます。 同じプロセスをパターン内の他のすべてのブロックにも適用します。 この段階では、見出し・段落・画像・ボタンのブロックのみ上書き可能です。
06:58- パターンのシャッフル
ワンクリックでパターンをシャッフルできることをご存知でしたか? 似たようなパターンをかんたんに切り替えられるよう、グループブロックなど単一の最上位ブロックでカテゴリが定義されているパターンを挿入すると、シャッフルボタンが追加されるようになりました。 例えば、 About (紹介)カテゴリからパターンを選択してみましょう。 すると、ブロックツールバーのシャッフルボタンをクリックすると要件を満たす別のパターンを表示・選択できます。
07:36- サイトの背景画像
WordPress 6.6 では、背景画像機能がスタイル内のサイトエディターに拡張されました。
背景画像を追加するには、「スタイル」を開いて「レイアウト」に移動し、下部の「背景画像を追加」をクリックして、メディアライブラリから画像を選択します。
追加後は画像を cover
や contain
の背景として表示できます。
背景は repeat
にも設定できます。
08:06- 影の編集・作成
既存の影のカスタマイズやオリジナルの影(シャドー)の作成ができるようになりました。 「スタイル」を開くと、「色」の「下」に影があります。 既存の影スタイルを選択して「ドロップシャドウ」をクリックすると調整できます。 または「カスタム」のプラスアイコンをクリックし、オリジナルの影を作成できます。 もちろん、ブロックによっては「スタイル」の下の「枠線と影」に移動すると影を追加でき、既存またはオリジナルの影を選択できます。
08:45- プラグインの自動更新のロールバック
最後に、プラグインの自動更新についてかんたんに触れましょう。 プラグインの自動更新の利便性を問題発生時のロールバックの安全性とともに楽しむことができるようになりました。
結び
創作を楽しみましょう。 WordPress 6.6 の探索と使用を楽しんでください。
関連ページ
- WordPress Block Bindings API でブロックにひもづいたカスタムフィールド編集を試す
- WordPress のブロックの同期パターンのオーバーライドを試す
- WordPress 6.6 で導入されるセクションスタイル機能を試す
The original and this work are licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.