テーマEnvyのCollectionlistのモバイル表示を1列から2列への変更について

[uchinoko]

皆様
初めまして。

現在、Envyというテーマを使用して、ページ作成をしております。
そこで、カテゴリーページを使用しようと思ったのですが
通常の設定ですと、モバイルは1列になってしまっているので
2列にする方法がございましたらご教示いただけると幸いです。

よろしくお願い申し上げます。

 

[uchinoko]

投稿者です。

こちらを編集するとモバイルのみ2列にできたりしませんでしょうか・・・

助けてください。お願い申し上げます。

[Jizo_Inagaki]

多少興味がありましたのでEnvyを使っているストアのソースを見て試したところ、おそらく以下の記述をCSSに追加いただければ動作はするかなと思います。

@media (max-width:767.98px){
  .homepage-sections-wrapper .collection-grid .col-md{
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
}

※多少余分な記述に見える部分はありますが、メディアクエリで768px以上の際に適用されるCSSに沿って記述しています。
※より良い方法があるかもしれませんので、最前の方法ではない点をご了承ください。

なお、上記は別ストアを参考に開発者ツールで確認しただけなのと、他の要素への影響は確認していません(一応限定的に適用されるように意図してはいますが)。
そのためこの記述で解決できないか問題が起きる場合は、以下の方法を検討ください。

1. このまま他の方の回答を待つ
2. カスタマイズで設定が変更できるかどうか確認する
3. テーマのドキュメント内を探す(https://support.weareeight.com/hc/en-us/categories/360003661238-Envy )
4. テーマ制作作者に質問する
5. エキスパートやパートナーに依頼する
6. 英語フォーラムで質問する(※1)

(※1)日本フォーラムよりも回答者の数が遥かに多く、テーマの中身を把握している方がいる可能性も高いため

以上ですが、対象が有料テーマの場合は無料テーマに比べて回答できる方の数が減ると思いますし、上記の2以降の方法をまず試されることをお勧めします。