Featured Collection Mobile Responsive

Shopify Discussion
1

Hello,

The featured collection in the Dawn theme is not mobile-responsive. It looks perfect on a laptop/desktop, however, the mobile view is not scaling. Is there any fix to this?

URL: https://www.landscapesupplyguys.com/

Theme: Dawn

Please find attached images.

EquipmentGuys_0-1688154324027.png
EquipmentGuys_0-1688154324027.png999Ă—721 378 KB

EquipmentGuys_1-1688154323781.png
EquipmentGuys_1-1688154323781.png727Ă—999 280 KB

Thank you.

1 Like
2

Hello @EquipmentGuys ,

I am Gina from flareAI app helping Shopify merchants get $6Million+ in sales from Google Search, on autopilot.

If the featured collection section in your Shopify store’s Dawn theme is not responsive or scaling properly on mobile devices, you can follow these steps to address the issue.

→ Double-check the theme settings to ensure that the featured collection section is enabled for mobile devices. Some themes have separate settings for desktop and mobile views, so make sure the section is enabled for both.

→ To ensure optimal display on mobile devices, it is important to use images of the correct size for your featured collection. For the Dawn theme, the recommended image size for mobile is 800 x 800 pixels. By using images of this size, you can achieve the best visual presentation for your featured collection on mobile devices.

→ Within the Dawn theme, locate the settings specifically related to the featured collection section. Look for options related to responsiveness or mobile display. Adjust these settings to ensure proper scaling on mobile devices.

->Media queries enable you to define the appearance of your website based on different screen sizes. By incorporating media queries into your theme’s CSS, you can instruct it to appropriately adjust the featured collection section for mobile devices, ensuring proper scaling and display.

→ If you have customized your theme or installed third-party apps that affect the featured collection section, review their settings. Sometimes, these customizations or apps can interfere with responsiveness. Temporarily disable any customizations or apps to check if they are causing the issue.

→ If the previous steps don’t resolve the problem, you may need to make adjustments to the theme’s code. It’s important to create a backup of your theme before making any changes. Follow these general steps:

  • From your Shopify admin, go to Online Store > Themes.

  • Find the Dawn theme and click on “Actions” > “Edit code”.

  • Look for the section that controls the display of the featured collection. It might be located under the “Sections” or “Snippets” folder, depending on the theme’s structure.

  • Review the code and search for media queries or styles specific to mobile display. Make the necessary adjustments to ensure proper scaling and responsiveness.

  • Save the changes and preview your store on a mobile device to see if the issue is resolved.

If you’re not satisfied with code modifications, consider seeking help from a Shopify Expert or contacting the theme developer. They can provide more specific guidance based on your store’s configuration and theme details.

Please don’t hesitate to reach out if you require any additional assistance.

Gina