by Bernadett Toth on August 30, 2018

Build Your Website Easily with Astra Theme and Smart Slider 3

In our busy world we can’t spend lots of time building websites, sometimes we have just a few days. But if you aren’t a developer, can you build a website? Can you make it in such a short time? Can you simply customize and make it responsive? Yes, it is possible! With the Astra Theme and with a slider you can build a good-looking site just in a few hours. And with a slider you can cheer up your site. Smart Slider 3 is a great possibility to realize this in your Astra Theme.

In this article I will show you how you can build your website with Astra Theme and Smart Slider 3.

About Astra

Astra is a very simple and customizable theme in which you can customize your own content. This theme has simple editing options. The Theme is available for free at WordPress.org and it has wide-ranging popularity. It has 200,000+ active installs and 5/5 stars rating.

So you can trust it!

Astra Theme for WordPress
Astra Theme for WordPress

Astra is made for page builders, therefore you can customize it without a coding knowledge. You can change the design in the WordPress Customizer. Besides that it offers you ready to import websites. You should just install the Astra Starter Sites plugin to get the beautiful layouts.

Using the Astra Theme is very extensive. You can use it for your blog or you can make an eCommerce, a small agency or a business website. You can change everything in the Theme, and can reach the result what you imagined.

It is important mention that Astra is made for speed. And this isn’t just a “marketing trick”, this is a real fact what the Theme promises. But I will write about that later.

Has the Astra Theme slider tool? Unfortunately not, and I miss it. Slider makes your site more expressive, but you can use the Smart Slider 3 plugin, and you can easily put it into your theme. So if you want to build a website using free tools, Smart Slider 3 with Astra Theme provides you a great option.

How about page builders?

Page builders are very populated in WordPress. You should just imagine what you want, and with simple drag and drop your website is ready. But a page builder can’t work well without a good theme. A theme should be optimized to be highly compatible for page builders.

Astra offers different solutions with which you can be sure that your website will look exactly how you imagined it. It gives you more space to focus on design. At the post and pages you can disable the header, title or the footer. You can switch a layout inside a post/page, and you can choose a sidebar option as well.

Astra Settings
Astra Settings

So Astra lets you customize every setting on every page, so you can simply personalize your website. You can focus on the content. There aren’t places what you can’t change with a page builder, if there is something, you can easily switch that off.

How about sliders?

Nowadays I can’t imagine a website without a hero image, and a slider is an extended version of that. In a slider there are multiple versions of your hero images which you can make your site even more professional with.

Sample Slider in Smart Slider 3
Sample Slider in Smart Slider 3

Sliders are particularly good design tools which allow images, videos and other content like CTA buttons. The content can be expressive and maximizes the space on your website as well.

When a person visits your website, it makes a good impression on them if your site:

  • is easy to read,
  • simple,
  • clear,
  • and good-designed.

And sliders can add these conditions for your website.

Smart Slider 3 Icon
Bring Your Ideas to Life
Powerful. Visual. Intuitive. Smart Slider 3 is the most advanced slider and block creation tool for WordPress and Joomla.

Tutorial: Astra Theme with Smart Slider 3 – Website in 1 Hour

Import a template from Astra Sites

In Astra there are a lot of free and premium ready to import websites. You should download just the Astra Starter Sites plugin and you can choose which page builder you are using: Elementor or Beaver Builder.

Select your page builder in Astra Sites
Select your page builder in Astra Sites

Using these templates is a good choice, they look gorgeous, modern and can be imported easily. Some of the templates are only available in paid version, but there are a lot for free ones.
You can preview them and by 2 clicking you can import what you want.

First you should install the plugins which are in your chosen template.

Install plugins in your template in Astra Sites
Install plugins in your template in Astra Sites

Finally you can import the site.

Import a template in Astra Sites
Import a template in Astra Sites

Import a slider from the Template Library

You have a ready template now and you need just a slider to the top. You can use slider easily in Astra Theme, and if you want to be ready fast, Smart Slider 3 has a Template Library as well. And you can import a slider from there.

Smart Slider 3 Dashboard
Smart Slider 3 Dashboard

In the Slider Library there are a lot of premium and free sliders, now I will import a free one.

Import a slider from the Slider Library
Import a slider from the Slider Library

After that you can customize your slider and you can put it into your Astra Theme.

Adding to Astra Theme slider is very simple with your favorite page builder. You should just use the Smart Slider 3 widget, and you have a slider in your site now!

Insert your slider with Elementor
Insert your slider with Elementor

If you would like to learn about how you can use Smart Slider 3 with Elementor, watch our video:

If you like Beaver Builder, Smart Slider 3 works well with this page builder too:

It took about 5 minutes to have a ready template on your site considering that you have looked around on the Astra Site and knew which Astra template you would use. Importing a slider and putting it in your template is not more than 5 minutes. So you have 50 Minutes yet if you would like to finish your page in one hour.

Now you should just personalize your content. Very fast, very simple and you can enjoy building a website.

Creating in Astra Theme slider for the heading part

With Astra Theme you can even make a custom header with Smart Slider 3. This is also simple, you can choose a widget type for header in the Customizing menu.

Customizing menu in Astra Theme
Customizing menu in Astra Theme

In your WordPress menu → Appearance → Widgets you can set the Smart Slider 3 widget.

Smart Slider 3 widget
Smart Slider 3 widget

You should just choose which slider would you like to display. And now you have a header on all of your pages with your slider.

But there are more options to apply your Astra Theme slider, first of all you can download the Astra Hooks plugin. With this plugin you can paste a shortcode fast everywhere on your page.

Astra Hooks
Astra Hooks

You should just copy and paste your sliders’ shortcode into a place where you want to display it.

Customize hooks
Customize hooks

So I can tell you there are a lot of options to make your own website.

I wrote about only the free version of Astra Theme and Smart Slider 3. With the paid version of them I can’t imagine limits by building a site.

How about speed?

The speed of your webpage is the most important thing what you have to consider. People don’t have lots of time to wait loading your site, so it should be fast. It depends on a lot of factors, but choosing a good Theme and a fast hosting can be the solution.

Astra loads only about 0.5 second. That is usually short, because most homepages load about 1MB. It is optimized for speed, and needs only 50 KB of resources to load. It doesn’t use jQuery, instead of that it uses Vanilla. And Astra Theme gets high ratings in all page speed test tools.

About Astra speed
About Astra speed

Smart Slider 3 only loads after everything else has finished loading on your website to be able to calculate the positions where everything should be. Normally it doesn’t take lots of time, but if you uploaded a high quality picture it can be slower. So most of the speed depends on the used rich media. But in Smart Slider 3 you have the opportunity to optimize your slider.

Smart Slider 3 offers a lot of speed settings for you in the Pro version.

What can you do to optimize your slider?

  • Choose the correct image size: Use images where the dimensions are close to your slider size!
  • Use device specific images: You can use device specific images what can be easily set, also you can optimize your images even better.
  • Reduce the number of slides: Don’t use too many slides on your page! Furthermore you can display your images randomly. This is also an option in Smart Slider 3.
  • Use the Smart Slider 3 image resizing feature: The Optimize tab → Layer image resize and Background image resize options can be really useful. They will resize the images to the sliders size automatically.
  • Use the lazy loading: With this feature you can set up that a certain number of images load.
Smart Slider 3 Optimize tab
Smart Slider 3 Optimize tab

So Smart Slider 3 in Astra Theme takes care of your problems with the speed.

Final Thoughts

I can recommend Astra Theme to everybody who starts building a website now and doesn’t know which Theme to choose. It loads fast, it is clean and you can fully customize it. And it works fine with Smart Slider 3, hence you can take your site more professional.

Astra is a great decision if you like to use page builders, and Smart Slider 3 is the best choice to use a slider in your Astra Theme. With this Theme and with this plugin you can save a lot of time.

Bernadett Toth

About Author

I’m Bernadett Toth and I’m a member of Nextend‘s support team.
I have two dogs, in my free time I teaching them. Besides that I often ride a bike, watching movies or reading.