WordPress の「表示オプション」パネル（多くの管理画面一覧の右上にある小さなタブ）では、表示する列を選べます。しかし、その設定がデスクトップでしか効かないことは教えてくれません。WordPress 自身の 782px のブレークポイント以下では、表示オプションの設定に関係なく、行のメインタイトル以外の列はすべて、タップで展開する切り替えの中に折りたたまれます。
2 つの別々のニーズと 1 つの設定
デスクトップでの表示とモバイルでの表示はまったく別の問題です。電話の合間にスマートフォンで注文一覧を確認する管理者は、デスクトップで表全体を見る人よりはるかに少なく、厳選された列を必要とします。WordPress のコアにはこの違いを表現する仕組みがなく、「表示」を 1 つの共通の状態として扱います。
モバイル専用の 2 つ目の設定パネル
注文一覧の上に、折りたためる小さなパネル Also show on mobile… を追加しました。標準の表示オプションとは別に、同じ切り替え可能な列（ステータス、合計、携帯電話番号、配送業者の取引 ID など）を並べ、デスクトップ用にすでに選んだ設定に加えて、スマートフォンで表示し続ける列をチェックボックスで選べます。
設定はサイト全体で一度保存され、WordPress のモバイル用ブレークポイントに限定して動的に生成される CSS で反映されます。選択した列には display: table-cell !important のルールが個別に適用され、その列だけプラットフォーム標準の折りたたみを上書きし、選ばれていない列は通常どおり折りたたまれます。
最初は折りたたまれている理由
パネル自体は常に表示するのではなく、小さな切り替えリンクの奥に隠しています。めったに使わない設定であって毎日使う操作ではないうえ、注文一覧を開くたびに常に開いた設定欄があると、この機能がスマートフォンで防ごうとしている散らかりをまさに生んでしまうからです。
ポイントのまとめ
- WordPress のレスポンシブな列の折りたたみは強力で、初期状態では設定できません。サイトオーナーが表示オプションで明示的に選んでいても、データを隠してしまいます。
- デスクトップとモバイルの表示は別々の判断であり、1 つの設定に二役を担わせるのではなく、別々のコントロールを用意すべきです。
- めったに使わない設定は、便利なものでも初期状態では折りたたんでおくべきです。コントロールの目立ち具合は、使う頻度に合わせるべきです。
関連記事：注文プレビュー画面を拡張する、注文追跡ページをリデザインする。
ご自身の WooCommerce や WordPress の管理画面で同じような制約にお困りですか？ご相談ください。ArtinTech Solution はまさにこうしたストア向けのカスタムツールを開発しています。