Astra allows you to add background images to various sections of your website. This feature gives you full control over the design of the Body, Header, Content Container, Sidebar, and Footer. Beyond standard solid colors, you can utilize background images or gradients.

Where to Find These Settings

Navigate to your WordPress Dashboard and go to Appearance > Customize. Inside the Customizer, you will find background settings across different sections.

Available Sections for Background Images

Depending on your license (Free vs. Pro), the available modules vary.

With AstraPro

• Body: (Global > Colors > Site Background | Content Background)
• Sidebar: (Sidebar > DESIGN > Background)
• Header Builder: (Above Header | Primary Header | Below Header | Off-Canvas Menu | Primary Menu > DESIGN > Background)
• Footer Builder: (Footer Builder > DESIGN > Background Color & Image | Above Footer | Primary Footer | Below Footer > DESIGN > Background)

With Astra Free:

• Body
• Primary Footer
• Above Footer

Background Image Settings

The Background Image parameter allows you to select an image from the Media Library or upload a new file. Once uploaded, click More Settings to configure specific CSS properties:

• Repeat
• Background Image Position
• Background Size
• Background Attachment

Color Overlay

You can adjust the background color overlay using the color palette. Applying a semi-transparent color layer over the image enhances readability and design flexibility.

Layout Limitations

Please note: A background applied to the Body container will not be visible when using the Full Width / Stretched Container layout, as the content container expands to fill the entire width.

Design and aesthetics are core components of any website. While the free version of Astra includes essential color settings, the Colors & Background module (available with Astra Pro) unlocks advanced control over your theme’s visual identity.

Prerequisites

To access these features, ensure you have the following installed and active:

• Astra Theme
• Astra Pro Addon plugin

How to Enable the Colors & Background Module

Follow these steps to activate the module and access advanced settings:

1. Navigate to Astra Options: Go to Appearance > Astra Options in your WordPress Dashboard.
2. Activate the Module: Locate the Colors & Background module and toggle it on.
3. Access Settings: Once activated, new color options will appear in the Customizer (Appearance > Customize).

Available Color Settings

Enabling this module extends the Customizer with the following sections:

• Global > Colors
• Header Builder > Site Title & Logo
• Header Builder > Primary Header
• Header Builder > Primary Menu
• Blog > Blog / Archive
• Blog > Single Post
• Sidebar

Global Colors Overview

The free Astra theme provides basic global color settings. Astra Pro extends this with:

• Content Background: Apply background colors or images to the content container (the area where text resides).
  • Note: This setting is visible only when using Boxed or Content Boxed container layouts.
• Headings: Set specific colors for all heading tags (H1–H6) from a single panel. Responsive controls are included for content backgrounds.

Header Customization

Detailed color controls are available within the Header Builder tab:

• Site Title & Logo: Customize colors for the Site Title and Tagline.
• Primary Header: Set background and text colors for the main header section.
• Primary Menu: Control colors for menu items and submenus across different states:
  • Normal
  • Hover (when the cursor is over the item)
  • Active (the current page being viewed)

Tip: For a complete guide on layout structure, see our publication: How to Design a Header with Astra Header Builder?

Blog & Archive Settings

Gain granular control over blog sections:

• Blog / Archive: Customize the Background Color of the Archive Title Block, Archive Title Color, and Archive Description Color, alongside standard metadata.

Sidebar Customization Full color control for the Sidebar includes:

• Widget Title Color
• Text Color
• Link Colors
• Background Options

The Astra Header Builder provides an intuitive way to create custom headers and footers for your WordPress site. Introduced in Astra 3.0, this visual builder is now a core feature, allowing you to design responsive layouts without coding.

Getting Started The Header Builder is enabled by default in modern versions of Astra. If you do not see it:

1. Navigate to Appearance > Astra Options.
2. Ensure Header & Footer Builder is enabled.
3. Go to Appearance > Customize > Header Builder.

Header Builder Interface The builder consists of three main areas:

• Visual Builder: Preview rows (Above, Primary, Below) and drag-and-drop elements.
• General Tab: Configure behavior and content for selected elements.
• Design Tab: Adjust styling, colors, typography, and spacing.

Building Your Header

1. Add Elements: Click the + (Plus) icon in any row to add elements (e.g., Logo, Menu, Button, Social Icons, HTML, Widgets).
2. Arrange: Drag and drop elements to reorder them across rows.
3. Configure: Click the Gear Icon on any row to adjust height, width, and vertical alignment.
4. Style Elements: Click on an element to access its General and Design settings.

Header Types Astra supports multiple header variations:

• Standard Header: Visible on all pages.
• Transparent Header: Overlays content (Available in Free).
• Sticky Header: Stays fixed on scroll (Available in Pro).
• Mobile Header: Dedicated layout for mobile devices (Available in Pro).

Free vs. Pro Elements

• Free Version: Includes Logo, Menu, Button, HTML, Widgets, Search, Social Icons, Off-Canvas Toggle.
• Pro Version: Unlocks Advanced Menu, Account Menu, Language Switcher, Multiple Sticky Headers, Mobile Header Customization, and extended element limits.

Introduction

Choosing the right WordPress theme is critical. First impressions determine whether visitors stay or bounce, and site speed is a non-negotiable factor in 2026. While thousands of themes claim to be “fast” and “flexible,” few deliver on both promises without bloating your database.

Enter Astra. Built by the team behind Schema Pro, Astra has become one of the most popular themes in the WordPress ecosystem—with over 1 million active installations. But does it live up to the hype?

In this review, we’ll break down Astra’s performance, features, and the real differences between the Free and Pro versions—so you can decide if it’s the right foundation for your project.

Why Astra Stands Out

Astra isn’t just another multipurpose theme. It was built from the ground up with performance and developer experience in mind. Here’s what sets it apart:

• Lightweight Architecture: The core theme loads with less than 50KB of resources—significantly smaller than the average WordPress theme (300KB+).
• SEO-Ready: Clean code, schema markup integration, and fast load times help your site rank better in search results.
• Page Builder Agnostic: Works seamlessly with Gutenberg, Elementor, Beaver Builder, Brizy, and Divi.
• White-Label Ready: Remove Astra branding and rebrand the Customizer for client projects (Pro feature).
• Starter Templates Library: Import professionally designed websites in one click via the free Starter Templates plugin.
• Developer-Friendly: Extensive hooks, filters, and CSS variable support for custom extensions.

Performance: Built for Speed

In an era where Core Web Vitals impact SEO, Astra’s performance is its strongest asset.

• Zero jQuery Dependency: Astra avoids loading jQuery by default, reducing render-blocking resources.
• Optimized Asset Loading: CSS/JS files are loaded conditionally—only when needed.
• Native Lazy Load & Preload Support: Improves LCP (Largest Contentful Paint) out of the box.
• AMP Compatibility: Built-in support for Accelerated Mobile Pages.

Real-World Impact: A fresh WordPress install with Astra typically loads in under 0.5 seconds on standard hosting—without caching plugins.

Customization: The WordPress Customizer Experience

Astra leverages the native WordPress Customizer (Appearance > Customize) for real-time previews. No PHP knowledge required.

Key Customization Areas:

• Global Colors & Typography: Set design tokens once, apply site-wide.
• Container Controls: Adjust width, padding, and layout (Boxed, Full-Width, Stretched) per page type.
• Header & Footer Builder: Drag-and-drop interface for creating responsive headers (Free: basic; Pro: advanced).
• Blog & Archive Layouts: Control post structure, meta visibility, and sidebar placement.
• Mobile Breakpoints: Customize typography, spacing, and visibility for tablet/mobile.

Astra Free vs. Astra Pro: What’s the Real Difference?

The free version of Astra is powerful enough for most blogs and small business sites. But Pro unlocks professional-grade features.

Who Is Astra Pro For?

Stick with Astra Free if:

• You’re building a personal blog, portfolio, or simple business site.
• You’re comfortable with basic Customizer settings.
• You don’t need advanced header/footer layouts or WooCommerce tweaks.

Upgrade to Astra Pro if:

• You’re a freelancer or agency building client sites (White Label + unlimited sites).
• You need pixel-perfect control over headers, footers, and blog layouts.
• You run a WooCommerce store and want conversion-optimized product pages.
• You want access to premium Starter Templates and priority support.

Pricing & Licensing

Astra Pro is sold as an annual subscription or lifetime license. All plans include unlimited site usage—a rare benefit in the premium theme market.

Current Tiers:

1. Astra Pro: Core Pro features + support + updates.
2. Essential Bundle: Astra Pro + 280+ premium Starter Templates + WP Portfolio plugin.
3. Growth Bundle: Everything above + ConvertPro (lead gen) + Schema Pro (SEO) + Ultimate Add-ons for page builders.

💡 Pro Tip: Brainstorm Force frequently runs seasonal promotions (Black Friday, New Year). Check the official site for current discounts. All purchases include a 14-day money-back guarantee.

The Verdict: Should You Use Astra?

✅ Pros:

• Blazing fast performance with minimal bloat.
• Deep integration with major page builders.
• Intuitive Customizer workflow for non-developers.
• Extensive hooks/filters for developers.
• Excellent documentation and active support community.
• Unlimited site licensing on all Pro plans.

⚠️ Considerations:

• Some advanced features (Sticky Header, Custom Layouts) require Pro.
• The sheer number of options can feel overwhelming for absolute beginners (but the Starter Templates mitigate this).

Final Thought:

Astra strikes a rare balance: powerful enough for developers, accessible enough for beginners. If you prioritize speed, flexibility, and clean code, Astra is one of the safest investments you can make for your WordPress stack