Troubleshooting Steps ( with Health Check & Troubleshooting plugin )

Troubleshooting Steps ( with Health Check & Troubleshooting plugin )

Sometimes you might face unexpected errors on the site. In such cases, you can try with basic debugging steps to find out the culprit. You can even share this debugging results to support members from theme/ plugin, or on WordPress.org support forums.

You can create a staging site and perform basic debugging steps. But to check conflicts on the production/live site we strongly recommend to use Health Check & Troubleshooting plugin. 

Basic troubleshooting steps

Step 1: Switch the theme temporarily to standard WordPress theme like Twenty Nineteen. Step 2: If the issue still persists, deactivate all plugins for some time. Step 3: If the problem is solved, activate the original theme and plugins again one by one until the problem returns. This will help you identify what is causing it.

If you』re concerned the debugging process might break your website, take a backup. 

Troubleshooting with Plugin (Recommended)

 Health Check & Troubleshooting plugin allows –

Testing conflict with theme or plugins without affecting the view of your site.Shows your PHP and MySQL versions.Allows assembling information about WordPress and server configuration.Troubleshooting mode allows deactivating and activating theme/plugin without affecting the visitor』s view for your site. This mode also shows the Notices on the site. 

How to Use This Plugin?

Step 1: Install and activate the Health Check & Troubleshooting plugin like any other WordPress plugin. This plugin is free and available on WordPress.orgStep 2: Go to Dashboard > Tools > Site HealthOptions are available under different tabs. 

Previously the plugin used to display more tabs, but with WordPress 5.2 update, many of the features are available in the Core WordPress. Here』s an article on the same.

What Plugin Offers?

Troubleshooting ModeAllows testing conflict cause and detects a particular theme or plugin causing it. You can debug things without affecting visitors』 view. This mode will be visible to you only. 

Tools File Integrity – This is a security check that will compare WordPress files on the server with those delivered from WordPress.org If any files in WordPress are modified for the illegal purpose, it will be tracked using file integrity checkMail Check –  Sometimes there can be the error in Contact Form not sending emails. This option allows you to check if mail is successfully sent from the site or not. If this check shows error there might be a problem in the server configuration.

Plugin Compatibility – Using this feature it will attempt to identify the compatibility of your plugins before upgrading PHP. The compatibility check may not always be accurate, and you may want to contact the plugin author to confirm that things will continue working.

How To Reset WordPress Installation?

How To Reset WordPress Installation?

Creating a new website can be a lengthy process, especially if you need to do some design and plugin testing. Also, if you might have decided to import several Starter Templates on your website to check them out. You probably noticed that pages, posts, media files, etc., can quite pile up this way.

Cleaning up your website manually will take some time, and there is always the possibility that you might miss something. 

Hence, in this document, we will show you how to speed things up by resetting your website to defaults. We will be showing you how to reset your WordPress installation using the following plugin:

Advanced WordPress Reset

Alternatively, you can also use a plugin called WP Reset.

Install Advanced WordPress Reset

We will start by installing the plugin:

Step 1 – Log in to your website and navigate to Dashboard > Plugins > Add New;

Step 2 – Search for 「wp reset」 in the search bar on the top right side of the screen;

Step 3 – Install and activate the plugin. 

Reset Your Website

Before you reset your website, it is essential to understand that the process will reset your WordPress Database back to its original status irreversibly. That means it will permanently remove all of your content (pages, posts, custom post types, comments, media, users, etc.) and customizations.

Thus, we suggest you backup your website before reset if you want to preserve any content. If you』re not sure how to do this, check out our document on how to backup your website.

Also, the theme and all plugins will be deactivated. On the other hand, the reset process won』t remove nor modify your WordPress, themes and plugins files. 

The reset process will also recreate the admin user (with the same credentials) used to initiate the reset so that you can access your website afterward.

To reset your website, follow these steps:

Step 1 – Log in to your website and navigate to Dashboard > Tools > Advanced WP Reset;

Step 2 – In the 「Reset Database」 confirmation field, type in the word 「reset」 and click on the 「Reset Database」 button;

Step 3 – You will be asked to confirm once again. If you』re ready to proceed, click 「Continue」. This will initiate the restart process;

Step 4 – Once the process is done, you will be notified and sent to the login page to log in back to your website. 

Check Your Website

Once you log in again to your website, you』ll see that all of your content has been removed. If you check your plugins and themes, as mentioned, you will see that they are all still installed but deactivated. You can remove any theme or plugin you don』t need and start building your new website from scratch.

If you haven』t tried importing our Starter Templates by now, check them out as they can help you create your websites in no time. You can find out more in these documents:

How to Reset or Delete Your WordPress SiteHow to Install Starter Templates (Free) Plugin?How to Import A Complete Site with Starter Templates?

How Do License Upgrades Work?

How Do License Upgrades Work?

This article explains how license upgrades work.

Lifetime to Lifetime Upgrades:

Customers need to pay only the difference amount.Example – If a user wants to upgrade from Astra Pro ($249 / Lifetime) to Astra Growth Bundle ($699 / Lifetime), he will have to pay only $450 ($699 – $249)

Annual to Lifetime Upgrades:

Customers need to pay only the difference amount (provided they have an active annual license)Example – If a user wants to upgrade from Astra Pro ($59 / Year) to Astra Pro ($249 / Lifetime), he will have to pay only $190 ($249 – $59)

Annual to Annual Upgrades:

In case if you upgrade to annual license, the original date of license expiry is considered, regardless of the date of upgrade. The amount you will be charged will be based on the price difference and the time left in your current subscription before renewal. This means that you will have to pay a complete annual fee in case your earlier license has expired.

Example – A customer purchased an annual license for Astra Pro ($59 / Year) on January 1, 2017. On July 1, 2017, the customer upgrades his license to Astra Growth Bundle ($249 / Year). The price difference is $190 and there are 6 months left in his current subscription period. The customer will pay $95 to upgrade. On January 1, 2018, the subscription will renew and the customer will pay the license renewal amount and own an active license key until January 1, 2019.

The expiration date of the license will not change; an upgraded license will still expire on the original expiration date whether prorated or not.

Note: Above upgrade process will be applied to all Astra packages i.e. ASTRA PRO, Essential Bundle, and Growth Bundle.

How to Upgrade?

Just visit the upgrades page on our store to see your available options.

Have questions? Get in touch, We will be happy to help!

Colors & Background Options for Transparent Header (Old Astra Header)

Colors & Background Options for Transparent Header (Old Astra Header)

Color options for Transparent Header are available with Astra Pro Colors & Background Addon.

Note:

If you are using Astra Header Footer builder available with Astra version 3.0 and above, refer to the document list here.

Activate the addon from Appearance > Astra Options > Colors & Background. After activating the module, you can find the settings under Appearance > Customize > Header > Transparent Header

Below are the available options-

1. Background Overlay Color

You can set an overlay background color for a transparent header.

2. Site Title Color, Site Title Hover Color

If you have enabled site title and site description from site identity tab, you can set its color on a transparent header. A color set will be applied to site title as well as to description.

3. Menu Background Color, Menu Link / Text Color, Menu Link Active / Hover Color

You can set colors for the primary menu with a transparent header.

Transparent Header with Header Sections Addon

If you have activated Header Sections module from Astra Pro Settings and using Above/ Below Header sections then background overlay color set for the transparent header will be applied to above/below header section.While content color will be applied from Above/ Below Header Color settings.

Transparent Header with Sticky Header

Sticky Header will inherit all color settings from a header and primary menu. Transparent Header color will not affect sticky header.

FAQs – Astra Header/Footer Builder

FAQs – Astra Header/Footer Builder

What is Astra Header/Footer Builder?

Astra Header/Footer Builder is a new visual builder inside Astra customizer. This is a powerful way to design creative header and footer for your website. You can add various items in header/footer and arrange a structure with simple drag and drop.

This feature is available with the Astra theme version 3.0.0 and above. Advanced options are available with Astra Pro version 3.0.0 and above.

How can I get Astra Header/Footer Builder?

Astra Header/Footer Builder comes inbuilt with Astra theme while Astra Pro adds advanced options to it.

Astra Theme is available on WordPress here Astra Pro is available on your store account. Just login to your account and visit the Downloads section.

How new Header/Footer Builder will affect old design? Will my current header/footer design be migrated?

No, when you opt to use new Header/Footer Builder, old design will not be migrated. You will need to rebuild the old header/footer design.As soon as you activate new Header/Footer Builder the old design will be replaced and will no longer be visible.

In case you wish to continue using old header/ footer settings, you can choose the option from Astra Options (Appearance > Astra options > Use Old Header/Footer).

What will happen to my Above and Below Header from Astra Pro?

Above and Below Header will be available from Astra theme now. Though advanced options will come from Astra Pro. As mentioned in the above answer, when you switch to a new Header/Footer Builder, you will have to rebuild old design.

What will happen to my Typography, Spacing, Colors & Background Addon options in the new Header/Footer Builder?

All the Typography, Spacing, Colors & Background options will remain the same with respect to new Header/Footer Builder. That means when you activate these addons, respective options will be added into customizer for individual elements like Primary Menu, Secondary Menu, etc.

What are different elements do I get with Astra theme and Astra Pro plugin?

Here is a complete list of widgets available in new Header/Footer Builder with Astra theme and Astra Pro.

Do I have a limited no of Elements or Can I Use Multiple Elements in header/footer?

You get all the elements as mentioned in the list above. But in case you need more elements, you can get it with Astra Pro. Refer article here to see how.

Getting the Most Out of Astra Theme

Getting the Most Out of Astra Theme

Astra Theme Walkthrough Docs:

Astra Theme WalkthroughThis Is Your CustomizerStyle Your Website With Global SettingsBuild Your Header Find the Way With Breadcrumbs Set Up Your BlogAdd Your SidebarsBuild Your FooterHost Google Fonts Locally – Performance Is the KeySee Other Customizer OptionsHow To Build Quick Sites With Astra?Getting the Most Out of Astra Theme (currently reading)

Free Theme and Constantly Evolving

Astra theme started in 2017, and in 2020 it already had more than 1+ million active installs. Very quickly it became one of the Fastest, most Lightweight, and Highly Customizable themes for WordPress.

As you probably know WordPress is an open-source content management system. Being an open-source means that anybody can contribute to it. 

Keeping in mind that all of them have kind of unique living styles, you can imagine that the developers can have more or less different coding styles. That is why we have WordPress Coding Standards. Astra theme strictly follows these standards, using constantly very clean code, so it』s very simple for anybody to work with it. 

One of the reasons that theme is so popular, is that it』s constantly evolving and becoming more advanced while staying completely free. Since its beginnings we have released more than 200 theme updates, more than 270 templates, integrations with WooCommerce, LearnDash, LifterLMS, Easy Digital Downloads, etc.

When Gutenberg builder was added to WordPress 5.0 we made the Astra theme fully compatible from the start. We also added our free Ultimate Addons for Gutenberg that come already included with the Astra theme. And not to forget, the Astra themes』 compatibility with Elementor, Beaver Builder, and Brizy too. 

All of this was coupled with the constantly expanding list of the theme features as well as a solid number of fully compatible free and paid plugins.

Astra 3.0 Theme Improved the Customizer Speed

With each Astra theme update, we are working on improving the performance of the theme and especially the Customizer. And with Astra 3.0 we made quite a leap forward – our already fast Customizer became 70% faster!

Using React JS combined with a lazy-loading feature which is also incorporated in the customizer, our customizer dropped from great 3.5 seconds to loading in around 1 second.

Since then, most Astra theme updates continuously bring further improvements and optimizations.

Astra Theme 3.0 also Brought a lot of Other Changes

Besides the Customizer speed increase, Astra 3.0 brought even more advancements and functions.

We optimized HTML and CSS significantly reducing the amount of code. The result is that our average page load times were reduced from 0.9 seconds to 0.7 seconds!

The biggest improvement that came with Astra 3.0 was our new Header Footer Builder. This created a completely new experience of visual Header and Footer building with a significant number of available elements and options, different Header and Footer design layers (Above, Primary, and Below), and much more.

With the following major updates, came the completely redesigned customizer UI that was covered by this guide, as well as new controls to duplicate and delete header and footer elements, Google Web Stories, SVG Icons support, Related posts… and there are many more to come.

Free Plugins

We constantly strive to help our users have an amazing website-building experience. You can check some of our free plugins that you can use:

All In One Schema Rich Snippet – you probably heard about schema markup? It』s a code you place on your website which provides additional information to help Search Engines understand what is the content on your pages really about. You can use this plugin to easily implement schema types like Review, Events, Recipes, Article, Products, Services, etc.

Ultimate Addons for Beaver Builder Lite – these ultimate addons will boost your Beaver builder with great additional modulus.

Elementor – Header Footer & Blocks Template – using this plugin you can add headers, footers, and blocks anywhere on your website and design these by Elementor without needing any other plugin or addon.

And these are just a few of the free ones. Feel free to also check out some of our premium plugins.

Education

On top of the Astra theme and our products, we are proud to provide great support for both our free and Pro users. Our Blog and extensive Knowledge base cover a massive amount of detailed documentation, articles, and guides for building websites with Astra.

Though our products are simple to use and developed with user-friendliness on our minds, they are continually evolving. That is why we regularly update and expand our Knowledge base.

Next to the docs that will clarify any bump or issue you might encounter with Astra, we also create detailed guides, walkthroughs, and blog articles to make your work easy and help you get the most out of the Astra theme and our other products.

Support & Community

On top of the Astra theme and our products, we are proud to provide great support for both our free and Pro users. Our Blog and extensive knowledge base cover a massive amount of detailed documentation, articles, and guides for building websites with Astra. 

Further, our Support team is available to help you 24/7, all year round with any issues you can』t solve on your own or couldn』t find in our knowledge base or blogs. Just drop us a message here and our support engineers will help you out in no time. 

Last but not least Astra theme is backed by a huge community ready to help and share knowledge at all times. Join our Facebook groups to become a part of Astra Comunity:

Astra WordPress Theme CommunityAstra and Elementor Users

Astra Pro

We hope that you enjoyed this Astra Theme Walkthrough. As we work on constantly improving our free theme, we know that some of our users require more powerful features, an enhanced list of customization options, and premium support. For this reason, we created Astra Pro Addon. 

Please check the full list of features available with Astra Pro and our comparison with the Astra free theme.

We invite you to visit our official website and find out more about the world of Astra.

Growth and Essential Bundle

Having Astra Pro is a great addition to your theme, but you might also need additional options for your content or a boost in your online sales. Also, if you build websites for your clients, you might be dealing with a number of different requests and preferences.

This is where our Bundles step in. Next to Astra Pro which is included in our bundles, you would be getting additional products to help you expand your business and premium support.

Essential Bundle is a great choice to boost your online business or start the agency or freelancer work. Mini-Growth Bundle gives you a balanced mix with just the right combination of products you would need like:

Ultimate Addons for Elementor or Ultimate Addons for Beaver Builder (you can choose the one you prefer) to expand your preferred Page builder capabilities and help you build amazing website designsPremium Starter Templates and WP Portfolio plugin.

You can find more details about the Essential Bundle in this article.

Furthermore, our Growth Bundle will boost your traffic (Schema Pro plugin) and your conversions (Convert Pro plugin), while giving you both page builder addons (Ultimate Addons for Elementor AND Ultimate Addons for Beaver Builder) and access to our SkillJet Academy. You can find more details about Growth Bundle in this article.

Previous: How To Build Quick Sites With Astra?

Starter Templates — Basics and FAQs

Starter Templates — Basics and FAQs

Astra provides a stunning library of pre-built templates. Instead of designing a website from scratch you can import Starter Templates (formerly Astra Starter Sites) with few clicks and customize them in your own way.

Starter Templates are available with your favorite page builders and WordPress default editor – Elementor, Beaver Builder, Brizy and Gutenberg Editor.

Starter Templates library has a number of templates, some are FREE (without any tag) while some are marked with a PREMIUM tag.

FREE and Premium Starter Templates

Templates without any tag ( Free Starter Templates )Templates with tag – PREMIUM ( Premium Starter Templates )

Templates Without Any Tag ( Free Starter Templates )

Starter Templates that do not have any tag are available for free. These templates are built with free resources like – free versions of page builders (Elementor, Beaver Builder, Brizy) and free external plugins.

How to Import? – For a detailed step-wise explanation on how to import the FREE starter templates, you can refer to the article here.

Templates With Tag PREMIUM

In the library, templates with PREMIUM tags are accessible only to those who own the Essential Bundle and Growth Bundle.

Why is it so? – In 『Premium』 templates, you will see advanced design styles and features. These sites are built with – Page builders (Elementor, Beaver Builder, Brizy) and a few of the premium plugins.

Note: The Growth Bundle owners can access all the sites marked as Premium. While those who own an Essential Bundle can access the Premium sites for a specific page builder (depending on their choice) only.

How to Import? – The Essential Bundle and Growth Bundle comes with the Premium Starter Templates plugin. You will find it along with the other plugins in your store account. Refer to the article here to see how you can install the plugin.

Transparent Header in Astra Theme

Transparent Header in Astra Theme

From Astra Theme Version 1.6.0, Transparent Header option will be available with free Astra Theme. Prior to this version, Transparent Header option was available with Astra Pro Addon plugin.

See the initial announcement post for this feature.

Note:

If you are using Astra Header Footer builder available with Astra version 3.0 and above, refer to the document list here.

Quick Steps on How to Add Transparent Header on Your WebsiteStep 1: Find the Transparent Header Options under the customizer [ Appearance > Customize > Header > Transparent Header ] to edit Transparent Header Options.Step 2: Under the Transparent Header section you can Enable it on complete website, set a different logo, and add a Border Bottom color.

How Transparent Header Works?

Transparent Header allows you to easily create beautiful and attractive headers. Enabling this option will set your primary header background to transparent and pull the page content to the top. It will merge the primary header and the page』s content. That means your top part of the page content will be set as a background to the transparent header.

For example, if the page contains an image as a top section, it will be pulled up and set as a background image for the transparent header.

Layout settings for Transparent Header

After updating the Astra theme to version 1.6.0 and above, Transparent Header settings will be available in the customizer. From the WordPress dashboard navigate to Appearance > Customize > Header > Transparent Header. Below are the available options.

Enable on Complete Website

Tick the checkbox for this option if you wish to display a transparent header on the entire website. When you enable this option, it offers the following exclusion rules. That means you can choose some pages and posts, where the transparent header can be disabled.

Disable on 404, Search & Archives?: This setting is generally not recommended on special pages such as archive, search, 404, etc. If you would like to disable the transparent header on these pages, tick the checkbox.Disable on Blog Index page?: From Homepage Settings, if you have set Your homepage displays > Your latest posts then the front page becomes a Blog Index page. If you would like to disable the transparent header on it, tick the checkbox. Disable on Pages?: If you wish to disable the transparent header on all pages, tick the checkbox. Disable on Posts?: If you wish to disable the transparent header on all posts, tick the checkbox.

Note: Transparent Header can be set from Page Meta settings as well. Just Edit the page/post, in the right sidebar, you will find the Astra Settings section. This allows you to enable/disable transparent header for particular page/post. Note that the page meta setting has high priority than a customizer setting.

Enable On

Choose a device to display a transparent header. Options are –

DesktopMobileDesktop + Mobile

Styling

Different Logo for Transparent Header?: When you enable transparent header, by default it displays the site logo set under Layout > Header > Site Identity. If you wish to set a different logo that site logo on the transparent header, tick the checkbox and set a logo.Bottom Border Size and Color: Set a bottom border for a transparent header.

Colors & Background for Transparent Header

Settings are available in the customizer under Header > Transparent Header. Set different colors for a transparent header with the following options –

Background – Background Color of the Transparent HeaderSite Title – Site Title ColorMenu – Background Color, Link / Text Color, Link Active / Hover ColorSubmenu – Background Color , Link / Text Color ,Link Active / Hover ColorContent – Text Color, Link Color, Link Hover Color

Note:

1. Typography for Transparent Header will be inherited from Global > Typography > Base Typography.2. Transparent Header can be enabled or disabled for a particular page from Page Meta settings.

Build Your Footer

Build Your Footer

Similar to the Header, the Footer is a section shown across all (or almost all) pages and posts on your posts. The main difference is that the Footer is located at the bottom of your website. Thus, contrary to Header, the Footer is often the area that website visitors see the last. It』s not rare that people miss the opportunity to build a good footer, but this can really make a difference with keeping users on your website as well as with conversions, subscriptions, etc.

This is the place where your visitors expect to find some key information like company details, contact information, social media links, or some additional or related content and links.

This is often a great place to add your links to other offerings you might have or put the most important links and call to action buttons to avoid the need of scrolling back to the top. 

Astra Theme Walkthrough Docs:

Astra Theme WalkthroughThis Is Your CustomizerStyle Your Website With Global SettingsBuild Your Header Find the Way With Breadcrumbs Set Up Your BlogAdd Your SidebarsBuild Your Footer (currently reading)Host Google Fonts Locally – Performance Is the KeySee Other Customizer OptionsHow To Build Quick Sites With Astra?Getting the Most Out of Astra Theme

Here again, the Astra theme comes with a drag & drop Footer Builder allowing you to build your footer equally easy as your header.

General and Design tabs

General tab is your default view when opening the Footer Builder. Here you have an overview of your footer setup.

On a left side menu, all of your active footer elements will be listed.

Rest of the screen is showing a live preview of your footer and the position of your elements across footer sections in your Visual Footer Builder.

Design tab gives you options of setting the Background Color & Image for the whole footer, as well as adding Padding and Margin.

Visual Footer Builder

Same as with Header, the Visual Footer Builder consists of three separate sections too. 

These three Footer sections are:

Primary Footer  – the middle section; this is your main footer section.

Above Footer – the upper section; often this is the place to add your subscription form or call to action buttons

Below Footer – the lower section; usually Copyright information and come contact or company information are placed here (like address, phone number/e-mail, company registration number etc.)

As with the header sections, each footer section customizations are accessed by clicking on the 「cog」 icon on the left side of the sections.  

Each section has two tabs:

General tab – Footer

Column – select the number of columns you want to add to this footer section;

Layout – choose the column layout based on the selected number of columns;

Inner Elements Layout – display widgets in the same column Stacked (on top of each other) or Inline (next to each other) 

Width – set the footer content width to Full Width (edge to edge) or to Content Width

Height – set height of this footer section.

Vertical Alignment – vertically align element content across all the columns within this footer section to Top, Middle or Bottom of the section.

Hide on Mobile – hide this header on mobile devices.

Design tab – Footer

Top Border Size (& Color) – add the top border to the footer section by setting the size of your border.

Border Color – Once you set your border size, an additional option will appear (Border Color) for choosing the color of the border;

Background – set this footer background color;

Inner Column Spacing – add space within each column;

Padding – add padding on one or more sides of the footer; 

Margin – add a margin on one or more sides of the header. 

Each footer section can be customized separately for desktop and mobile. You can add different footer elements or change their positions for each viewport.

Footer Elements

You can build your footer the same way as your header. Compared to Header Builder, the Footer Builder offers a somewhat smaller number of elements. You will be able to add the following elements to your footer sections: Footer Menu, Social, HTML, Widget, and Copyright.

Further down, we will show you how to use elements specifically available for the footer and a few of those used also for headers but with slightly different settings. The Rest of the elements are used the same way as with Header Builder.

Primary Menu

Here, you will see the menu items you added to your Footer Menu (Dashboard > Appearance > Menus). 

In the General tab you can set the menu Layout to Inline or Stack and set the menu items Alignment.

The Design tab will allow you to set the Text and Background colors, Menu Font Size, Menu Spacing and Margin.

Social (Footer)

Compared to the Social element used for header, the footer Social element has the additional Alignment option in the General tab 

Copyright

This element allows you to simply add and style your Copyright and it can be used only within the Footer. You can use the following shortcodes here:

[copyright] 2021 [site_title] [theme_author]

Previous: Add Your Sidebars

Next: Host Google Fonts Locally – Performance Is the Key

How to Add EDD Cart in Header? (Old Astra Header)

How to Add EDD Cart in Header? (Old Astra Header)

This is a premium feature available with the Astra Pro Addon plugin and old Astra Header (prior to Astra 3.0.0). To use this Pro feature, you need to have the Astra theme along with the Astra Pro Addon installed on your website.

With Astra, it is possible to add a cart icon for the Easy Digital Downloads plugin with simple settings. This article will explain how to add a cart icon in the primary header.

Before that please verify if you have the Easy Digital Downloads plugin installed and activated.

Make sure you have activated the Easy Digital Downloads plugin.

To find the setting, from the WordPress dashboard navigate to Appearance > Customize > Header > Primary Menu > Last Menu in Item and choose Easy Digital Downloads. It will display the Easy Digital Downloads cart icon at the end of the primary menu.

Like the primary header, you can add a mini cart to Above Header and Below Header.

Make sure the Header Sections addon is activated.

Then go to Appearance > Customize > Header > Above Header > Section ( 1/2 ) and choose Easy Digital Downloads.

Astra Pro』s Easy Digital Downloads add-on provides options to change the cart icon, add styling to it, display cart title and total. After activating the addon the setting can be found in the customizer under  Customize > Easy Digital Downloads > General

Apart from the header, you might need to display a mini cart icon anywhere on the site.  Easy Digital Downloads addon from Astra Pro Provides Mini Cart Shortcode, that allows you to display the mini cart icon anywhere you want.

[astra_edd_mini_cart]

Refer to the article here for more information.