SmartSize provides flexible layout options to ensure your size charts look great on all devices. You can customize the size chart width and choose how information is displayed on desktop and mobile views. Here's how to adjust these settings:
Note: This setting is applied at the size chart level. Changes will only affect the size chart you are currently working on and will not impact the layout of your other size charts.
1. Adjust Size Chart Width on Desktop
You can choose from four size options to control how wide the size chart appears on desktop screens:
- Small: For a compact, minimal appearance.
- Medium: A balanced width for most stores.
- Large: Gives the size chart a more prominent display.
- Maximum: Expands the size chart to the full width of the available space.
Simply select the desired width by clicking on one of the options. The chart will automatically adapt to mobile devices regardless of the desktop width.
2. Customize Layout on Desktop
- In the Layout on Desktop section, select how you want the size chart elements (table, images, and text) to be arranged.
- Use the dropdown menu to organize the order of elements. For example:
- Table | Image | Text: Displays the table first, followed by an image, and then any additional text.
- You can reorder these components to match the flow of your store’s design.
3. Customize Layout on Mobile
- In the Layout on Mobile section, adjust how the size chart is presented on smaller screens.
- Like the desktop layout, use the dropdown menu to arrange the order of the table, image, and text for an optimized mobile experience.
Tips for an Effective Layout
- Keep it Simple: Use a clean layout with the table displayed first, as customers typically look for size details immediately.
- Preview Your Layout: Test how the size chart looks on both desktop and mobile directly in your live store. Keep in mind that the preview within SmartSize may not always be fully accurate, as it doesn’t inherit your store’s theme styles.
This article might be important for you:
Why is the first column wider than the rest of the columns?