Introducing Global Color Palette

Introducing Global Color Palette

One of the most awaited features which will provide a better control across all the Color settings in the Customizer settings of the Astra theme.

Let』s see what are the options quickly and on how to make better use of it –

Palette

Under the customizer settings of the Astra theme – Global section > Colors > Base Colors > Palette you will notice the Palette section that will insert the color options for the default Text Color, Theme Color, Link Color, Link Hover Color, Heading Color (H1 – H6)

[Palette screenshot settings]

Global Color Settings

Under each of the Color options in the Customizer you will now notice an Globe Icon, this will help fetch the Palette colors with just a click.

Also, modifying or finding the Palette options can be achieved by clicking on the wrench icon that will take you to the Palette option under the Global settings of Base Colors.

[Screencast of the settings]

Add New Color / Presets

The Add New Color option will insert Custom Color options and will also have the option to edit the color name.

[Settings option]

Presets

This option will help select from the pre-defined Presets and also provides the option to Import other pre-defined presets.

[Location of the Presets option]

Select from Pre-defined Presets

Presets allow you to switch to different default Presets available with just a click of a button. You can rename the color options once selected.

[Screenshot of Select a Palette section]

How to Import to add More Color Options

If you have saved colors they can be imported with just a simple copy and paste of the Color』s values like this –

["#733492","#AC238C","#24B460","#C0C2BA","#CBCB38"]

You can replace the above color options and paste the same under the Import section of the Palette and click on Import button to find your choice of colors imported.

Edit the Label of the Colors

Editing the label of the Palette colors is very simple as you just need to click on the label and update it as per your requirement.

[Screencast of how to edit

Delete the Unwanted Color Options

Apart from the default Color options as mentioned at the start you will find the Delete option enabled to remove them with just a click.

[Screencast of the settings]

Can I Import Starter Templates Site on Existing Website?

Can I Import Starter Templates Site on Existing Website?

Starter Templates plugin allows importing the entire site and as well as single-page templates. Sometimes you might have a website with some content on it like – pages, posts, customizer settings, etc. If you are wondering what will happen if you import a starter template on your website, this article will help you.

Importing Single Page Template will not affect anything on your website. This will create a new page as a draft in the page list. So even if you import a number of pages, it will not affect your existing website.

Importing Complete Site Template on the existing site that already has content, might affect the look of the site. Newly imported content will get mixed with existing one and it will display unexpected results.

While importing a complete site, a popup displays few options. In case you want to skip any of the parts of the site you can choose options accordingly.

In case you wish to clean/reset your existing WordPress installation and then freshly import the starter template, refer – How To Reset WordPress Installation?

We recommend taking a backup of your existing website before making any major changes. It』s easy and takes only a few minutes.

How to Add Gutenberg Design Compatibility?

How to Add Gutenberg Design Compatibility?

With Astra theme v2.6.0 we are providing enhanced Gutenberg Design Compatibility. [ Read more here in our post ]

What does this mean?

In this theme update we are adding design specific compatibility with Gutenberg plugins.

We received many requests from our users to provide enhanced or full compatibility in terms of Design.

So with this update, we have added some default Spacings & CSS Styles to make any Gutenberg site more elegant.

For New Users: Those users who are downloading Astra theme on your environment from v2.6.0 and above. No need to make any changes, these changes will be auto applied to your core Gutenberg Blocks.

For Existing users: Users who are using Astra theme from previous version 2.6.0 and update to version 2.6.0 and above. To get this compatibility you will need to add the following filter –

add_filter( 'astra_gutenberg_core_blocks_design_compatibility', '__return_true' );

Note

Add the above code into the child theme』s functions.php file.

Set Parallax Effect on Responsive Devices with Page Header

Set Parallax Effect on Responsive Devices with Page Header

We have an improvement for the Page Header addon you will now be able to set the Parallax Effect on responsive devices too.

You will find the new option under the same section of Page Header. Now you will instead find the options to enable the Parallax on specific devices where you want to display the Parallax effect.

The main reason we have implemented this option?

Some images do not appear properly with the Parallax effect on responsive devices like mobile phones. In such cases, users can disable the parallax effect on Mobile and vice versa.

The New select option contains the following choices –

None = Disable Parallax across all devices.Desktop + Mobile = Enable parallax on both the devices.Desktop = Enable parallax on just Desktop ( Disable on mobile )Mobile = Enable parallax on just Mobile ( Disable on Desktop )

How to Enable the Parallax Effect on Responsive Devices?

Create a new Page Header.Now, In their settings, You will notice that the old option ( checkbox ) to enable Parallax has been replaced with the new option ( Dropdown ).

Note: We have also taken care of the Existing and New Users with this Improvement.

For existing users:

We will migrate the already set values, so if the user had the option enabled, it will work as it is and the parallax effect will be enabled after updating to 2.2.5 or above.

Users will now be able to select the Options from the responsive devices as per their requirement.

For new users:

By default, the Parallax will be set to None and it can be changed as required for the responsive devices.

How do I check my Support Ticket History?

How do I check my Support Ticket History?

We have recently implemented a new ticketing system that allows to check your Support Ticket history.

Step to Check the Support Ticket History —

If you are registered user on our Store, you can view the tickets history under My Tickets page.

Here』s a screenshot of how the page would look like –

To track or view the tickets please confirm, if the ticket was opened after 21st April 2021.

Once a ticket is opened you will be able to track the status of the ticket and even respond to it from the same window itself.

Astra Pro Shortcodes Reference

Astra Pro Shortcodes Reference

Following are the list of all the Shortcodes which can be used for the respective Astra Pro features or modules –

Breadcrumbs Shortcode

Here』s a link to the article.

EDD Mini-Cart Shortcode

Here』s a link to the article.

Search Box Shortcode

Here』s a link to the article.

Lifter LMS Profile Shortcode

Here』s a link to the article.

LearnDash Profile Shortcode

Here』s a link to the article.

WooCommerce Mini-Cart Shortcode

Here』s a link to the article.

Update Required Plugins – Starter Templates

Update Required Plugins – Starter Templates

While importing Starter Templates, does the popup says – 「Update Required Plugins「. If yes, here』s why and how you can clear it.

Why?

Starter Templates are built with some awesome plugins. In case, you already have these plugins installed but not updated to their latest versions you might see this notice.

For example – You are importing a template that is built using the Elementor page builder. If you already have Elementor installed but not updated to a recent version, you will see a popup with this notice.

How to Clear?

Just visit a WordPress 『Updates』 page and update all required plugins to their latest versions.

What If I Skip This Step?

In case you skip this step, the imported template might have some errors/issues depending on the update of the respective plugin.

For example – If the recent version of Elementor introduces a new widget and a template uses it, you might see error that the widget and its content is missing from the imported template.

Astra』s Default Font Icons Replaced With SVG

Astra』s Default Font Icons Replaced With SVG

Astra uses beautiful font icons internally in header, footer and other sections. You will see font icons like arrows, hamburger, search, account, cart and so on.

These font icons used to load from astra.woff file.

With Astra version 3.3, these font icons are replaced with SVG. SVG icons are lighter and look sharp on all devices.

Replacing Astra font icons with SVG icons can uplift page loading speed by 29ms and reduced about 12.5% part of the page load.

Users who are starting using Astra after version 3.3, can directly get icons in SVG format.

Users who are updating Astra from previous versions to v3.3, would need to use the following filter in order to replace font icons with SVG.

Here is a code you can paste into child theme』s functions.php file.

add_filter( 'astra_is_svg_icons', '__return_true' );

New Color Controls in Astra theme & Astra Pro Addon

New Color Controls in Astra theme & Astra Pro Addon

We have been working on quite a few things lately.

To begin with we have moved all our controls in our Customizer from PHP to ReactJS controls. Which means we have new and better and optimized performance.

Further for all Color, Responsive Color, Background & Responsive Background control now uses Gutenberg』s control in Customizer.

Let』s see how it would look –

Previous Color Picker Controls

New Color Picker Controls

Next, for the Background control in the Customizer, we have provided the Gradient color option –

New Gradient Control Option –

XMLReader Missing – Starter Templates

XMLReader Missing – Starter Templates

While importing Starter Templates, does the popup says – 「XMLReader Missing 「. If yes, here』s why and how you can clear it.

Why?

While importing a template, the XML file is readed first and then the process continues. This needs an XML extension enabled on the server.

In case your server doesn』t have this enabled you can see the notice.

How to Clear?

Just get in touch with your service administrator and request them to enable XMLReader on your website. Once this is done you can try importing template again.

Here is an email template you can send to server administrator –

Hello,I』m facing an issue while importing template using a 『Starter Templates』 plugin on my WordPress installation. The error says – XMLReader is not enabled and asks me to reach out to the server administration/hosting provider to fix this issue.Can you please take a look. Looking forward to hearing from you.Thank You!Regards,Your name