FSEアウトリーチラウンド＃2：グーテンベルクのサイトエディターを使用したカスタムホームページの構築

Anne McCarthyは、フルサイト編集（FSE）アウトリーチプログラムの第2ラウンドのテストを発表しました。 テストの呼び出しでは、ユーザーがGutenbergプラグインのサイトエディターからホームページを作成するように求められます。 フィードバックは3月5日まで開いています。

テストの最初のラウンドは2020年12月に始まり、先月終了しました。 テスターは、ブロックエディターのテンプレート編集モードでいくつかの問題点を特定することができました。 このプログラムは、グーテンベルクの開発者が改善に取り組むことができる実用的なアイテムを作成しました。

この第2ラウンドも同様です。 ただし、テストははるかに大きく複雑な領域を対象としています。 ユーザーは、使い慣れたブロックエディターを離れ、サイトエディターに移動します。サイトエディターは、実行可能な製品になるまでにはまだ数か月かかります。

マッカーシーは、ホームページを構築するための22ステップのプロセスをリストしました。 ほとんどついてきましたが、飽きてしまいました。 これが私が貧しい被験者のために作る理由の1つです。 私は自分で何ができるかを探求して見るのが好きです。 アイデアがあれば、実行してみたいと思います。 少し順序が狂っていたとしても、私は主にスクリプト全体に固執しました。

最終的に、The Grilled Cheeseというレストランのカスタムホームページを作成しました。WordPressコミュニティを離れる場合は、このレストランを現実の世界で確実に開くでしょう。

それはかなり簡単です。 とにかく、この段階に到達するまでに、さまざまな概念を試してみるのに約2時間かかりました。 私が満足する何かを構築するために、さらに数時間かかったでしょう。

全体として、自分の理想的なホームページのレイアウトには限界があると感じました。 各ステップは、ツールとの困難な戦いでした。 HTMLとCSSを使えば、これを半分以下の時間で構築できたはずです。 WordPress用の他の最新のページビルダープラグインでも同じことを行うことができます。

私のテストの結果に飛び込む前に、私はいくつかの残忍な正直さを持っています。 FSEアウトリーチテストに使用されるテーマであるTT1ブロックは、嗅ぎタバコではありません。 テーマは、サイト編集者がエンドユーザーの手に設定する多くの可能性を確実に処理しません。 この全体の経験は、より良いテーマでよりスムーズにすることができます。 ただし、選択肢は限られており、現時点でより適切なブロックベースのテーマを使用できるかどうかはわかりません。

サイトエディタとフロントエンドの間には非常に多くの不整合があったため、それらすべてをリストすることにはほとんど意味がありません。 間隔が大幅にずれていました。 私は一般的にそれをテーマの問題として見ています。 私は多くの時間を試行錯誤モードで過ごし、エディターで調整を行い、フロントエンドの結果を確認するために更新しました。 リンス。 繰り返す。

課題の特定

この投稿はサイト編集者にとって批判的ですが、それは経験が完全に貧弱だったことを意味するものではありません。 毎週改善が見られるので、WordPressに市場のあらゆるものに匹敵するサイトエディターができることを期待しています。 最終的。 ただし、ここでの私の目標は、チームが使用できる実際のフィードバックを提供することです。

前述の一般的な間隔の問題以外に、カスタムホームページを作成する際にいくつかの障害を特定しました。

最大幅

サイトエディタを使用してフルサイトページをデザインする場合、1つの問題が最も目立ちました。 WordPressには、バランスの取れた「最大幅」システムがありません。 ユーザーとして、ホームページのコンテンツ領域の幅を設定する際の選択肢はほとんどありませんでした。 現在、テーマの作成者は、カスタムコンテンツ、ワイド、およびフル幅を設定できます。 ただし、このシステムはひどく制限されています。 これを使用して作成者が実行できるテーマはそれほど多くありません。この問題により、ブロックエディターとサイトエディターの両方でユーザーが実行できることが直接制限されます。

以前、テーマの作成者がカスタマイズできるデザインフレームワークの必要性について書きました。 Tailwind CSSには、ボートロードの柔軟性を提供する最大幅システムがあります。 WordPressは、これらの最新のデザインフレームワークからアイデアを借り始める必要があります。

ブロックアイコンを追加

デフォルトのコンテンツ領域の要素の間にカーソルを合わせたときに「ブロックの追加」アイコンを表示するのは大変でした。 マウスを表示するには、マウスを完璧な位置に配置する必要がありました。 ほんの少しの動きでもアイコンが再び消えてしまうという欲求不満の練習でした。

トップツールバーモードに切り替えると、これがはるかに簡単になりました。 デフォルトのブロックツールバーがある程度それを隠していたと思います。 このモードに切り替える際の問題は、ツールバーの選択肢が保存されなかったことです。 サイトエディタに戻るたびに、もう一度有効にする必要がありました。

クエリブロック

カスタムホームページに投稿を掲載する上で最も苛立たしい点は、制限を設定することでした。 数を3に設定したかった。 ただし、Queryブロックにはこれを行うためのオプションがありません。 最終的に、カテゴリフィルタを使用して偽の制限を作成し、投稿が2、3個しかないものを選択しました。

更新：コメントでニックが指摘したように、制限を設定することが可能です。 ツールバーには、ページあたりの投稿数、オフセット、最大ページ数を設定するための「設定」アイコンがあります。 これらの特定のクエリ設定がサイドバーの他の設定と分離されている理由がわかりません。 それらをグループ化する方が理にかなっています。

Queryブロックのもう1つの紛らわしい側面は、キーワードフィルターです。 私の知る限り、WordPressは「キーワード」という用語を使用したことがありません。 SEOプラグイン以外では、このフィルターの機能に関するコンテキストはないようです。 検索キーワードのように機能すると思います。

すべてのブロックのグローバルスタイル

[グローバルスタイル]パネルに切り替えると、ブロックレベルでスタイルを適用すると、一部のブロックが欠落していることに気付きました。 特に、LatestCommentsブロックのスタイルを調整したかったのです。

リストには、タイポグラフィ、色、その他のデザイン関連のオプションを含むブロックのみが表示されると思います。 これは、サイトエディターがWordPressにアクセスしたときに、エンドユーザーを混乱させる可能性があります。 すべてのブロックには、ユーザーがカスタマイズできるスタイルオプションが必要です。

全幅の列はありません

ホームページのコンテンツとして、全幅のColumnsブロックを作成しようとしました。 ただし、それぞれ66.67％と33.33％を占めるにもかかわらず、2つの個別の列のサイズは制限されていました。

これはテーマの問題のようです。 また、これは、最大幅をより直接的に制御することが役立つ場合の1つであると主張します。 テーマの全幅と全幅の間にあるものが本当に欲しかった。

注目の画像

Post FeaturesImageブロックによって出力される画像のサイズを設定する方法はありません。 現時点で均一なサイズを取得する唯一の方法は、WordPressにアップロードする前に画像を事前にトリミングすることです。

これが本質的にImageブロックのバリエーションであってはならない理由はありません。 注目の画像に必要なのは、投稿にリンクするオプションだけです。