How to Use Astra Widgets

rple and blue gears: How to Use Astra Widgets

This post will show you how to use Astra Widgets to quickly add widgets into your WordPress site.

If you’ve already set up a site using the free Astra theme or Astra Pro plugin, this post is for you!

Astra Widgets is a handy little free plugin that lets you display address, list icons or social profiles within the Astra Theme.

You decide where you want to place the widget on your site.

You can add the widget into your header, sidebar, footer bar or footer widget.

And then add your information to the specific fields within that widget.

For example, you can see how the Astra: Address Widget looks over in the right sidebar of this post where it says “Contact Us.”

You can choose whether or not you want to display the icons, which I’ve chosen to display here:

Astra: Address Widget

So let’s see how this is done!

How to Set Up and Use Astra Widgets

In order to use Astra Widgets, you need to download, install, and activate the free plugin.

Once done, go to Appearance > Widgets.

You’ll see three new widgets from which to choose:

Available Astra Widgets

Next decide where you want the widget to appear, configure the settings and save it.

We’ll look at each of the available widgets:

  • Astra: Address
  • Astra: List Icons
  • Astra: Social Profiles

First we’ll see how to use the Astra: Address Widget to display your address in the sidebar.

Then we’ll look at Astra: List Icons and Astra: Social Profiles widgets.

Display Address

To display your address in a sidebar, follow the steps below.

  1. Go to Appearance > Widgets.
  2. Click Astra: Address
  3. Select Main Sidebar
  4. Click Add Widget
  5. Configure your address widget with your information
  6. Click the Display Icons checkbox if you want icons to show like the “Contact Us” example above

Here’s a step-by-step demo below:

Astra: Address Widget

And now your sidebar will have the address widget!

Display Social Icons

Or maybe you want to display your social icons in your header menu like this:

Astra Widgets: Social Profiles

In just a few steps you can set up and use Astra Widgets to display your social icons in your header:

  1. First add the Astra: Social Profiles Widget to your Header
  2. Add your social profile links
  3. Add the Widget as the last item in your Primary Menu

Let’s first look at how to add Astra: Social Profiles to the Header.

Add Astra: Social Profiles to Header

  1. Go to Appearance > Widgets
  2. Click Astra: Social Profiles
  3. Select Header
  4. Click Add Widget
  5. Configure your Social Icons Widget

Once the widget is added to the header, click Add Item then Add Profile.

Add Astra: Social Profiles

Then add your information into the settings:

Add Social Platform Settings

Then repeat for remaining platforms by clicking the Add Profile link.

When done, click Save.

The final step is to add that widget as the last item in your primary menu. Here’s how:

Add Astra: Social Profiles Widget to the Primary Menu

Follow these steps to put that widget in the menu header.

Go to Appearance > Customize > Header > Primary Menu.

Under the “Last Item in Menu” selection, click the dropdown and choose Widget.

Astra Widget: Last Item in Menu

And that’s it! Your Social Icons widget will now display in your header menu.

Display List Icons

The last widget we’ll look at is Astra: List Icons.

Configuring this widget is similar to the social icons.

For this demo, we’ll add the List Icons to our Footer Widget.

But first you’ll need to choose a Footer Layout because the theme default is no footer widgets.

To do this with the free Astra theme, go to Appearance > Customize and choose the 4-widget layout:

Choose 4-Widget Layout

If you’re using Astra Pro, you have up to 8 configuration options.

So go to Appearance > Customize and select from one of the following formats:

Choose Footer Widget Layout

Next, in order to use Astra Widgets to display a list in a footer widget such as Footer Widget Area 1, follow these instructions:

  1. Go to Appearance > Widgets
  2. Click Astra: List Icons
  3. Select Footer Widget Area 1
  4. Click Add Widget
  5. Configure your List Icons Widget

You can follow the step-by-step demo below for configuring the List Icons.

How to Use Astra: List Icons

And now you’ve know how to add Astra: List Icons Widget to a Footer Widget Area.

Here’s an example of Astra: List Icons in Footer Widget 2:

Astra: List Icons in Footer Widget 2

So you see how you can add some nice features to your website when you use Astra Widgets.

Astra Widget Video Demos

As time permits, I’ll be adding short video tutorials for each of the Astra Widget types.

How to Add an Astra Address Widget
How to Add an Astra List Icons Widget

I hope this post has been helpful and you understand how to use Astra Widgets with your Astra theme!

Related Posts

Leave a Reply

Notify of
Scroll to Top