Black Friday Super Sale! 🔥 Enjoy a jaw-dropping discount of up to 50% OFF on all Smart Slider plans. Hurry, the offer ends on December 2nd!

Buy Now
Themes

Build Your Website Easily with Astra Theme and Smart Slider 3

Bernadett Toth
Bernadett Toth
March 28, 2020

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 1+ million 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 Starter Templates 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.

The new way to build a Slider
Next generation visual editor, customizable animations & effects, and access to hundreads of premade templates.
Get Started
Smart Slider 3 - The new way to build a Slider

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

Import a template from Starter Templates

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

Select your page builder in Starter Templates
Select your page builder in Starter Templates

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. Finally you can import the site.

Import a template
Import a template

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.

Import a template in Smart Slider
Import a template in Smart Slider

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

Free slider templates
Free slider templates

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!

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

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 → Header → Primary menu.

Customizing menu in Astra Theme
Customizing menu in Astra Theme

Then in your Customizing menu → 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.