Wordpress Theme Usage - Astra - NETSEC


Learning, Sharing, Creating

Cybersecurity Memo

Saturday, March 28, 2020

Wordpress Theme Usage - Astra

With the development of mobile Internet, website speed and user experience are becoming more important. More and more people are choosing some lightweight WordPress themes. Previously, WP Theme Station introduced a lightweight GeneratePress theme , which is very light. Quantity and flexibility, today we will introduce a theme that is more popular than it- Astra theme
Astra Theme is a lightweight WordPress theme that can be used to make various types of websites. It is a theme developed by the Brainstorm team. Brainstorm has developed many well-known WordPress related products, such as Ultimate Addons for Elementor, ConvertPro , SchemaPro and other plugins developed by the team. Astra theme is one of their most focused products. At present, there are 500,000 websites using the Astra theme in the official website of WordPress, and there are nearly 3,000 five-star praises.


Astra Theme
Astra is a lightweight multi-purpose theme produced by the Brainstorm Force team. They have a lot of experience on WordPress page editors, such as Ultimate Addons for Elementor, Ultimate Addons for WPBakery Page Builder are their products, and the same is Astra. The theme is also a theme made for use with the page editor. The theme comes with a lot of custom options and custom templates, and it has very good support for Elementor and BeaverBuilder .
Download link:

Next, let's take a look at the features and functions worth seeing in Astra

Lightweight and high performance

The reason why the Astra theme is recommended is first and foremost because it is very lightweight. The theme does not load any extra resources. All the code is specially optimized for speed. In order to improve performance, Astra uses a more lightweight Vanilla JavaScript, which can achieve most of the effects without relying on Jquery. The initial theme loading resources are very small and can be loaded in a short time.
The tests below are tested without any plugins and extensions

Astra themed speed

After enabling all extensions, there will be more resources to load, but the loading speed is still excellent

Astra theme installation speed test after extension

Strong customization

There are many lightweight themes, but not many that can be completely customized by users. Astra has a lot of customization options, allowing you to define the style of any area of ​​the website.
You can customize the header of the website, change the logo position, change the content width, and set the mobile menu separately, set the style of transparency and ceiling navigation, etc.
You can choose the site layout independently, including full width, fixed width, box layout, etc. You can customize the width of the content, and you can choose different layouts for different pages

In footer customization, support for filling custom text and menus, and you can also set your own footer widget

For visually focused websites, you can also customize the font, color, etc. of the theme

And in most of the customization options, in addition to the core options, there are also margin adjustment options that allow us to adjust the site to a satisfactory look

Modular design

In order to be suitable for more people, Astra also adopts a modular design. You can selectively enable it according to your needs, or you can reduce resource loading to a certain extent and improve website performance.
In addition to the commonly used modules such as the color background, font style, spacing, and blogs used in ordinary websites, Astra also provides support for some professional plugins, including WooCommerce, Easy Digital Downloads, LearnDash, and LifterLMS.
Regarding the choice of opening the Pro extension, you don't need to pay much attention to it. Which modules are needed? Just open it and you can modify it at any time.

Custom layout (Hooks system)

Like GeneratePress, Astra Pro also comes with a Hooks system that allows us to insert content into the website, but its name in Astra is called Custom Layout.

Astra custom layout

In the custom layout, we can insert the content we want anywhere on the website, support graphic content and code, support different display ranges and role permissions
To use Hooks, we first need to enable the custom layout module in the Astra extension.
Appearance-Astra Options-Custom Layout-Active

astra open custom layout module

After activating the module, refresh the page and you will see a Custom Layouts tab under the appearance submenu. This is where we add and manage Hooks

astra add hooks

Click Add New to add a custom layout
By default you will see the interface of a classic editor
Here you can insert graphic content directly
Or, if you are a developer, you can also click the Enable Code Editor above to add custom code and support PHP, Javascript, CSS and other syntax

After completing the content, we can set the Hooks option
There is a Layout option at the bottom, we set it to Hooks

Then you will see a lot of options

astra theme hooks options

Here are the functions of these options
  • Action: Indicates where the Hooks are inserted in the theme, such as the head of the website, the beginning of the article, or the end of the article, etc., are controlled by this option. You can determine the explicitly added location through the Hooks view provided by the official Astra
  • Priority: indicates the priority. If you need to insert multiple Hooks in the same area, this module is useful. You can use it to control the respective order. The smaller the value, the more it will be displayed in front.
  • Spacing: indicates the distance up and down. If you want to leave some space above and below Hooks, you can use it.
  • Display On: indicates the page that will be displayed, for example, you can use it in the entire site or in a specific article
  • User Roles: display according to user permissions, such as choosing login users or guests, only visible to administrators, etc.
Through the Hooks option of Astra, we can achieve very precise control of the content, whether it is theme modification, content addition, permission control are very practical tools, both developers and ordinary users are highly recommended to use

Demo Station and Visual Editor

Astra provides agency users with hundreds of demo sites , all of which are made by different visual editors, including Elementor, Beaver Builder, Brizy, Gutenberg. No matter which editor you are using, you can cooperate with it. Astra theme use

astra theme import demo site

All demo stations can be imported with one click. Astra will automatically install the relevant plugins and configure the corresponding options for you when importing. The better thing is that it will also shut down unnecessary modules for you, improve website performance, with the help of Starter Sites plugin, allowing site builders to quickly set up a site, even if you are new to building a site, you can quickly make your own website

Astra Starter Sites

Astra Starter Sites is a plugin specially made for the free version of Astra theme, providing free demo site import

After installing the plugin, you will see an Astra Starter Sites option in the appearance menu
Open this option, you can see hundreds of demo sites of Astra, but by default, it will show all demo templates including paid version, and paid templates cannot be imported
The trick here is that you can click on the Free tab above to filter out all the free templates.

astra theme free demo site

See that there is a suitable demo site, you can open the details, click the Import Site button, you can import all the content of the demo site

astra import demo options

The default option imports all demo site content, including required plugins, custom settings, website content, gadgets, etc.
If you are a new site, you can import all content directly; if you already have content, you can consider importing only the layout option, or delete the previous content

Astra is a very powerful and excellent theme. If you are still looking for a theme for your website, hurry up and try Astra. More tutorial can be found from here

No comments:

Post a Comment