No results found. Try again with different words?

Search must be at least 3 characters.

Full Width Site Layout

Ready to step away from the usual website layouts and explore the wide-open possibilities of a full-width design? With Astra’s Full Width Site Layout feature, it’s now simpler than ever to give your website a captivating look.

Check out the next sections of this document to learn more about using the Full Width Site Layout in Astra.

What is a Full Width Site Layout?

With a full-width layout, your website’s content stretches edge-to-edge across the user’s screen, creating a visually immersive and impactful experience.

Imagine this: your website takes over the entire screen, like a massive, impressive billboard showcasing all your cool stuff. Whether it’s photos, text, or videos, everything expands, creating a bold and memorable impact on your visitors.

What are the Benefits of Full Width Designs

  • Enhanced Visual Appeal: Full-width layouts offer a modern and sophisticated look that can instantly grab your visitor’s attention and keep them engaged.
  • Focus on Content: By removing distractions like sidebars, you can truly highlight the content and ensure your message resonates with your audience.
  • Responsive Design: A full-width layout can be built to adapt seamlessly to different screen sizes, ensuring a positive user experience on all devices.
  • Creative Freedom: With the wide-open space of a full-width layout, you have more creative freedom to experiment with typography, imagery, and other design elements.

How to Achieve a Full Width Site Layout with Astra

A website generally has the main wrapper followed by the container.

  • The main wrapper consists of header, content, sidebar, and footer — the entire website;
  • And the container is the child wrapper that includes a content & sidebar.

When you select the Full-Width Site Layout, the main wrapper of the website goes edge to edge of the browser. Whereas the content is managed by the container width.

Thus, implementing a full-width layout with Astra is a simple process. Here’s what you need to do:

1. Activate the Pro Addon: The Full Width Site Layout feature is available with the Astra Pro Addon. So, if you haven’t already, install and activate it on your website.

2. Activate Site Layouts Module: Inside the WordPress dashboard, go to the Astra Dashboard, and activate the Site Layouts module within the Astra Pro modules.

Full Width Site Layout

3. Access the Site Layout Settings: Navigate to Appearance > Customize > Global > Container in your WordPress dashboard.

4. Choose your Layout: Locate the setting and select “Full Width Width”.

Full Width Site Layout

5. Customize Further: Astra offers additional options to fine-tune your full-width layout, such as adjusting container layout, content width, and narrow container width.

6. Preview and Publish: With your settings configured, preview your website to see your stunning full-width layout in action. Once satisfied, hit the publish button.

We hope this document has been helpful. If you have any questions, feel free to leave a comment below.

Was this article helpful?
Did not find a solution? We are here to help you succeed.

Related Docs

Astra is Free. Now & Forever.

We believe creating beautiful websites should not be expensive. That's why Astra is free for everyone. Get started for free and extend with affordable packages.

REWIND

YEAR IN REVIEW

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form
Scroll to Top
Now choose your preferred
page builder addon
Choose your preferred page builder addon

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form