Last Updated 5 Jul 2024
|

Experience the All-New Block Editor With Astra 3.8

Quick Summary ↪ Astra 3.8 leverages the new theme.json feature for enhanced customization. It now offers extensive control over block design elements like padding, margins, typography, and layout directly within the editor interface. Performance improvements include reductions in CSS file sizes and enhanced load times.

Astra 3.8

In October 2018, Astra released its WordPress block editor integration, one of the first themes to do it!

Since release, the block editor has continued to evolve at a rapid pace. And we continued to make the necessary adjustments and improvements to keep up with the changes. However, these have been done in bits and pieces.

Now that the block editor is much more stable and offers robust APIs for theme authors, we have decided to take another look at it.

Today, we are thrilled to announce a major update to our integration with the block editor.

We have completely redesigned it this time to take full advantage of the latest features and APIs that WordPress offers. And we’re just getting started!

Let’s take a closer look.

Meet theme.json

WordPress 5.8 introduced theme.json, a new way for themes to specify the styling for the WordPress editor as well as the website’s front-end.

It includes settings for colors, typography, borders, and much more.

The block editor is much simpler and lacks a lot of customization options. That’s because it relies on the active theme to decide how your page designs look.

With theme.json, WordPress themes can now provide customization options for individual blocks. They include controls for typography, layouts, borders, and other settings within the editor!

Today, we are super-excited to announce that Astra is one of the first major themes to fully take advantage of theme.json!

With Astra’s new customization settings, you can now easily customize padding, margins, typography, layout, and borders for all supported blocks.

Here’s how the block padding and margin settings look:

Astra gutenberg enhancements

You can even edit the typography of individual blocks:

Astra typography addition for gutenberg

And some layout and sizing options for the block columns:

Astra edit page layout on block editor

Design Integration for New Core Blocks

The WordPress block editor has seen a number of new blocks added in recent months, including the latest posts, login/logout, and site titles.

Our latest update includes deep design integration with these new blocks, so you can fully customize their design using color and typography settings from Astra.

Whether you’re creating a modern blog or a striking landing page, this update makes it easier than ever before!

Astra core block update

Improvements in the Astra Page Settings (Meta Box)

Astra offers powerful customization options via the theme customizer. You also have more granular controls at the page level in a meta box.

Now, you can customize the page layout, sidebar, header, and other settings on each page right from the block editor.

The settings are even better organized and easier to navigate. They are more visual, categorized, and streamlined!

Here’s how to control the visibility of the page title and featured image easily:

Astra title visibility

Settings are now visual so everyone can easily understand them:

Updated Astra UI

We have moved other advanced settings into a model box, where users have more real estate to customize them:

Astra advance setting update

A Lot of Performance Improvements (Of Course!)

As with every release, we have significantly improved performance with Astra 3.8.

Using the theme.json APIs helped optimize code for some impressive performance improvements. The full-page load time, both in the editor as well as front-end has now improved by over 33%!

MasterLatest
EditorStatic CSS: 21 KB
Dynamic CSS: 21.4 KB
Page size: 588 KB
Static CSS: 15 KB
Dynamic CSS: 7 KB
Page size: 547 KB
FrontendCSS: 9.77 KB
Page size: 111 KB
CSS: 4.44 KB
Page size: 106 KB

The typography section’s variation controls are now better optimized (rewritten in React instead of PHP) so fonts load blazing fast!

Astra typography update

What’s Coming Next?

Three things 🙂

  1. Did you hear about Spectra?
    Spectra is a page builder based on the WordPress block editor. With Spectra, you can build websites that are as fast as hand-coded ones, without having to touch any code! Read the announcement here.
  2. We are now experimenting with full site editing and you should see the results of these experiments very soon. Keep an eye on our channels for updates!
  3. Over the last 3 months, our WooCommerce integration has improved significantly! Our aim is to take your store building experience to a whole new level with a groundbreaking new design and awesome features!

Stay tuned!

Article by
Sujay Pawar
LinkedInTwitter

Sujay Pawar is the co-founder and CEO of Brainstorm Force. He brings a one-of-a-kind fusion of tech brilliance, business savvy and marketing mojo to the table. Sujay has consistently spearheaded the development of innovative products like Astra, CartFlows, ZipWP and many others that have become market leaders in their respective niches.

Disclosure: This blog may contain affiliate links. If you make a purchase through one of these links, we may receive a small commission. Read disclosure. Rest assured that we only recommend products that we have personally used and believe will add value to our readers. Thanks for your support!

2 comments
  1. Jake Hawkes Profile Pic

    My only critique so far is that some indication of the existing setting would be a good UX/UI approach so I don’t have to click into each setting option to see what it is set too.

    1. Team Astra Profile Pic

      Hello Jake, thank you for taking the time to drop a comment.

      Can you describe the concern further, so that we can help you in the best possible manner or make changes accordingly in the future?

Leave a Comment

Your email address will not be published. Required fields are marked *

Join 1,653,898+ Happy Site Owners Using Astra

Whether you are a beginner, small business owner, or professional web developer, Astra provides all the tools you need to easily build your beautiful WordPress website.

Download is Just A Click Away!

Membership Retention Checklist Download

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