Re: Website width too large on desktop
Hello @meggriffin!
The new Shopify themes are certainly amazing! I can see that it might not be obvious where the settings for the section widths for this theme sits - but no worries, you can easily update the width for your sections via the theme customiser! Here’s a step-by-step guide to do this:
- Open the Theme Customizer for the theme where you would like to update the section width settings as directed in the screenshot below:
- Now, identify the section where you want to make the edits. As an example, let’s pick the Hero section for the theme. Click on the section name, and you should see some settings appear as shown below:
- Now, within settings, you should be able to find a property called Width. Please ensure this is set as “Page” and not “Full. This will ensure that the elements in this section will occupy the defined page-width, which would be standard across all sections.:
Note: On the Hero section specifically, the background image is intended to stretch to full-width. You would note there isn’t a setting for the same.
For all other sections that have media, let’s check one more thing – for every media block, along with width, which we have now set to “Page” instead of “Full”, you should also be able to see a setting called “Extend media to screen edge”. Let’s ensure that this is toggled off. As an example, from the “Media with Text” section, I have modified the width settings like so:Save your updates, and we’re done! Now, sections on your Tinker theme should go from looking like this:
https://drive.google.com/file/d/13TD_DmFIcSOuu_OwwIJLGUqeSe0h-wEf/view?usp=sharing
To looking like this:
https://drive.google.com/file/d/1e56oR8lN9HwD9ZMvjv98l9CrU6yne4Q7/view?usp=sharing
If my response helped you, please consider giving it a like (👍) and marking it as an accepted solution if it resolved your issue. Your feedback helps other community members with similar questions.
Regards,
Aaryan from Swym
Hello @meggriffin!
The new Shopify themes are certainly amazing! I can see that it might not be obvious where the settings for the section widths for this theme sits - but no worries, you can easily update the width for your sections via the theme customiser! Here’s a step-by-step guide to do this:
- Open the Theme Customizer for the theme where you would like to update the section width settings as directed in the screenshot below:
- Now, identify the section where you want to make the edits. As an example, let’s pick the Hero section for the theme. Click on the section name, and you should see some settings appear as shown below:
- Now, within settings, you should be able to find a property called Width. Please ensure this is set as “Page” and not “Full. This will ensure that the elements in this section will occupy the defined page-width, which would be standard across all sections.:
Note: On the Hero section specifically, the background image is intended to stretch to full-width. You would note there isn’t a setting for the same.
For all other sections that have media, let’s check one more thing – for every media block, along with width, which we have now set to “Page” instead of “Full”, you should also be able to see a setting called “Extend media to screen edge”. Let’s ensure that this is toggled off. As an example, from the “Media with Text” section, I have modified the width settings like so:Save your updates, and we’re done! Now, sections on your Tinker theme should go from looking like this:
https://drive.google.com/file/d/13TD_DmFIcSOuu_OwwIJLGUqeSe0h-wEf/view?usp=sharing
To looking like this:
https://drive.google.com/file/d/1e56oR8lN9HwD9ZMvjv98l9CrU6yne4Q7/view?usp=sharing
If my response helped you, please consider giving it a like (👍) and marking it as an accepted solution if it resolved your issue. Your feedback helps other community members with similar questions.
Regards,
Aaryan from Swym
Hi @meggriffin
I fail to access your store by clicking the URL shared in your question. Please double check if it is updated or still correct to access. Thank you!
