Enhancing WooCommerce integration, Astra ensures a smoother checkout experience while resolving issues like hidden form labels. The update also tackles visibility glitches, CLI errors, and menu heading color issues, promising a refined and stable site navigation.
WooCommerce – Declared HPOS Compatibility across the plugin to avoid incompatibility notice when WooCommerce Addon Module is disabled.
More Fixes:
WooCommerce – Checkout – Form labels get hidden for Stripe payment method.
Mega Menu – Mega menu heading color option is not working on frontend.
Blog Filter – Banner visibility glitch with ‘Post Filter’ and ‘Banner Layout 2’.
Introducing Site Builder (formerly known as Custom Layout)
We’re excited to share that Custom Layout is evolving into Site Builder, reflecting our commitment to enhancing your website creation experience.
Introducing Site Builder: Big news! Say hello to Site Builder, the rebranded and upgraded version of our beloved Custom Layout feature. Dive into a revamped, user-friendly interface tailored to empower your website creation process.
WooCommerce – Product Catalog – Quick View Background option: Introducing the Quick View Background color option in WooCommerce’s Product Catalog. Customize your product displays effortlessly in any background.
Discover Astra Pro 4.4.0: Blog Filters, Full Screen Search Modal Styles, Page-Level Background Settings, and More!
Elevate Your Blog Archive with Post Filters Using Astra!
Are you looking to enhance your blog archive and make content navigation a breeze for your visitors? Adding post filters is the key!
Why Post Filters Matter:
🚀 Simplify content discovery. 🧹 Organize your blog efficiently. 📈 Help new and returning visitors find what they need.
Exciting New Options in Header Builder – Search Element!
Enhance your website’s search functionality with these fresh options for full-screen searches:
🎨 Choose between Light or Dark search modal styles. 📝 Customize Heading Text to suit your brand. ✏️ Tailor the Description Text to engage your audience effectively.
Upgrade your Header Builder – Search Element with these powerful new features!
Unleash Your Creativity with Astra’s Page-Specific Background Settings!
Exciting news for website customization enthusiasts! Astra’s recent update (version 4.4.0) brings a game-changing feature – Page-Specific Background Settings.
In the past, you could only set one background style for the entire site and one for the content. But now, with Astra 4.4.0, you can give each page its own unique background, making it stand out from the rest.
Page-Specific Settings Overview:
🖌️ Customize backgrounds on a per-page basis. 🌐 Override global settings for site and content backgrounds. 🎨 Achieve a truly unique look for each page.
Why Astra Page-Specific Settings?
– Gain full control over your website’s aesthetics by breaking free from uniform global settings. – Create distinct looks for different pages with ease.
Custom Layout – Option for dynamic content preview in single/archive template editor.
Header Builder – Account – Introducing new option for Account menu expansion “Hover” or “Click”.
Improvement:
Introducing filter ‘astra_addon_cl_ast_container_fullwidth’ to make flex based ast-container full-width to resolve edge cases like Custom Template shrinks on archive pages.
Earlier, using Custom Layout you were able to create a header, footer, search, and 404 page but now with the Custom Template feature extend this limit to creating single as well as archive templates.
Introduced option to change Header logo color while sticky.
Improvement:
Accessibility improvements for WooCommerce Pages.
WooCommerce – HPOS Compatibility.
WooCommerce – New Product Editor Compatibility.
Introducing new admin notice for incompatibility of the theme.
Fix:
Custom Layout – Spectra’s dynamic CSS-JS assets loading even though the layout is disabled from the edit list.
Custom Layout – Layout hooked at ‘After Single Product Summary’ overlaps on the single product image and summary box.
WooCommerce – Single Product – The product gallery looks improper when a single product layout builds using a theme builder layout and the first image large gallery option selected from the customizer setting.
Footer Builder – Divider Element – Hide on Desktop option is not working.
WooCommerce – Off-Canvas Sidebar Filters – Close link trigger is not crawlable due to javascript:void(0) href.
Header Builder – Menu – Sub-menu background colour overrides the border-radius of the submenu in the customizer.
WooCommerce – Checkout – Order summary & payment box background color options.
Improvement:
Introduced filter ‘astra_addon_override_single_product_layout’ to enable/disable vertical & horizontal slider gallery layout in case if Single Product layout built using any page builder themer.
Action ‘astra_addon_woo_quick_view_before’ for firing before Quick View popup trigger.
WooCommerce – Introduced new JavaScript event ‘astraInfinitePaginationLoaded’ after shop infinite pagination loaded.
Fix:
WooCommerce – Single Product – Default variation option not working with Change Dropdown to Buttons option in variable type product.
WooCommerce – Single Product – Gallery thumbnail slider not in sync when product variations changes.
WooCommerce – Checkout – String ‘Customer information’ is not translatable.
WooCommerce – Checkout – Email validation not working for non admin users when trying to login through the checkout page when the modern layout is active.
WooCommerce – My Account – Download items UI gets messed up in modern layout.
WooCommerce – Checkout – Login button font-size does not match with their surrounding label in modern checkout style.
WooCommerce – Checkout – Country/Region misalignment in checkout form on single country selection when modern input style enabled.
WooCommerce – Single Product – Misalignment with quantity updater when vertical style is applied.
WooCommerce – Shop – Product cards box shadow not working when old header footer is active.
WooCommerce – Single Product – Product gallery missing when single product layout build using theme builder layouts.
WooCommerce – Removing white background color being added to minicart icon when style is selected as outline.
WooCommerce – ‘View Cart’ secondary link is hidden when product added to that cart from the single product page.
WooCommerce – Shop – Active filter misalignment on the frontend.
WooCommerce – Modern Checkout layout support for Germanized for WooCommerce plugin.
Showing deprecated function warning on frontend after installing Elementor with theme.
Customizer range slider control not accepting decimal values for ’em’ unit.
Need to double click for dropdown menu to open sub-menus on desktop in rare cases.
Blog – Infinite scroll is not working with Custom Post types.
W3 validation – aria-label attribute is missing for button in Full search style.
Updated product columns option dependency on individual Related and Upsell enable setting.
With every update in our Astra 3.0 series, we’ve pushed the envelope a step further when it comes to performance and speed. The latest Astra 3.5 update is no different.
We’ve taken it a notch higher!
We constantly strive to get Astra better at speed and performance in every possible way to help our users experience the fastest websites on the web.
Astra 3.5 brings significant CSS optimization for faster frontend loading. It also comes with advanced options for the recently released related posts and responsive visibility for the site title and site tagline.
This version also brings significant updates for accessibility, thereby dropping a major hint that your favorite Astra is getting ready for Core Web Vitals. With these improvements, Astra now becomes a 100% (jumping from 98%) accessible theme with a default layout.
Astra 3.5 is available in the beta version, where you could try out all exciting features and experience performance improvements. We invite you to test the new Astra 3.5 out.
Together we can make it better and would like to hear from you with your feedback.
Before using the beta version, we strongly recommend using the theme and plugin in a test environment and not on a live site. This way, you can confidently play around and try out the latest features without worrying about anything going wrong on the live site.
Let’s check out all the latest and exciting new updates.
Faster Speed on Frontend With Optimized CSS
We all love designing our websites with different colors, typography, layouts, and so on. However, with more styling comes even more code. And with more code, there’s more CSS.
With Astra 3.5 onwards, no matter how many styling options you use, all the code will be served by more optimized CSS files. This gives you the fastest loading speed in the front end. And adds wings to your creativity!
This update focuses on the optimization of CSS that loads with Astra on your page.
Here is what we did to improve CSS loading:
Conditionally Loading of CSS: What this means is that Astra will now load CSS only if the particular style is applied to the website or if an element is used on the website. The corresponding CSS will be generated based on the design options you choose in the Astra customizer. This also includes elements you use in the header footer builder and will prevent loading any extra CSS for styling that is not applied on your website.
With page builders, load only relevant CSS: Astra will first detect the page builder on your website and then load the respective and required CSS code.
Wiped off some CSS: We examined every CSS applied for both the desktop and responsive views. We’ve optimized and reduced the CSS to the best possible extent.
This covers all the CSS that is applied by Astra, giving you the much-improved loading time.
Here is a result of a test that we ran using Astra’s previous and upcoming version.
Before Astra 3.5: The main CSS had a file size of 56.89 KB, and the page took 725ms to load completely.
With Astra 3.5: The CSS file size was reduced to 41.09 KB and took 666ms to load completely.
That means with Astra 3.5, your web page loads 59ms faster than before.
What to test with the beta version?
Keep your website design as it is.
Install and activate the beta version for the Astra theme. If you are an Astra Pro user, activate the beta version for the plugin as well.
Check for any website design changes with Astra 3.5 beta version. As this version brings new ways of optimizing CSS code, you must test any design changes it causes on the website.
If you observe any change, report it to our team with a supportive explanation and screenshot.
New Controls in Related Posts
Related posts feature was introduced with Astra 3.4. Using this feature, you can display related posts on your posts and pages from the Astra customizer.
This option now has additional controls.
1. Custom Title and Alignment for Related Posts Section
You can set a custom string as a title to the related posts section and manage its alignment.
What to test with the beta version?
Add a title and set alignment to this section. Check if it appears appropriately in the customizer preview as well as in the frontend
Check if it works well with the responsive view
Check if it works well with the RTL website
2. Responsive Support to Posts Grid Column Layout
You can now manage the column numbers across all devices.
What to test with the beta version?
Check if it appears appropriately in the customizer preview as well as in the frontend.
Check if it works well with the responsive view
Check if it works well with the RTL website
Responsive Visibility Option for Site Title and Site Tagline
This adds the new responsive option for the toggle button for the site title and site tagline for desktop, tablet, and mobile devices.
What to test with the beta version?
No change is expected on your website if you use this option. The site title and tagline should appear as they did before and after the update.
Test the new option ‘Display Site Title’ on responsive mode. The site title should be visible only on the selected device.
Test for the visibility of dependent controls on ‘Display Site Title.’ They should be displayed conditionally, just as they did before.
Test the new option for ‘Display Site Tagline’ on responsive mode. The site tagline should be visible only on the selected device.
Test the visibility of dependent controls on ‘Display Site Tagline.’ They should be displayed conditionally, just as they did before.
All the above cases should also be tested with old header options (before Astra 3.0) and the new Astra header builder.
Site Title Color Option Moved to Theme From Astra Pro
The site title color option was available only with the Astra Pro addon. It is now moved to the Astra theme.
You can find it in the logo element under the design tab.
What to test with the beta version?
If you have Astra Pro, try to deactivate it and then test this option with the Astra theme
Check if it works fine in the customizer preview as well as in the frontend.
With new header builder’s logo element.
If you are already using this option from Astra Pro, check if it works with the Astra theme.
Enhancements for Accessibility
Astra is already an accessibility-ready theme. Improving it further, Astra 3.5 now has the following updates:
Background and foreground colors will now have an increased contrast ratio.
The search button of the search form is now made fully accessible.
Always show aria-label attributes on builder social icons for accessibility.
With these improvements, Astra is now a 100% accessible theme with a default layout.
What to test with the beta version?
Run any accessibility test you wish. You can use any tool you like to test accessibility.
Time to Test Astra 3.5!
We would really appreciate your help in testing this update.
As mentioned in the beginning, you can download the Astra 3.5 beta version for the theme.
The Astra Pro users can visit your store account or refer to the article on beta updates for Astra.
Again, we strongly recommend that you try out the beta version of the theme and plugin in a test environment only and not on a live site.
If you think you’ve found a bug, please do let us know through our support portal.
Here are other improvement and fixes that Astra 3.5 brings –
Introducing a new visual Footer Builder that gives the ability to design unique footers for your website.
Design different layers of footer with – Above Footer, Primary Footer, and Below Footer.
Use different essential footer elements like Copyright, Button, HTML, Widget, Social Icon, Search, Footer Menu, etc. So that you can add all the required information easily with few clicks.
Simply drag-n-drop elements in different sections of the footer. It gives you the freedom to place elements at any location in the footer quickly.
It provides a flexible columns-based structure where you can select column count and column layouts.
Manage responsive layouts for the footer easily.
Spacing and alignment options for each element in the footer.
With Astra 3.0 experience faster loading customizer as well as faster website loading time in the frontend.
Astra customizer will load faster than before so that you can design a website in less time. While Astra website will load faster in the frontend delivering a great experience for your users.
Other Improvements and Fixes:
Improvement: Added customizer partial refresh support in a few options.
Improvement: Custom Layouts – Added compatibility to new Custom Layouts Hooks with respect to the new Header/Footer.
Improvement: Page Header – Added compatibility to Page Headers with respect to the new Header/Footer.
Improvement: Overall HTML Structure improvement which includes removing blank spaces and removing unwanted HTML Tags.
Improvement: Ability to add any number of Elements in Header and Footer using a filter from the child theme.
Fix: Sticky Header – Shrink option issue with alignment.
Fix: Sticky Header background color not working in some cases.
Fix: Page Header – Display Below Header option not working.
Introducing a new visual Header Builder that gives a flexible and advanced header designing experience.
It offers different layers for header – Above Header, Primary Header, and Below Header.
You can drag-n-drop elements in different sections of the header. It gives you the freedom to place elements at any location in the header quickly.
It offers different essential header elements like Button, HTML, Widget, Social Icon, Search, Menu, etc. So that you can add all the required information easily with few clicks.
Get background and height options for Above, Below, and Primary header.
Spacing options for each element in the header.
You can design a completely different header for responsive devices with handy mobile header options.
Introducing a new visual Footer Builder that gives the ability to design unique footers for your website.
It offers different layers for the footer – Above Footer, Primary Footer, and Below Footer.
You can drag-n-drop elements in different sections of the footer. It gives you the freedom to place elements at any location in the footer quickly.
It offers different essential footer elements like Copyright, Button, HTML, Widget, Social Icon, Search, Footer Menu, etc. So that you can add all the required information easily with few clicks.
It provides a flexible columns-based structure where you can select column count and column layouts. This lets you manage the footer look easily.
Create responsive layouts for the footer.
Spacing and alignment options for each element in the footer.
All custom controls HTML markup was loading from PHP, which is now moved to React JS for the better and optimized Customizer performance. ( https://wpastra.com/astra-2-6/ )
Fix:
Infinite scroll was loading all types of posts on the blog page.
PHP fatal error while previewing other themes in Customizer when Astra Pro is activated.
A security researcher privately reported a bug about a cross-site scripting (XSS) vulnerability. Our team immediately took action, and provided the required patch within 2 hours, releasing the update on the same day after thorough validation.
Users don’t need to panic. We haven’t heard of any exploit attempts using this vulnerability. However, we strongly recommend all our users to update Astra Pro as soon as possible.
We take security very seriously and put in continuous efforts to keep our products safe, secure and reliable.
Astra Pro version 2.2.5 has no known security vulnerabilities. And it is recommended that you update it now!
Improved logic that is used to save the values of options inside the new popups, Earlier all the values of options inside the popup were combined and stored in JSON objects now all the values inside the popup are stored separately similar to Astra Version 1.X.X. This removes the requirement of the Database Upgrade routine when updating from Version 1.X to 2.X
Changed the images used in the customizer options such as Header Layouts etc. to new lightweight SVGs.
Updated minor UI tweaks for all the customizer controls to unify the design across all the options.
Fix:
Purge Nginx Helper’s cache when Astra Addon’s CSS/JS files are refreshed.
Submenu Container Animations for menus in Above header and below header.
Improvement
Navigation menu admin UI code refactoring to improve the speed of the admin UI. For this, the TinyMCE in the mega menu settings popup had to be replaced with a simple TextArea.
Slightly Updated design of the Highlight Label.
Fix:
Nav menu spacing added from customizer should apply to the spacing for the Custom Text/Shortcodes added in mega menu.
Label text & background color not working.
WooCommerce shortcodes having extra paddings when added in the mega menu.
Mobile Header support for Above Header and Below Header.
Introduced responsive params for colors, background, slider etc to allow reducing duplicate settings.
Merge Desktop header and mobile header settings to reduce the number of separate settings in the customizer So that you don’t have to navigate in multiple sections to design headers.
Spacing options for single blog post layout.
Improve UX for multiple Logos in Customizer. Add logos for transparent/sticky/mobile etc only when you want to have a different logo than the default.
Fixed:
Fine Tune close icon position in the flyout menu.
Astra Header doe snot work correctly in IE11
Custom Layouts 404 page does not display background image to the body
Custom Layouts & Thrive Page builder not allowing correct content to be modified.
Toggle button content is not center align in above header.
Primary menu by default open in some cases.
Use plugins_url to fetch correct assets URL instead of custom building the URLs.
`Ajax add to cart` not adding products to cart for Composite Products and WooCommerce Booking plugins. Ajax add to cart will be by default disabled on these product types.
Blog Pro – Excerpt word count of `0` was not working.
Improve UX on white label screen so that it’s more clear on how to get back the white label screen when it is hidden.
Fix:
Some of the Links on the welcome page sidebar were not removed even though white label settings were enabled.
Multiple Custom layouts loaded on the same page causing second layouts to not load its CSS when using Thrive Architect for building the Custom Layouts.
Incorrect content height applied to the quick view content area.
Transparent Header navigation colors should be applied only for the desktop view. This fixes issue where transparent header on mobile would add same background color and text color which made texts non-readable.
Be sure check out the changelogs of all the beta versions of v1.2.0 for the complete list of changes.
Fixes:
Fixed a bug where too many cache files were being created on some of the hosting providers.
Move Site layout options into Container Layout.
Woocommerce Single Product Ajax add to cart is activated then related products and upsells not able to add to the cart.
Display Author only for the post, not for any custom post type.
Corrected the global translations directory to be – `wp-content/languages/plugin/<translation-file>`. Earlier this global directory was `wp-content/languages/<translation-file>` Which differed from what we are recommending in the translation documentation – https://wpastra.com/docs/how-to-translate/
An Improved white-label support which allows white labeling all the free plugins created for Astra.
Fix:
Advanced Hooks adding wrapper <div> for the hooks added outside the <body> tag, This will allow adding scripts etc in the <head> tags.
Sticky headers will take text colors from the main header settings in the customizer. Earlier when the advanced header was used on a page the sticky header would take color settings from the advanced header.
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.