How can I make pages full width on a Shopify theme?

Store Design
,
1

Hi there!
I am currently building our online store.
I am using theme one and have a question about how to make pages full-width (including both header and footer).

URL for the online store: https://kanzengames.com/

Could anyone please help and guide me how to make the templates full width?

Untitled.png
Untitled.png1901×873 432 KB

Best regards

Simon

2

@SimonZ

Hi,

To make the page full width, please follow the steps below.

  1. Please go to Assets > generic.css file.

  2. At the end of the file, please add the code below.

.page-wrapper {
  max-width: 100% !important;
}

Save the change.

Hope it helps.

Thanks.

3

Hi David,

Thank you very much for the help. It worked!

However, I noticed that some sections of the main page is still not full-width.

Untitled.png
Untitled.png1917×701 411 KB

Is it possible to make them full-width as well? Thanks!

Best Regards,

Simon

4

Hello @SimonZ

You can follow these steps:

  1. Go to Online Store->Theme->Edit code

GemPages_0-1672882015489.png
GemPages_0-1672882015489.png400×193 29.2 KB

  1. Open your theme.liquid file, paste the below code before

GemPages_1-1672882047777.png
GemPages_1-1672882047777.png1682×903 72.9 KB

I hope the above is useful to you.

Kind & Best regards,
GemPages Support Team

5

Hi GemPages,

Thank you very much! It also worked. However, after I applied this code, all the images in these sections are stretched out. Is there a way to let them stay the same as before? It is hard for me to remake all the images.

Untitled1.png
Untitled1.png1901×699 511 KB

In addition, is it possible to leave some space on each side ONLY for the last section of the home page?

Untitled.png
Untitled.png1917×773 302 KB

Best Regards,

Simon

6

Hello @SimonZ ,

You have hidden it on the live page. You can show them again and I’ll fix it for you.

7

Hi GemPages,

I believe is live now, please check. I already fixed the problem in the last section. Could you please help me with the first question? The images in these sections are stretched out, I tried a couple of codes but they didn’t work.

Best Regards,

Simon