Website width too large on desktop

Topic summary

A user seeks help reducing the width of their Shopify store using the Tinker theme, wanting content centered rather than stretched across the screen.

Solutions Provided:

  • Global page width adjustment: Navigate to Theme Settings > Page Layout and select “Narrow” for page width to center all content.

  • Section-by-section control: Access the Theme Customizer, select individual sections (like Hero or Media with Text), and change the “Width” property from “Full” to “Page.” This ensures sections respect the defined page width rather than spanning the full viewport.

  • Visual examples: One responder included before/after screenshots demonstrating the centered layout effect.

Current Status:

The original poster reported that the suggested solutions did not work for them. One helper also noted difficulty accessing the store URL, suggesting a potential link issue. The discussion remains unresolved with no confirmed fix.

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.

Hi, my website width is way too large for my liking. I would like everything to be centered instead of stretched to the sides. I’m using the Tinker theme My website is https://hellacomplicated.com/, password is 1234

Hi @meggriffin

To reduce the website width in the Tinker theme, you can follow these 2 simple steps:

Step 1: Go to Customize in your Shopify admin, then navigate to Theme settings on the left sidebar.

Step 2: Under Page Layout, select Narrow for the page width, then save your changes (Screenshot example: [link]).

This will center your content and reduce the stretched look on the sides.

Let me know if you need any more help!

Best,
Felix

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:

  1. Open the Theme Customizer for the theme where you would like to update the section width settings as directed in the screenshot below:

  2. 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:

  3. 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.

  4. 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:

  5. 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 ( :+1: ) 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!

didnt work for me :sleepy_face: but thank you!