Meta Slider: A Free and Easy Way to Add Responsive Sliders to WordPress

Slideshows are a great way to showcase your images, illustrate your content, and display links to the other posts and pages on your website.

While some themes come equipped with content sliders, and there are plenty of premium plugins available in this category, if you are looking for a quick and easy way to add slideshows to your WordPress website, the free Meta Slider plugin is a great choice.

Not only is this plugin free, but its extremely popular with over 1.6 million downloads and an impressive 4.8 out 5 star rating. Part of the appeal of Meta Slider is that it’s very easy to use and includes a number of useful settings and options, allowing you to add mobile-friendly responsive sliders to your posts and pages in no time at all.

To help you decide if this free plugin is the right slideshow option for you, read on for our guide to Meta Slider for WordPress.

How to Use the Meta Slider on Your Website

As the Meta Slider plugin is free to use, it can be installed on your site directly from the WordPress plugin directory

To do so, log into your site’s admin area (http://yoursite.com/wp-login.php) and then navigate to Plugins > Add New using the sidebar menu.

From the Add Plugins screen, enter ‘meta slider’ in the search field and then install the first item listed in the results.

Add Meta Slider Plugin

Once the plugin has been installed and activated you can create your first slider from the newly added sidebar menu item.

Creating Your First Slideshow

The developers of this plugin have made it as easy as possible to get started. Once you click on the Meta Slider menu item, the button for creating a new slideshow is highlighted for your convenience.

Meta Slider Create Slideshow

After you’ve initiated the slideshow creation process, the first step is to start creating the individual slides. To create the first slide, simply click on the Add Slider button and then select an image from your site’s media library, or upload the files you want to use by dragging and dropping them into the media library.

Meta Slider Media Library

After you’ve selected an image for the slide, you can then add an optional caption that will be displayed on top of the image. You can also turn the slide into a link by entering a URL. This can be an external URL or a link to another page on your website. This makes the slideshow a good way to highlight the other posts on your blog.

In the settings panel on the right, you can configure the slideshow. The options allow you to set the size, choose a transition effect, and whether to enable the navigation elements or not. Depending on the slider type you choose, you can also select from a number of themes to alter the appearance of the slideshow.

As Meta Slider includes a few different types of slider formats, you can choose from the Flex Slider, R. Slides, Nivo Slider, or Coin Slider. Each option will change the appearance of your slider and the way it functions so it’s worth trying them out to see which one you prefer.

Meta Slider Preview

At any point you can preview your slider to see how it will look. Once you are happy with the slider you can save it and then copy the shortcode. Publishing the slideshow is just a case of then pasting that shortcode into a post or page on your website.

Meta Slider Shortcode

Alternatively you can just use the Add slider button that this plugin adds to the post editor. Then preview or publish your post as usual to view the new slideshow. If you need to make any changes to the settings or add new slides, you can do so by clicking on the Meta Slider menu item.

Conclusion

Meta Slider makes it very easy to add a responsive slideshow to your WordPress posts and pages. With four slider styles to choose from, each with their own transition effects and themes, you get plenty of flexibility when it comes to controlling how your slideshows look and feel.

If you have any questions about this plugin or slideshows in general, please leave a comment below.

New Posts in your inbox

  1. Hi Joe, thanks for the post! Do you have any tips on getting Metaslider centered? Mine keeps aligning right, even though I checked the “Center Align” button. I’ve read a few posts on adding CSS to do this, but I’m not very tech-knowledgeable, and they all suggest different things.

    Also, do you know how I can add it just to the top of my landing page without having it end up on every page of my blog. (For now I just moved the widget right into the header, which is having the slider appear on every page of my site now.) Where should I add the code to have it just appear on the main page?

    Thanks for reading my questions!

  2. Hi Melinda,

    If you want to display it in the header of a single page, then you will probably need to edit the theme files for that page template.

    Depending on your theme, there might be a landing page template that came with it? If so you can try following these instructions to add the slider code to the right file:
    https://wordpress.org/support/topic/please-help-header-issues?replies=4

    As for centering it, you could try following these instructions:
    https://wordpress.org/support/topic/how-do-i-center-the-meta-slider-flex-slider

    Hope this helps.

    Joe

  3. Hi, how do I get this plugin to be responsive on my site? I have followed all the steps and it looks great, but when I load on my mobile phone the slideshow is not reponsive.

  4. Hiii Joe.. can you please tell me how do i add slider on my login page only(before login to the dashboard) instead of all pages… of my website

  5. Please could you tell me, in simple terms as I am not tech or code savvy!, how to align left or align right my slideshow on my website page. In the Advanced Settings on Metaslider plug-in there is only an option for Center align. Much appreciated if you can help.