Astra Pro WordPress Theme Tutorial

Astra Pro 使用教程

Astra Pro is a robust WordPress theme suitable for a variety of websites. This tutorial will guide you through the installation, configuration, and use of some of Astra Pro’s essential features. Astra Pro is the premium version of the Astra theme. If you wish to use the premium version, you need to purchase it from the official website. Alternatively, if you start with the free version and wish to upgrade, you can do so by making a purchase later.

Differences between Astra and Astra Pro

The paid version of the Astra theme includes the Astra theme itself along with several premium plugins, while the base Astra theme is available for free. These premium plugins allow for advanced functionality within the Astra theme. There are three pricing plans for the paid version of Astra: Astra Pro, Essential Bundle, and Growth Bundle. The Growth Bundle offers the most comprehensive set of features, and you can choose to purchase based on your needs.

Image 184

Astra Addon Plugin (Astra Pro Package): This enhances the appearance settings of the Astra theme, including options for colors, backgrounds, fonts, blogs, menus, navigation, back-to-top, and enhanced configurations for stores.

Premium Starter Templates Plugin (Essential Bundle Package): Provides premium website templates, assisting users in quickly setting up websites with a professional look and functionality.

Ultimate Addons for Elementor Plugin (Growth Bundle Package): This is an extension for Elementor, offering additional block elements when editing pages within Elementor, thereby enriching the editor’s capabilities. Upon installing this plugin, there will be a prompt on the interface to install the Elementor plugin, which you can initiate by directly clicking on the prompt button.

Advantages of Astra Pro

The well-known WordPress theme Astra Pro is a creation of Brainstorm Force. The theme aims to provide users with a flexible and user-friendly platform for creating websites with a professional look and functionality. Astra Pro offers several advantages, including:

Fast Loading Speeds: Astra Pro is a lightweight theme, resulting in remarkably fast loading times. This enhances the user experience and boosts SEO rankings.

Design Flexibility: Astra Pro offers a myriad of design options, allowing for easy customization of a website’s look and feel. This includes options for colors, layouts, fonts, and more.

Broad Integration: Astra Pro is compatible with many popular WordPress plugins, such as WooCommerce, Elementor, Beaver Builder, etc. These plugins help users augment their website’s functionality and features.

Responsive Design: The theme is responsively designed to adapt to various device sizes, including desktops, tablets, and mobile devices.

SEO Friendly: Astra Pro employs standard HTML and CSS coding, aiding in the enhancement of a website’s SEO ranking.

In summary, Astra Pro is a feature-rich, user-friendly, and versatile WordPress theme suitable for various types of websites, including business, blogging, e-commerce, and more.

Installing Astra Pro

First, you need to install both the Astra theme and the Astra Pro plugin on WordPress. Follow the steps below:

1. Log into your WordPress dashboard.

2. Navigate to Appearance > Themes and then click “Add New”.

3. Search for “Astra”, find the Astra theme, click “Install”, and then click “Activate”.

Image 183

4. After logging into the account where you purchased Astra Pro, download the Astra Pro Addon Plugin. Then, go to “Plugins” > “Add New” > “Upload Plugin”, install it, and then click “Activate”.

Image 175

5. On the settings page of the Astra Pro plugin, enter your license key to activate the plugin.

Image 173

Importing Pre-made Websites

Astra Pro offers a variety of pre-made website templates to help you quickly set up a website. To import a pre-made website, follow these steps:

1. Log into the account where you purchased Astra Pro and download the Premium Starter Templates. Then, go to “Plugins” > “Add New” > “Upload Plugin”, install it, and then click “Activate”.

Image 187

Alternatively, in the plugin center, search for “starter templates” and install the free version. Ensure the author is “Brainstorm Force”. The free version won’t have the selection of premium themes.

Image 182

2. Navigate to Appearance > Starter Templates.

Image 171

3. Click on “Build Your Website Now”.

Image 179

4. Choose your preferred website builder, such as Elementor, Beaver Builder, or Block Editor. It’s recommended to use Elementor, as it’s one of the most popular website builders currently. You can also click here to view tutorials on Elementor.

Image 172

5. Browse through the library of pre-made websites, select a template, and click on “Preview”. Those labeled with “PREMIUM” in the top right corner require the installation of the Premium Starter Templates plugin to use.

Image 186

6. On the preview page, click “Import Website” and then wait for the import process to complete. After selecting the template, you can upload a logo and set its display width. If you don’t have a logo at the moment, you can upload it later. Click the button to proceed.

Image 185

Next, you can choose a color scheme and fonts. If you’re unsure about your choices at this point, you can always make changes later. Click the button to continue.

Image 188

There are four choices by default in the image below: 

1. Import the website’s customizer settings

2. Import widgets (small tools, typically used for sidebars)

3. Import content (like articles or products)

4. Share non-sensitive information with the theme’s official team

For beginners, my recommendation is to keep the default settings and click the button to submit.

Image 173

Next, patiently wait for the website to import. Make sure not to close the webpage during this process.

Image 174

Once you see this screen, the installation has been successful.

Image 180

Next, we can start modifying the content of the imported pre-made theme.

Customizing Theme Settings

Astra Pro allows you to customize a plethora of global settings. To make these customizations, follow the steps below:

1. Navigate to Appearance > Customize.

Image 169

2. Click on “Site Identity” and then click on “Site Title and Logo Settings”. From here, you can change the website’s LOGO and site title.

Image 177

As you scroll down, you’ll also find settings for the subtitle and site icon. The site icon will appear in the browser tab.

3. Using the menu bar on the left, browse through the various setting options, such as layout, colors, fonts, background, etc. Adjust these settings according to your needs and preview the changes in real-time. Once you’re satisfied with the settings, click “Publish” to save the changes.

Configuring Layout and Color Options

Astra Pro offers a wealth of layout and color options. To configure these options, follow the steps below:

1. Navigate to Appearance > Customize > Global.

2. Select the global section you wish to configure, such as font styles, colors, containers, button settings, etc.

3. Adjust the settings according to your preferences.

Image 178

Setting Up the Navigation Menu

To set up the navigation menu, follow the steps below:

1. Navigate to Appearance > Menus.

Image 170

2. Click on “Create a new menu”, give your menu a name, and then click “Create Menu”.

3. Using the menu item selector on the left, add pages, categories, etc., to the menu.

4. Drag and drop the menu items to adjust their order and hierarchy.

5. In the “Menu Settings” section, choose where you want the menu to be displayed (e.g., primary navigation, header, or footer).

6. Click “Save Menu” to save your changes.

Image 181

Using Astra Pro Features

Astra Pro offers many advanced features, such as transparent headers, sticky headers, additional sidebar options, and more. To enable and configure these features, follow the steps below:

1. Go to Astra Options.

2. In the Astra Pro Modules section, activate the features you need.

3. For some features, you’ll need to navigate to Appearance > Customize to configure them. For instance, to set up the transparent header, go to Customize > Header > Transparent Header and adjust the settings as per your requirements.

4. Once you’re satisfied with the configurations, click “Publish” to save your changes.

Image 176

Support and Resources

If you encounter any issues while using Astra Pro, the following resources are available to assist you:

1. Astra Documentation: Comprehensive documentation that covers all the features and settings of both Astra and Astra Pro.

2. Astra Community Forum: A community of users and developers where you can ask questions and share experiences.

3. Astra Support: If you come across issues that you can’t resolve, contact the Astra team to get official support.

We hope this tutorial helps you better understand and utilize Astra Pro. Best wishes for success in building and customizing your WordPress website!

Scroll to Top