モバイルサブカテゴリを移動しますか？

[TheDarkWizard]

皆さん、こんにちは。

ここ数週間、テーマの作成やテーマの操作について学んできました。移行のこの段階にあり、むしろそれだけにほぼ独占的に集中できる状態だからです。

テーマコンポーネントで素晴らしいクールなことをたくさんやってきましたが、今夜ずっと悩んでいることを解明しようとしています。

モバイルでは、カテゴリページに表示されるサブカテゴリリスト（デフォルトとして注目のトピックを持つカテゴリを使用しています）を、カテゴリタイトルの下、トピックリストの上に移動するにはどうすればよいですか？

[awesomerobot (Kris)]

これには2つの方法があります。HTML自体を変更する必要がある場合は、テンプレートをオーバーライドするしかありません。これは、テンプレートが依存しているものを変更した場合にカスタマイズが壊れる可能性があるため、長期的な保守性には最適ではありません。

もう1つの方法はCSSを使用することです。これは保守が容易なはずです。徹底的にテストしていませんが、探している方法で要素を並べ替えることができます。

.mobile-view .category-list {
  tbody {
    display: flex;
    flex-direction: column
  }
  .subcategories-list {
    order: -1
  }
  tr:first-child { // これはカテゴリタイトルのセクションです
    order: -1
  }
}

これにより、テーブルレイアウトがflexboxを使用するように変換され、兄弟要素をorderで並べ替えることができます。

[TheDarkWizard]

どうもありがとうございます！

必要のないアウトレットへのフックやテンプレートのオーバーライドなどを試みて、自分で複雑にしすぎていました。

これがこれまでの進捗です。（現在、Gracefulをベーステンプレートとして使用し、ユーザーが慣れているものに近づけるために編集を加えています。あなたの修正を使用することで、上記のコードが何をしているのかを理解した後、カテゴリの説明が表示される場所の順序もすぐに変更できました。）

まだ準備はできていませんが、ほぼ完了です。