バリアントピッカーをスクロールにする

[umki]

お世話になっております。

prestige テーマを使用しております。

表題の通り、バリアントピッカーやメタフィールドを使用したproduct variationsなどで10色（商品）以上を紐づけるとバリエーション（商品サムネイルやカラーピッカー）が折り返されて２列や３列になります。

スクロールタイプの表示にしてすっきりとさせたいですがテーマ内では難しいようです。

しかし当方、liquidやCSSなどに不慣れで初心者レベルです。

恐れ入りますが初心者でもわかりやすく解説してくださる方がいらっしゃいましたらご教示頂けますと幸いです。

（コードの挿入位置などもご指示いただけますと嬉しいです。）

よろしくお願いいたします。

[株式会社フルバランス]

Umki様

ご質問を確認いたしました。

以下の添付のようなイメージでしょうか？

こちらcssの調整でスクロール形式にできます。

上記のバリエーションを囲んでいるクラス（おそらくColorSwatchList）に対して以下のcssを適用すると良いかと存じます。

.ColorSwatchList {
white-space: nowrap;
overflow: auto;
}

挿入するファイルは後尾に.cssがついているファイルになります。

ご参考までに。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

[umki]

ご回答ありがとうございます。
恐れ入りますが、「挿入するファイルは後尾に.cssがついているファイルになります。」
という部分がよくわかりません。

cssのコード追加をする場所は[テーマ] >[カスタマイズ]>[テーマ設定] >[カスタムCSS]で認識あっておりますでしょうか？

（こちらにいただいたコードを追加、保存しましたが、スクロール形式にはなりませんでした）