Making Your Hero Banner Full Width & Full Screen

---

Want to give your store a high-impact, cinematic look? By adjusting the section width and removing border constraints, you can make your Momentum Theme hero banner stretch from edge to edge.Follow this step-by-step guide to achieve the full-screen effect.

Step 1: Access the Hero Banner Settings

• Log in to your Shopify Admin.
• Navigate to Online Store > Themes.
• Click the Edit Theme button on your Momentum theme to open the Theme Editor.
• On the left-hand sidebar, click on the Hero Banner section.

Step 2: Adjust Section Width

To make the banner span the entire width of the browser:

• In the Hero Banner settings panel, look for the Section Width dropdown.
• Select the option labeled Contain Content (Note: Depending on your version, this may be labeled or updated to Full Width).
• Once selected, you will see the image stretch toward the edges of the screen.

Step 3: Remove Container Padding & Rounded Corners

Even after setting the width to full, you might notice small gaps or rounded edges. To get a true "edge-to-edge" look:

• Scroll down within the Hero Banner settings until you find Container Corner Radius.
• Drag the slider down to 0.
• This eliminates the "rounded" look and ensures the banner hits the exact corners of the screen.

Step 4: Save Your Changes

• Review the desktop and mobile previews to ensure the banner looks exactly how you want it.
• Click Save in the top right corner.

See this video for a quick visual guide: