Last Updated 26 Jul 2024
|

Introducing Astra 3.9: Create the Ultimate Shopping Experience

Quick Summary โ†ช This article details the improvements made by Astra 3.9, including the introduction of the Modern Shop page skin, new product gallery options, cart enhancements, and premium Starter Templates. Explore how Astra 3.9 can transform your WooCommerce experience.

Say hello to Astra 3.9

What gives you an adrenaline rush? Is it bungee jumping, โ€‹โ€‹skydiving, surfing or canyoning? For us, itโ€™s bringing you world-class WordPress products and updates. ๐Ÿ™‚

One such update is our latest Astra 3.9 release.

We are thrilled to share this latest update with you and canโ€™t wait to tell you how this changes the entire shopping experience for our WordPress and WooCommerce users.

Our dedicated team has been working round the clock for the past 6 months and has delivered a release that we are all very proud of.

What are these updates? Letโ€™s dive in and find out!

What weโ€™ve done

The latest update impacts every aspect of your WooCommerce store.

From the shop and product page to the cart and checkout page, weโ€™ve made major enhancements to just about every element of your store.

Letโ€™s review every page individually.

Shop page

Youโ€™ve probably used the two default skin layouts that the Astra shop page comes with, Grid and List. While the two work perfectly well, we now have a brand new skin called Modern.

Hereโ€™s how it looks.

Modern shop page example
Astra 3.9 Modern skin shop page
Astra 3.9  modern skin shop page
Astra 3.9 product popup

The new Modern skin looks great and enhances the entire shopping experience.

The โ€˜add to cartโ€™ and โ€˜quick viewโ€™ options become available when you mouse over the product image. This allows customers to make purchases quickly without having to navigate to individual product pages.

And the best bit is that it offers endless customization possibilities through plenty of options in the customizer.

Astra 3.9 shop layout settings

You can easily select the shop layout and even play around with the content width from the customizer.

Want to select a particular style for your sidebar? No problem!

Astra WooCommerce sidebar controls

Simply drag and drop the various card elements to personalize your shop page.

Astra flexible WooCommerce shop controls

Itโ€™s as easy as 1-2-3!

Do you like sticky menus? You know, the top menu links that include a logo and stick to the top of the page as you scroll down?

Our latest update now comes with a Sticky Sidebar.

The new sidebar โ€˜sticksโ€™ to the side of a page as you scroll through the list of products.

Your customers can now apply the necessary filters and easily locate the products theyโ€™re looking for.

We didnโ€™t stop there. We included a collapsible filter functionality that you can enable or disable based on your requirements.

Search for products, filter by stock status and do more using the collapsible filter.

Product page

Product pages need to speak for themselves if you want to sell more. A big part of this is to present high-resolution product images in the best way possible.

Thatโ€™s why we designed three new image gallery options to help your product images stand out.

Astra single product gallery controls
Astra single product gallery vertical slider
Astra single product gallery horizontal slider

Itโ€™s one thing showcasing different views of the product using images. Itโ€™s another thing to ensure you make it easy for customers to buy your product.

To make the entire buying process as simple as possible, we introduced a new โ€˜Sticky Add-to-Cartโ€™ feature.

Astra sticky add to cart

This feature ensures you have an โ€˜add to cartโ€™ button sticking to the bottom as you scroll through the product description page. You can easily enable or disable this feature from your customizer.

Weโ€™re leaving no stone unturned when it comes to improving your conversions.

Weโ€™re even adding some psychological triggers, such as payment icons and shipping text on the product page.

Astra's payment icons for product page
shipping text on the product page

Do you prefer reading the productโ€™s top highlights in an ordered list? Weโ€™ve got you covered.

Extras for product page

You can now show the top highlights in a beautiful icon list.

Weโ€™ve also spruced up the way your product descriptions look.

Astra WooCommerce product description
Astra WooCommerce distibuted layout

Weโ€™ve worked on improving a number of elements in this Astra 3.9 release. Another area that has seen development is the product quantity selector.

The default product quantity selector isnโ€™t particularly well designed. Neither does it look great on mobile devices.

Astra WooCommerce modern quantity UI

Weโ€™ve worked on both aspects and the result is a sleek-looking quantity selector that looks amazing on every screen size.

Do you offer products with variations? Like products with different sizes or color options?

Astra 3.9 has made major improvements to product variations too.

Instead of drop-down menus, product variations can now be displayed as buttons.

Astra product variations update

Not only is this great for UX, but it is mobile-friendly as well.

Cart page

Next up is the cart page. Weโ€™ve made several new enhancements here too.

From a modern new layout and real-time quantity adjustments to a sticky cart totals sidebar and an option to change the cart button text, weโ€™ve made many new improvements to the user experience.

Astra WooCommerce modern cart

Real-time quantity adjustments

Sticky cart totals sidebar

Change the cart button text

Astra's settings for WooCommerce cart button

Off canvas cart

Wouldnโ€™t it be great to have a cart that slides out and keeps you informed of what youโ€™ve purchased? Well, thatโ€™s exactly what the new Slideout Cart feature does.

Unlike having a window popup when you click on the cart, weโ€™ve incorporated a new slideout feature that showcases all the products youโ€™ve added to your cart.

You can update your cart, view the cart, and proceed to payment, all from the slideout cart.

This is another one of those features thatโ€™ll enhance the shopping experience.

Checkout page

The checkout page is probably the most important page in the entire shopping cart. Itโ€™s the make or break of a customerโ€™s buying experience.

Did you know that the average cart abandonment rate is nearly 70% across all industries? This translates to nearly 7 out of every 10 customers not completing their purchase.

Competing platforms such as Shopify use simple, elegant checkout forms, Yet WooCommerce is often criticized for its lengthy and somewhat unintuitive checkout forms.

So we decided to tackle this in Astra 3.9. The results are stunning!

Welcome Modern Checkout

Astra WooCommerce modern checkout

Modern Checkout is a whole new checkout experience. It surpasses the default WooCommerce checkout in every respect.

  • Fresh new modern look and feel
  • Faster, frictionless checkout
  • Optimized for higher conversion

Modern Checkout helps you significantly enhance the customer shopping experience!

With a simple toggle, you can switch out the old checkout page for a beautiful and intuitive new page.

An experience that encourages customers to progress more fluidly through checkout.

Astra WooCommerce checkout layout settings

Modern Checkout lets you design every element of your checkout page.

You can make the purchasing process faster and easier and help boost revenue by reducing distractions.

Astra WooCommerce modern checkout example
Astra WooCommerce modern checkout example 2
Astra WooCommerce two step checkout

Skeleton loader

Weโ€™ve gone the extra mile to ensure every aspect of your WooCommerce store looks awesome. One such aspect is the default loader.

Out of the box, WooCommerce uses a spinning wheel as a loader that looks outdated. In keeping with the times, weโ€™ve redesigned this into a skeleton loader instead.

While these may be small enhancements, they all add up in the larger picture of making your checkout page look a whole lot better!

Single column checkout

You can easily select the layout structure of your checkout page.

Modern two column checkout layout

From selecting a default or modern checkout layout to going with a single column or a two-column one, designing your checkout page has never been easier.

Weโ€™ve made it super easy to customize your payment button as well.

customize your payment button

Easily edit the text on the button and enable the button padlock and price by using the toggle button.

Weโ€™ve also incorporated a sticky order review on your checkout page.

Sticky order review at checkout

As the customer fills in their billing details and scrolls down, their order details stick to the page. This helps customers review their order before making a payment.

Account validation

Another amazing new inclusion is account validation. It checks if the account exists as your customer begins typing their email address.

If it does, the password field is automatically displayed. If not, customers can check a box and their checkout details can be used to create a new user account.

Pretty cool, right?

Here are a few additional features weโ€™ve improved:

Persistent checkout form data

We are utilizing the โ€˜persistent storageโ€™ technology that the latest browsers offer.

This saves the details customers type into their checkout forms if they accidentally close the browser tab or refresh the page.

Customers will find their typed data in the form and wonโ€™t have to retype it.

Two-step checkout

Weโ€™ve made improvements to the two-step checkout layout as well, making it way more customizable.

Two step checkout

Thank you page

On successful checkout, the customer is directed to the thank you page. Weโ€™ve given this page an elegant and modern new look.

Modern Thank you page

My account page

The โ€˜my account pageโ€™ is an important part of your online store and is where customers access all their details. From updating their billing details to tracking orders, itโ€™s all available on the โ€˜my account pageโ€™.

If you sell digital products, customers can log in and download their products from their account area.

All this makes the account page an integral part of your store and one that has to be equally appealing to customers.

Astra 3.9 now introduces a totally modern-looking layout for the account page.

Hereโ€™s how it looks.

Astra 3.9 modern WooCommerce account page
Astra 3.9 modern WooCommerce account page 2

We are delivering even more!

Like we said earlier, we love delivering awesome WordPress products to help you scale your online business. Weโ€™ve built a few plugins that we feel every WooCommerce website requires to deliver an exceptional user experience.

Here are some of them.

Variation swatches

We discussed the variation option in WooCommerce earlier. Itโ€™s especially helpful when you want to create product variations, such as t-shirt color and size, and storage options on mobile devices.

However, WooCommerce shows these variable products with a mundane dropdown menu, which is not ideal as far as UX is concerned.

Variation swatches dropdown options in default WooCommerce

We found several plugins that offer a fix for this and display product variations in the best possible way.

However, most of them were bloated, confusing, and expensive.

We saw an opportunity here and decided to come up with our own plugin thatโ€™s customizable, lightweight, and above all, 100% free.

Astra 3.9 modern Variation swatches

Go ahead and give the Variation Swatches for WooCommerce plugin a shot.

Stripe payment gateway for express checkout

Want to increase the chances of increasing sales? Have a smoother checkout process!

Our team collaborated with our friends at CartFlows and built a Stripe payment gateway plugin to make the payment process faster and more intuitive.

This plugin is fully compatible with the Astra theme and provides a seamless checkout experience for your customers.

Express Checkout for WooCommerce
Express Checkout option at checkout page

We released this plugin a few weeks ago and were pleasantly surprised with the traction it gathered. Over 50,000 WooCommerce store owners have taken advantage of this plugin, and this number grows every single day.

Learn more about the Stripe payment gateway plugin here.

WooCommerce Cart Abandonment plugin

Just in case you missed it, have you tried our WooCommerce Cart Abandonment plugin?

Nearly 70% of customers who reach the checkout page donโ€™t complete their purchase. Our plugin helps you automatically recover lost revenue for free.

The plugin captures the email address of customers on the checkout page. If the customer hasnโ€™t completed the purchase within 15 minutes, an automated series of follow-up emails are triggered by the system.

These emails can remind the customer to complete the purchase, ask for feedback, or even offer a discount to lure them into completing the purchase.

You have complete control over the interval for sending out these emails.

Helps recover lost sales and revenue? We definitely think so!

One more thing!

If youโ€™ve been using our Astra theme, youโ€™d know that we designed the customizer a few years ago. Itโ€™s been a while and we figured itโ€™s about time to give the Astra customizer a new look.

We made a totally new style guide for our customizer and made numerous enhancements and improvements to it.

Needless to say, this enhances the experience while using the customizer and setting up your website!

Weโ€™ve improved the colors and typography panels as well.

Astra 3.9 color panels

The entire interface of the colors panel has been revamped to give a cleaner and more modern look. The color palettes in the Global Color Palettes section appear as a popup and are more user-friendly than our earlier version.

The reset functionality has also been enhanced by adding group and individual reset options.

In the typography section, we focused on providing better spacing, categorization, and delivering an overall enhanced user experience.

Astra 3.9 typography panel

Compared to our earlier design, the typography dropdowns and pre-defined presets are much cleaner and better organized.

We didnโ€™t just stop at the colors and typography sections. We improved the UI of other panels such as layouts, headers, and footers.

Astra 3.9 header footer builder layout update

With a completely updated and enhanced customizer, the team focused more on improving the performance with a lightweight and impressive UI.

This is still work in progress and will be released over the next few updates.

3 new premium Starter Templates

Weโ€™ve got more good news for you. ๐Ÿ™‚

Weโ€™ve added three new premium Starter Templates to our ever-growing library.

These new templates have the best of Astra and WooCommerce features built-in and can help you launch an online store almost instantly.

The new features include off canvas cart, the newly introduced Modern skin for shop page layout, easy list view, off canvas shop filters for shop pages and the quick view popup.

For the single product pages, weโ€™ve used a vertical slider gallery layout, active payment gateways, free shipping label, product navigation, sticky add-to-cart, and sticky product summary, among other amazing features.

Additionally, our amazing new templates use the Modern skin for the rest of the pages, such as the cart, checkout, thank you, and my account.

Hereโ€™s a sneak preview of our new templates.

Electric Scooter

Electric Scooters new eCommerce template

If you deal with electric scooters and want an online presence for your business, hereโ€™s a tailor-made website template for you. The clean and minimalistic design has everything you need to get your business up and running quickly.

With impressive background effects, and a significant hero section that incorporates an โ€˜add to cartโ€™ CTA and featured product areas, this template is ideal for creating the perfect shopping experience.

Inessa Perfumes

Inessa Perfumes Starter Template

Classy, elegant, and stylish. Thatโ€™s the first impression you get when you see this chic website design. Itโ€™s perfect for selling all kinds of perfumes.

Promote your best products and offers on the hero section of the website, include your best sellers, and do more on the highly engaging website template.

eGrow Plants

eGrow Plants Starter Template

Want to sell plants to a global audience? Use our high converting and WooCommerce-ready website template to build your online store quickly and easily.

The clean and simple design creates the perfect shopping experience for your customers. Simply import our template and easily customize it to suit your requirements.

Over to you

Our fabulous team has been working round the clock and has put a huge amount of effort into this update over the past 6 months. Itโ€™s a total game changer as far as creating the ultimate shopping experience is concerned.

If you arenโ€™t an Astra Pro user, this is a great time to be one!

To sweeten the deal, we are offering a discount of 25% off on all our annual plans. Simply use the coupon code ASTRA39 to benefit from this limited time offer.

Weโ€™d like to hear from you now. Which particular feature of Astra 3.9 are you most excited about?

Let us know in the comments below!

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!

71 comments
  1. Nicolas Profile Pic

    Hate to test,
    I have two small questions
    Is it possible to put the sticky add to card on custom product pages with elementor?

    Second question, the checkout and cart page loads slowly on the basic version of woocomerce
    Do the new mods accelerate the loading of these pages

    1. Eddie Kasper Profile Pic

      Great article filled with great improvements. The only request I like to see now is the Customizer area. I would love to have a dark mode setting. Too me, it’s easier on the eyes. Thanks for your hard work!

      1. Team Astra Profile Pic

        Hello Eddie,

        Glad you liked the article. ๐Ÿ™‚

        I will indeed convey your feedback to our concerned developers. Thank you for your suggestion.

  2. Meredith Profile Pic

    WOW!!! I am so impressed with such a wealth of features!! In the past I’ve had to do so much custom work and add extra plugins just to get what you now offer boxed and ready to go! Thank you guys for always striving to deliver bigger and better! A very happy customer! ๐Ÿ™‚

  3. Jackson Monichan Profile Pic
    Jackson Monichan

    This is a Super Crazy Fantabulous Update!!!! Loving You guys again and again with every new update…โค๏ธ

  4. Reesh Profile Pic

    Seems like mega menu improvements was left out and that sucks. The Astra mega menu sucks it needs an overhaul, a complete one.

  5. Marius Profile Pic

    WooCommerce enhancements, were overdue ๐Ÿ˜‰

    But now you delivered, once again!

    I am excited to upgrade my Stores and use it in new ones.

    Thanks to the whole Astra Team!

  6. Karine Profile Pic

    Very nice! love all the updates. We are having issues with the cart button not working on mobil after the upgrade. Might want to look into that. It’s happening on multiple sites.

    1. Dan Profile Pic

      Me too, but we’re using the old header and the [astra_woo_mini_cart] widget. If you click/press it in mobile view it does nothing now.

  7. Rhys C Profile Pic

    Amazing updates everyone!

    Wow now I feel like the need to use Shopify is gone for my clients!

    But for real this is a lot of great work

  8. Ryan C Profile Pic

    Impressive update!
    Buying that lifetime bundle really paying off with each update. Hope to see the Spectra update soon.

  9. Cynthia Roberts Profile Pic
    Cynthia Roberts

    Love all these small design changes. I have already updated my store, and it now looks more polished and modern.

  10. Marc Profile Pic

    Well done to the team!! Are there any video’s out on how to implement the change to a existing astra theme with woocommerce to Astra 3.9

  11. Brown Charles Profile Pic

    Thank you, Astra Team! These are the much-required features for any modern eCommerce store. This creates lots of possibilities for me as a web designer.

  12. Kavin Starc Profile Pic

    Amazing updates as always. These default options for the WooCommerce store are much required.
    Now I can finally get rid of unnecessary plugins.

  13. Ethan Brown Profile Pic

    WooCommerce has been the slowest to respond to the modifications and features other platforms like Shopify have to offer. I think this update is pretty drastic and the list of customization options can really help update product pages with just a few clicks.

    Hoping for more updates in the future.

    1. Team Astra Profile Pic

      Thank you, Ethan! ๐Ÿ™‚
      Glad to hear that.
      Yes, you will get to see more features in the future. ๐Ÿ™‚

  14. Annie Sequira Profile Pic

    I just have this one question will the current store theme installed also update to the new theme add-ons?

    Other than that everything sounds very promising!

  15. Olive Carr Profile Pic

    I have been using Astra for building an online store for the clients, the major thing which my client most needed is a “quick view” feature. This is a relief. BTW, as always loved the update!

  16. Percy Summers Profile Pic

    I like your WordPress themes and am currently using them on a few of my sites. Keep doing the excellent work Astra team.

  17. Christian Profile Pic

    The three new themes look good, but are currently only available for Elementor, when will they be available for Gutenbenrg/Spectra?

  18. Hossein Profile Pic

    Hello
    Would you please add a feature to add custom tabs to woocommrce profile my account page?
    To insert shortcodes like wishlists, waitlist, tickets and more

  19. Manny Profile Pic

    Any idea as to when the docs or tutorials will be available? I have it live on my site but there are things that I can’t figure out.

  20. Snake93 Profile Pic

    Hey team, hello! After updating to version 3.9.0 the woocommerce templates are no longer overwritten by the child theme. Returning to version 3.8.5 everything works correctly. I looked in the change log https://clone.wpastra.com/changelog/astra-pro-3-9-0/ for the changes made to astra, and it seems that the problem comes from astra/ inc/compatibility/woocommerce/class-astra-woocommerce.php.

    So I did some tests, I updated astra to version 3.9.0, then I took class-astra-woocommerce.php from version 3.8.5 and replaced, magically the templates started working again. How do I fix the problem without replacing the file?

    Here is another discussion with the same problem: https://wordpress.org/support/topic/child-theme-no-longer-overriding-woocommerce-templates/

  21. Nico Profile Pic

    In the changelog a new filter named astra_stretched_layout_with_spacing was mentioned, but it is not documented anywhere, not even in the mentioned link. Can you please explain what it does?

  22. Raghu Profile Pic

    What about mobile app style bottom nav bar in mobile version? Any plans to add that?

    how do filters look in mobile? Are they user friendly

  23. Michelle Profile Pic

    Great updates!
    I have been using the WooCommerce Blocks plugin to add a better checkout experience. Are there plans to make these improvements compatible with WooCommerce Blocks as well?
    I’m going to have to compare the features of both to decide which is best for my site, but the advantage of the built in WooCommerce Blocks is that it has integration with a lot of other plugins that affect the checkout process. I’ll definitely have to run some tests!

  24. Garrison Profile Pic

    In Appearance/Customize/WooCommerce/Product Catalog I am not seeing the Pagination or Product Styling options. This leaves me with a limited product catalog editing capability. I do have the Astra Pro 3.9.1 installed and active on my website. My website was created before the new update was released, but that shouldn’t matter, should it?

  25. Gabriel Pinto-Hasagiv Profile Pic
    Gabriel Pinto-Hasagiv

    Where the -Product Short Description- tab has gone?
    And why we need the Product Description if the Description is already there?

  26. homegroupjsc Profile Pic

    Iโ€™m having a problem with the 3.9. It makes the theme customizer unable to load. I have tried changing other interfaces, still customizing and still normal as if nothing happened? I donโ€™t know if admin can help me?

  27. Levente Hajdu Profile Pic

    This update ruins the off-canvas cart on all my webshop!!! I use elementor header and not the header builder. The updates should not influence the my current usage.

    The quintity field type is now “input” and the design is bad as well. Before this update the quintity field was text.

    Please advise the solution asap to fix your mistake

  28. Nestor Fernรกndez Profile Pic
    Nestor Fernรกndez

    Is there a way to show sticky add to cart also on mobile? I activated but only show on big screens.

  29. WP Dev Profile Pic

    I switched to developing sites using Astra a while back and it was wonderful. However with each new update, my sites’ Pagespeed scores are getting lower and lower. Bloated CSS, too many DOM elements, CLS issues, jQuery/jQueryMigrate dependencies and more. Not to mention the changes and bloating in the plugin formerly known as “Ultimate Add-ons for Gutenberg”. All these new features are great but not when it comes at the expense of performance.

  30. Sandor Profile Pic

    That says all well and good – it would if:
    – the mobile menu would not still be broken
    – if the new product image gallery wasn’t broken because of the old base view
    – other long-standing basic bugs, etc.

    …and maybe if Asra would finally get something like the Generatepress Elements part…

  31. sam fenando Profile Pic

    Hey,
    This theme is looking good.
    I just have one question by adding more categories and a menu does it will affect our page speed load time?
    And compare to another theme Astra pro is user-friendly to edit and customize.
    But you have added some more features for Astra free theme builder.

  32. Vadim Profile Pic

    Hi guys. It is nice that you have a plugin for variation swatches on shop / archieve page. But it it would be much better if you could implement such feature without a plugin. Are you planning to add such feature in the theme in the next update?

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.

Scroll to Top