How to change the layout of product variants on mobile

1 variant per row by default (1 column)

By default, variants/options are displayed one per row. But you can also display them 2 per row. This setting is located in Customize Theme > General Settings > Mobile Tweaks.

2 variants per row (2 columns)

You can see some examples below.

0 variant (only the quantity picker)

1 variant

2 variants

3 variants

You can also hide the variant labels (eg. Sizes, Colors...)

Variant Swatches (instead of dropdowns)

You can also use Swatches (see Add Variant Swatches) instead of Dropdown. In this case, the 2-column layout will be disabled, and the variant(s) will be displayed 1 per row.

• Related Articles

• How to add custom colors into the color swatches for variants/options on the product page

  When I add a single color name like red, green it works fine but when the color name is like dark grey, indigo blue it's not showing up any color? You need to create custom colors from theme settings. If you want to define the Dark grey color, please ...

• Hide variant dropdown on the product page when there is only 1 option (1 variant)

  You can hide variant dropdown on the product page when there is only 1 option (1 variant) in the Konversion theme. Go to Customize Theme > Product Pages (section) > Scroll to Hide variants with only one option

• Latest releases of the Konversion theme

  Versioning logic - Version X.Y.Z X means a major change in theme due to a change in Shopify's core Y means a big enough change that involves new key features and/or big change/fix X means small bug fixes and small features release. Make sure you have ...

• Display Trust Badges in your Product Pages of your Shopify Store

  With the Konversion theme, you can upload your own trust icons, and now you can also upload your own image for trust/security/conversion badge.  By default, we provide the trust badge image below for free. But you can change the trust badge image and ...

• Move the Add to Cart form above or below the product description on mobile

  Go to Customize Theme > Browse to any product page > Product page section You can also enable the Sticky Add to Cart button on mobile.