😍

これは⭐️⭐️⭐️⭐️⭐️の仕事です。 STELLARモックアップ、大好きです。 これはまさに、ブロックファーストUIで実現できることを望んでいる種類の豊富なレイアウトです。

CC： @melchoyceは、今年後半のカスタマイズの焦点としてこれを見たいと思うでしょう。

V1エディターの場合、このような列は範囲外です。 それは「ノー」ではありません。むしろ、本当に興味深いものに取り組む前に、まずしっかりした技術的基盤が必要です。 しかし、それはV1.1かもしれませんし、少なくともその年の後半のカスタマイズの人々にとっては何かかもしれません。 その前でも、プラグインがこれをさらに早く追加できるように、このUIを念頭に置いておくとよいでしょう。

これありがとう！

私のフィードバックは、これがエディターをコンテンツ編集ツールではなくレイアウトツールに変え始めるということです。 レスポンシブデザインのようなものはCMSでのレイアウト制御を非常に難しくし、IMHOはテーマデザイナー/開発者に任せるのが最善です。 「2列」のようなオプションは確かにわかりましたが、実際に仕切りをドラッグして基本的にユーザーがコンテンツをレイアウトできるようにすることは、コンテンツエディターツールの範囲外のようです。

その哲学がプロジェクト・グーテンベルクの見方と一致しているかどうかはわかりませんか？..

これらもギャラリーにとって面白いアイデアだと思います。 現在の固定列アプローチを維持したくない場合があり、行に異なる量の列を含めることができます。 テキスト列と同じように、優れたギャラリーブロックは、非常に複雑になる可能性があるもののように聞こえます。

その哲学がプロジェクト・グーテンベルクの見方と一致しているかどうかはわかりませんか？..

今年の後半には、カスタマイザーに焦点が当てられます。

カスタマイザーは、最初はエディターを支援し、次にそれらの基本的な構成要素を、サイドバーや場合によってはテーマ全体を含め、post_contentの「箱から出して」カスタマイズできるものに移行します。

列はその一部である可能性が非常に高いです。

グーテンベルクは、何よりもまず投稿を書き、レイアウトするためのものです。 それが私たちが正しくしなければならないことです。 しかし、特にいくつかのブロックに関しては、エディターは後でカスタマイザーとDNAを共有する可能性が高く、おそらくコントロールも同様です。 そのため、このモックアップは、カスタマイズの焦点に引き続き役立ちます。

非常にエレガントなソリューション。 たくさんの列ブロック、IMOをドロップするよりもずっと気分がいいです。 また、列幅が特定のパーセンテージにスナップしていることもわかります（つまり、50％/ 50％、または33％/ 66％、または25％/ 75％など）。 列は、ほぼ確実に、更新されたカスタマイザーの機能になります:)

@jasmussenはあなたがそれを気に入ってくれてうれしいです
@simonrjonesがWordPressをデフォルトのブログ投稿からさらに拡張すると、プレゼンテーションページに複数列のレイアウトが必要になることが自動的に
@melchoyceは間違いなく、列幅が特定のステップにスナップする必要があります（6列または12列のステッパーであっても）。

列スナップをテーマに依存させる方法を見つけられるかどうか疑問に思います。 グーテンベルクが進歩するにつれて、私たちは今後数ヶ月で熟考したいと思うでしょう。

列のスナップとCSSグリッド（レスポンシブ部分を含む）の両方の点でデフォルトがあるはずです。 次に、テーマはそれらをオーバーライドできる必要があります。

TinyMCE Editorに統合されたプラグインにすでに取り組んでおり、これらの動作の一部を共有しています。これは、ドラッグアンドドロップブロックベースではなく、行/列のアプローチであるということだけです。 これはGridableと呼ばれ、試してみる価値があるかもしれません。

私から+100。 私は列ブロックのアイデアが本当に好きです。

これはCSSグリッドの候補ですか？

https://css-tricks.com/getting-started-css-grid/

私のコメントを明確にしてくれてありがとう。

CSSグリッドは素晴らしく、列のレイアウトに非常に適しています。 ただし、ワイドブラウザのサポートはしばらく先にあると思います。これはWPの問題になる可能性があります（現在、最新のFirefoxで動作します）。 レイチェル・アンドリューのサイトにあるCSSグリッドに関するいくつかの非常に優れたリソースと、ジェン・シモンズのサイトにあるいくつかの素晴らしいリソース。

何らかの形で列を追加することは、HTMLだけでなくCSSも意味するため、理想的には、テーマ開発者が簡単に使用できるように、これには単純で標準ベースのパターンが必要です。 これをコードにカプセル化して、デフォルトの開始点を定義し、それをオーバーライドすることができます（たとえば、誰かがFoundationを使用してサイトを構築したい場合、Foundationの方法で列を設定する必要があります）。

私が聞いた経験則は次のとおりです。

• サイト構造/レイアウトのグリッド
• そのレイアウト内のコンテンツ用のFlexbox

レイチェルアンドリューによるフレックスボックスとグリッドに関する優れた記事： https ：//rachelandrew.co.uk/archives/2016/03/30/should-i-use-grid-or-flexbox/

WordPressの現在のブラウザー互換性要件に基づくと、デフォルトのシステム（BootstrapやFoundationなど）としての標準の「行+列」グリッドが、シンプルさと柔軟性の最適なバランスを提供すると思います。

私は、標準の行+列の構造が進むべき道であることに同意します。

WordPressの設定でグリッドシステムを選択するオプションがあればいいのにと思います。

• ディフォルト
• ブートストラップ
• 財団
• カスタム

デフォルトのグリッドシステムには、CSSのサポート（TwentyEighteenテーマの一部として？）が含まれますが、他のオプションはCSSのテーマに依存します。 基本的に、WordPressはグリッドクラスを出力し、テーマはスタイルを提供します。

カスタムオプションを使用すると、行と列のクラス名を設定できます。 私が説明しているもののUIの詳細な比較は、現在のパーマリンク設定画面です。

複数列のレイアウトは必須です！ 現在、グーテンベルクは問題を解決していません。 それでも、コンテンツの1つの長い列ができあがります。 ページビルダーが非常に人気があり、何十万人もの人々がページビルダーを使用している理由は、複数列のレイアウトを簡単に作成できるためです。 この機能がなければ、ページビルダープラグインでGutenbergを使用する理由はありません。

@maddisondesignsはい、V2では複数列のレイアウトを行う予定です。 それらの基本的な作業は現在V1で行われています。 実際、ブロックの基になるパーサーはネストをサポートしていますが、ネストされたブロックを表示するためのUIがまだ実装されていないだけです。 ＃428も参照してください。

@westonruter計画されていると聞いて

コラムが欲しいという興奮と緊急性に感謝します。 私たちは同じ緊急性を感じています。 これは、列が不要なことではなく、この時点で純粋にリソースを管理することです。 私たちはそれに到達します、それは絶対にメタゴールです。 指をパチンと鳴らしてそれを実現できれば;）

柱がなくても、グッテンベルクは大きな前進であり、私は非常に感銘を受けましたが、柱を含めることはV1にとって不可欠であり、その機能が準備できるまでV1を遅らせる価値があることに同意します。

上位3ページのビルダーと.orgの列プラグインの最初のページのアクティブインストールを追加すると、150万を超える量が得られます...プレミアムを追加すると、その半分ではありません。 重要なのは、列のないエディターが現在のニーズを満たしているとは思わないということです。 Guttenbergが列なしでリリースされた場合、初日にそれらを追加するために12個のプラグインが表示されると思います。 その後追加すると、ユーザーは管理するものがあります。

グッテンベルクは素晴らしく破壊的ですが、基本的な構成要素がすべて整っていることをお勧めします。 興奮と緊急性に+1。

グーテンベルクの複雑なレイアウトの「サポートが必要」という概念に挑戦したいと思います。

提案されている列とネストの組み合わせは、ユーザーエクスペリエンスが実際にコンテンツを作成する人にとって本当に悪いものになるまで終わらない、うさぎの穴です。 「本格的な」ページビルダーは、これを証明しています。

誰もがページビルダーを使用してレイアウトを作成するわけではなく、データベースにそのようなページ構造を含めることは非常に問題があります。 グーテンベルクを拡張するための優れたAPIを用意することに焦点を当て、グーテンベルクのコアに複雑な機能を追加することには十分注意する方がはるかに良いでしょう。

@ khromov-私のコメントに返信しているようです。 私は、複雑なレイアウト、ネスト、またはフルページビルダーではなく、列を提唱しています。 コンテンツを書くときに列が必要になることがあります。 私はショートコードの使用を拒否しているので、2つの選択肢があります。ネストされたdivを手動で作成します。これは、ひどいユーザーエクスペリエンスであり、実際にコンテンツを作成するのに非常に気が散ります。または、通常はやり過ぎのページビルダーを使用します。 列を使用することは非常に一般的であり、おそらくビデオを埋め込むよりも一般的だと思います。

いずれにせよ、私の理解では、列はロードマップ上にあります。 V2ではなくV1で見たいのですが。 あなたのように、私は良い基盤を築くために注意が払われていることを感謝します。

覚えておくべき「列」の側面の1つは、デスクトップレイアウトの問題だけではないということです。 モバイルからデスクトップまで拡張できるシステムを備えています。

CSSではcolumn-countですか？ これを使用すると、レスポンシブなものをすばやく作成するのは非常に簡単ですが、特定のブレークポイントで目的の列にコンテンツを配置することはできません。

CSSグリッドですか、それともフレックスボックスですか？ 次に、ユーザーが適切なレスポンシブオプションを使用できるようにして、デバイス間で結果を予測できるようにします。それだけでなく、WordPressテーマにこれらの機能を知らせて、それに応じて適応できるようにします。

列が必要なことはわかっています。 実際、サードパーティのプラグインは今日、列ブロックを構築できます。 しかし、これは複雑な機能であり、機能するために適切に配置する必要のある多くの側面があり、プロジェクトへの貢献者がいなければ、V1で発生する可能性はほとんどありません。

@ jasmussen-はい。 コラムがロードマップに含まれていることを感謝します。おそらく、ギャラリーブロックからいくつかの洞察が役立つでしょう。

この機能は、最新のレイアウトツールを念頭に置いて構築する必要があります。 列レイアウトを作成するために不要なコンテナを作成すると、将来的に最新のテクノロジーを使用する能力が制限されます。

列のような単純な1次元レイアウトの場合、フレックスまたはグリッドのいずれかを使用できます。 今日は柱について話しているだけですが、将来的にはユーザーはより高度なグリッド制御を必要とするため、今すぐ基礎を築く必要があるという単純な理由で、グリッドに傾倒しています。

ブラウザのサポートに関しては、フレックスとグリッドの両方が最新のブラウザで幅広くサポートされており、古いブラウザでは完全にフォールバックします。 古いブラウザにフォールバックを提供することも比較的簡単です。

これを機能させるために要素をネストするという古典的なフレームワークアプローチを採用することは強くお勧めしません。 その結果、ほとんどすぐにレガシーコストが発生し、将来のレイアウト作業が妨げられます。

ここでグリッドを採用することで、レイアウトが関係する未踏の領域への扉が開かれます。 来週は、ここで何ができるかについてもっと包括的なことを書く時間を見つけようと思います。 それまでの間、これは関連性があります： https ：

これに関する私の懸念は、ユーザーを1つの特定のタイプのHTML構造にロックすることです。 その後、すべてのテーマをこの構造をサポートするように適応させる必要があります。 ネストされたdiv sですか？ ネストされたsection s？ 後方互換性のためにfloatを使用しますか（多くのサイトがそれを必要としているためです。Win7は依然として巨大な市場シェアを持っています。つまり、IE11も同様に機能し、IE11はflexboxうまく機能しません。 ）、または将来のためにflexbox/gridを使用します。 ユーザーに変更するオプションを提供しますか（その後、CSSを知っている必要があります）？ これはすぐに危険になる可能性があります。

コンテンツにはネストされたブロックが含まれますが、レンダリング用に生成されるマークアップは、テーマによって決定される可能性があります。

代わりに、グーテンベルクは、ネストされたブロックを追加するための機能とUIを提供することに焦点を当てるべきだと思います。これにより、開発者は列などのカスタムブロックを作成できます。 グーテンベルクはグリッドを気にする必要はありません。グリッドはテーマが制御する必要があるものだからです。

@ westonruter add_theme_support()介して、テーマでオーバーライドできるようにすることが重要です。

私からの巨大な+1、これは非常に人気のある機能になります。

これは、Gutenbergデータを生のHTMLとして保存してはいけない理由の良い例です... mobiledocなどの標準準拠のメソッドで保存された場合、列は単にオブジェクトになり、レンダリングは次のように簡単にオーバーライドできます。任意のテーマ。 テーマがrow / colなどのレガシー構造を使用したい場合は、使用できます。 グリッドを使用したい場合は、使用できます。 フレックスを使用したい場合は、使用できます。 彼らが次に来るどんな技術でも使いたいなら、彼らはそうすることができました。 真のオブジェクトストレージメソッドは、コンテンツを将来にわたって利用できるようにします。 HTML +コメントはできません。

+1この機能は誰にとっても非常に重要です。

大きなB2BWebサイトを再設計する準備をしています。 現在はDiviを使用しており、再設計にGutenbergを使用できるようにしたいと思っています。そうしないと、何年もの間Diviを使い続けることになります。

列がアドレス指定されていない場合、WPサイトを構築するための「非WordPress」アプローチを続行することを余儀なくされます。 また、グーテンベルクが互換性のないテーマをオーバーライドし、基本レイアウトを含めるために、いくつかの「ページレイアウト」プリセットを含めるかどうかにも興味があります。

Flexboxベースのグリッドをお願いします。 変更にはコンテナCSSの更新が必要なため、CSSグリッドではありません。 Flexboxは、ブロックを追加するだけで機能します。 ありがとう。

絶対にこの機能が大好きです。 ここでの素晴らしい議論、それがどのように発展するかを見るのを楽しみにしています。

これ大好き。 特に列のサイズを変更する機能。 レイアウトをコントロールできるのが特に気に入っています。 これは弱点ではないと思います。 他の多くの同様のツールがこの機能を提供していることを考えると、それはまさに私がグーテンベルクで望んでいたことであり、私がまだできないことに不満を感じています。

そこで、Gutenbergプラグインを更新して、列をいじってみました。 新しい投稿を作成して列レイアウトブロックを追加し、スライダーを使用してそれを増やしてみました。 これを実行しようとすると、「このブロックでエラーが発生したため、プレビューできません」というエラーが表示されます。

バグレポートをありがとう、 @ mhenrylucero —私はそれのために別のチケットを開きました＃3710。

3745は今週初めに統合され、ここで提案を部分的に実装しています。

私の知る限り、残りのタスクは、ブロックを列レイアウトに再配置することでUXが大幅に改善されていますが、正しいですか？ これが最初のマージ提案に続くカスタマイズの焦点により適していると仮定するのは正しいですか？

これを閉じます。これは、カスタマイズをさらに改善するための参照として残ります。