Hello friends! Today we will talk about How to install an image slider on a WordPress site.Creation and installation the slider is very simple, and will take no more than 5 minutes.

We will create a slider using the Meta Slider plugin, which in turn is one of the most popular free plugins (more than 500,000+ active installations).

Plugin completely Russified, which is also a significant plus.

So let's get started!

1. Install and activate the Meta Slider plugin.

2. After activating the plugin from the administrative panel go to "Meta Slider".

3. Click on "plus sign".

5. Now we produce the necessary plugin settings, of which, by the way, there are quite a lot (which is good news).

I see no point in writing about all the settings, since they are all completely Russified and there should be no questions about them. Except standard settings slider size, effects, design, etc. you can also choose one of four types of sliders(Flex Slider, R. Slides, Nivo Slider, Coin Slider).

6. After loading the images and setting up the slider, all that remains is the simplest thing is to add a slider to the site.

There are three ways to do this: using a regular shortcode(if you need to add a slide to the page), by inserting the code into the template and using the button "Add Slider". To add a slider to the page, copy the code in the block "Usage", and paste it into any page or post.

To insert a slider into a template, go to the tab "Insert into template", copy the code and add it to the template file in which you want to display the slider.

Add a slider to a page using a button "Add Slider" easiest way. Click the button, select the created slider and click "Insert slideshow."

If desired, you can add a slider and to sidebar. To do this, go to Appearance -> Widgets and use the widget "Meta Slider".

This is the final slider:

As you can see, there is absolutely nothing complicated! Addition slider in WordPress enough quick and easy task. If you have any questions, feel free to write in the comments.

Hello friends! Today we will talk about how to install an image slider on a WordPress site. Creating and installing a slider is very simple and will take no more than 5 minutes. How to install an image slider in WordPress We will create a slider using the Meta Slider plugin, which in turn is one of the most popular free plugins (more than 500,000+ active installations). The plugin is completely Russified, which is also a significant plus. So let's get started! 1. Install and activate the Meta Slider plugin. 2. After activating the plugin, go to “Meta Slider” from the administrative panel. 3. Click on the plus sign. 4. Next, click the “Add Slide” button and load (or select from already downloaded) images for the slide. Add…

Review

Rating of the lesson on adding a slider to the site

100

Adding a slider to your WordPress site is a great trick that helps show more content in a small space. This is usually used to attract attention to relevant posts or key features website.

Sliders are one of the most popular types of plugins on WordPress, and therefore it can be easy to get lost in their variety and quantity. That's why we come to the rescue with a selection of the best free WordPress image slider plugins currently available.

Choose one of the following plugins in this list to beautifully display product and service images on your website.

1. Responsive Slider

AlienWP plugin for creating slides and showcasing simple, stylish and flexible sliders on your website. One of the most popular free sliders on WordPress with over 20,000 active installations and 150,000 downloads!

2. Huge-IT Slider

Slider Huge-IT is a great WordPress slider with a lot of nice features. You just need to install and create a slider in a few minutes.

3.Slider

Image Slider - best slider for your posts, pages, widgets or sidebar. Allows you to customize the slider to find what you need.

4. Slider Ultimate

Ultimate Slider is an easy to use slider that allows you to add modern and adaptive slider to any page of your WordPress site using a simple shortcode.

5. Slider WD

Creates a flexible, easily configurable slider with various effects for your WordPress site.

6. Slider by Supsystic

Effective Slider by Supsystic is the optimal solution for slide shows. Creates sliders from images, videos and content with professional slideshows and slider templates.

7. Seo Carousel Slider

An excellent jQuery slider plugin with support for touch control on smartphones using gestures. Allows you to create beautiful adaptive sliders and carousels in a couple of minutes.

8. Ultimate Responsive Image Slider

Ultimate Responsive Image Slider is a responsive slider for WordPress. You can add multiple image slides in one slider using various image uploaders. You can also place an unlimited number of sliders on your blog.

9. Smart Slider 3

Smart Slider 3 has all the relevant features found in free sliders. Besides the fact that Smart Slider has a tool for creating YouTube and Vimeo slides and creating slides from your WordPress posts, it is also very easy to use thanks to a slide editor with different levels.

10. Post Slider

The plugin allows you to create sliders from simple and custom WordPress posts. It has two types of sliders: dynamic and static.

11. Smooth Slider

Showcase your latest posts, specific categories, or a selection of posts using the Smooth Slider plugin.

12. Easing Slider

This plugin aims to achieve the main goal of creating and managing sliders with ease. Its goal is to make the job simple, without training, and integrate into the WordPress control panel as if it were a native element.

13. Master Slider - Responsive Touch Slider

Master Slider is a free, efficient image and content slider with very smooth scrolling. It supports touch navigation with swipe gesture.

14. Slider by Soliloquy

Using custom post types, Soliloquy allows you to create an infinite number of WordPress sliders with an infinite number of images in each of them in just a few clicks.

15. WP Slick Slider and Image Carousel

Supports slider and carousel mode using different shortcodes. Fully flexible and responsive with drag support and drop.

16. Meta Slider

Possibly the most popular slider plugin in WordPress. Creating slideshows with Meta Slider is fast and easy. Simply select an image from your WordPress library, drag them into place, set slide titles, links and SEO fields from one page.

17. WP Responsive Header Image Slider

A quick and easy way to add a couple of slider images inside a WordPress page, as well as from a template. Additionally, you can add a responsive touch slider.

18. Sangar Slider

Sangar Slider is a light version of the premium slider high quality for WordPress. With smooth animations, multi-layered slides, technical support, ease of use and flexibility.

19. Responsive Slider by MotoPress

Responsive WordPress Slider by MotoPress is an easy-to-use solution for creating beautiful slides with amazing visual effects. Intuitive drag and drop, scrolling and styling interface helps you create slides without using code.

20. WP Featured Content and Slider

WP Featured Content and Slider is an easy to use slider for WordPress. Displays featured content, features of your product and displays them through a shortcode or template.

Create powerful, SEO-optimized slideshows in minutes with the world’s #1 slider plugin!

With WordPress' most popular slider plugin, enhancing your blog or website couldn't be easier: simply select images from your WordPress Media Library, drag and drop them into place, and then set the slide captions, links and SEO fields all from one page .

NEW: Easily search and download free images to your slideshow from Unsplash.com

Choose one of 4 different slideshow types, and use our provided short-code or template to embed the slideshows.

Apply one of our professional slideshow designs to really make your website stand out.

Gutenberg compatible

Included slideshow types:

  • Flex Slider 2— responsive, 2 transition effects, carousel mode
  • Nivo Slider— responsive, 16 transition effects
  • Responsive Slides— responsive & incredibly light weight
  • Coin Slider— 4 transition effects

Possibilities

  • Simple, easy to use interface - perfect for individual users, developers & clients!
  • Access to free photos via Unsplash.com
  • Create Responsive, SEO-optimized slideshows in seconds
  • Unrestricted support for image slides (supports caption, link, title text, alt text)
  • Full width slideshow support
  • Drag and drop slide reordering
  • Intelligent image cropping
  • Set image crop position
  • Themes – includes 11 free professional slideshow themes
  • Built in Gutenberg block, Widget and Shortcode
  • Loads of slideshow configuration options — transition effect, speed etc (per slideshow)
  • Fully localized
  • WordPress Multi Site compatible
  • Extensive developer API (hooks & filters)
  • Fast — only the minimum JavaScript/CSS is included on your page
  • Free basic support (covering installation issues and theme/plugin conflicts)
  • Lightbox support with the MetaSlider Lightbox add-on

General:

  • Simple and intuitive interface – perfect for individual users, developers & clients!
  • Fast – requires only the minimum JavaScript/CSS on your page
  • Creatively responsive

Creative:

  • Unrestricted full-width support for image slides, including captions, links, title texts and alt. texts.
  • Includes drag and drop slide reordering, intelligent image cropping, set image crop position.
  • Multiple slideshow configuration options (e.g. for speed, timing, plus many more!)
  • Preview from within the admin area
  • Shortcode lets you add the slideshow anyway
  • Fully localized
  • WordPress Multi-site compatible, and
  • Compatible with translation plugins (WPML, PolyLang & qTranslate)
  • Developer Friendly, with extensive hooks & filters

Support:

  • Includes free basic support (covering installation issues and theme/plugin conflicts).

Screenshots

Installation

  1. Go to the Plugins section in WordPress
  2. Search for "MetaSlider"
  3. Click "Install"

The not so easy way:

  1. Upload the ml-slider folder to the /wp-content/plugins/ directory
  2. Activate the plugin using the ‘Plugins’ menu in WordPress
  3. Manage your slideshows using the ‘MetaSlider’ menu option

Frequently Asked Questions

https://www.metaslider.com/documentation/

How do I include a slideshow in the header of my site?

You will need to paste the “Template Include” code into your theme ( you can find this in the ‘Usage’ section underneath the slideshow settings)

  • Go to Appearance > Editor in WordPress
  • Edit a file called ‘header.php’ (or similar)
  • Find the correct place to add it (for example above or below the logo)
  • Paste in the code and save.
I just want to show the slideshow on my homepage, how can I do that?

Add the ‘restrict_to’ parameter to the shortcode, eg:

");

Theme specific instructions:

https://www.metaslider.com/documentation/theme-integration/

It’s not working - what can I do?

Check out the troubleshooting page here:

https://www.metaslider.com/documentation/troubleshooting/

MetaSlider is cropping my images in the wrong place — what can I do?

See https://www.metaslider.com/documentation/image-cropping/

Reviews

I"ve tried them all...well, I"ve tried many different sliders, looking for a simple carousel to move a row of slides across the top of our store"s home page. Much like Amazon. All of the others were very confusing to set up, and even when I managed to get any of them set up, they never gave me a row of images moving across the top of the page. One gave me a vertical stack of images down the side of the page. Another just up one image in the middle of the page and slide in other images. Meta Slider was the only one that gave me what I wanted. But it only gave it to me on the second round. it left room for a second row of slides below the first one. I couldn't find anything in the documentation, so I went to the forum and explained the problem. In just a few minutes I had a reply from one of the plugin contributors (kbatdorf) with a solution to the problem. Just a little snippet of code to add to the Additional CSS code in the Customize section of the website. That solution did even more than eliminate the "2nd row," it also spaced the headline below the slides correctly. Later he sent me another solution, some php code, just in case I want to try it out. Now that"s how to take care of customers - even customers like me who haven"t paid anything... yet. I"m going to the website right now to buy the Pro Add On Pack. The help they have already provided is worth more than the modest price of the Add On Pack.

How great that there is such a plugin for free with an extraordinary support. I was able to install it very easily and integrated it into a non-standard environment. I have rarely received such patient and helpful support (@ kbat82). He also knew exactly in which areas he can support and which do not concern him (which is also an important gift) Thank you very very much! All the best on your way and good luck and well-being!

Participants and developers

"MetaSlider" is an open source project source code. The following contributors contributed to the development of the plugin:

Participants

Changelog

3.15.3 — 2019/Nov/28

  • FIX: Updates layout breaks in WP3.4

3.15.2 - 2019/Nov/14

  • TWEAK: Adds loaded event that other plugins can wait for
  • TWEAK: Updates a few UI elements on the search bar and slideshow drawer
  • TWEAK: Adds better checks for error messages
  • FIX: Fixes an issue where cetain settings would show when not needed
  • FIX: Fixes a layout break in IE11
  • FIX: Address performance issues with a very large collection of slideshows

3.15.1 - 2019/Oct/22

  • FIX: Adds better check for slide image thumbnails and count
  • FIX: Updates $ to jQuery on the admin settings screen

3.15.0 - 2019/Oct/21

  • FEATURE: Adds a new way to navigate slideshows
  • TWEAK: Adds various accessibility enhancements to FlexSlider
  • TWEAK: Adds extra checks for REST enabled sites
  • TWEAK: Updates notices
  • FIX: Updates various RTL language styling issues
  • FIX: Fixes bug where new slides wouldn’t crop until pressing save
  • FIX: Fixes various layout breaks from other languages

3.14.0 — 2019/July/26

  • FEATURE: Adds ability to duplicate a slideshow
  • FEATURE: Adds toolbar with various utilities
  • FEATURE: Adds unified notification system
  • REFACTOR: Moves inline styles out of the body tag
  • REFACTOR: Refactors the preview module to be called from anywhere
  • REFACTOR: Refactors the way slides and the slideshow saving works
  • REFACTOR: Refactors the shortcode copy module
  • REFACTOR: Adds helper functions to better manage the routes files
  • FIX: Fixes a bug where adding a class name via Gutenberg crashes the block

3.13.1 - 2019/May/11

  • TWEAK: Corrects a check on a variable in Theme.php, preventing a possible PHP notice

3.13.0 — 2019/May/7

  • FEATURE: Allows captions to inherit the image description
  • FEATURE: Adds support for theme developers to register a theme
  • TWEAK: Adds extra checks for when a theme is missing
  • TWEAK: Removes some ancient code for compatibility with PHP< 5.1
  • TWEAK: Stops random theme being inherited when user removes it
  • REFACTOR: DOM appended slides are now rendered as Vue components

3.12.1 — 2019/Mar/18

  • FIX: Fixes a bug where Nivo and Coin Slider did not ship with the plugin

3.12.0 — 2019/Mar/18

  • TWEAK: Sets a default theme on a newly created slideshow
  • TWEAK: Adds various trivial code quality fixes
  • FEATURE: Adds access to the Unsplash.com image library

3.11.1 - 2019/Jan/30

  • FIX: Update Gutenberg compatibility

3.11.0 — 2019/Jan/30

  • FEATURE: Adds drag and drop module
  • FEATURE: Adds a convenient start page for new users
  • FIX: Fixes layout issue with notices served by other plugins
  • FIX: Updates Gutenberg container styles
  • FIX: Fixes issue where Coin Slider wouldn’t open in a new window
  • FIX: Updates support for Elementor page builder
  • TWEAK: Updates various UI elements
  • TWEAK: Removes fonts to reduce package size
  • TWEAK: Adds an escape output of slideshow titles
  • REFACTOR: Removes defunct preview method

3.10.3 – 2018/Dec/04

  • FIX: Updates Gutenberg compatibility

3.10.2 — 2018/Nov/21

  • FIX: Fixes bug in with captions in NivoSlider

3.10.1 — 2018/Nov/20

  • TWEAK: Removes redundant height and width attributes
  • FIX: Fixes bug in PHP 5.2 where images would not import
  • FIX: Updates various translation errors and adds translator tips
  • FIX: Allows the folder name to be safely changed
  • FIX: Fixes the situation where using a different folder name breaks everything
  • FIX: Fixes a Gutenberg-related bug that appears in WP5.0 beta2

3.10.0 — 2018/Oct/25

  • FEATURE: Adds 11 new themes users can apply to their slideshows
  • FEATURE: Adds ability to preview a slideshow with a theme
  • FEATURE: Adds ability for a theme developer to add instructions
  • FEATURE: Adds unique images by theme if a user is importing images
  • FEATURE: Adds new channel for user feedback
  • FEATURE: Adds new developer filters to adjust slide output/visibility
  • FIX: Updates unusable filter when attempting to filter slides by type
  • FIX: Fixes a bug when babel-polyfil is loaded more than once
  • FIX: Adds an extra check for an error before saving the theme
  • TWEAK: Adds a title to the theme module
  • TWEAK: Adds ability to import images with captions, title, alt and desc. from a theme.

3.9.1 – 2018/Sept/28

  • FIX: Fixes a bug where some slides get appended inside others.

3.9.0 — 2018/Sept/11

  • FEATURE: Adds the option to toggle autoplay for Coin Slider
  • FEATURE: Adds keyboard shortcuts to preview
  • FEATURE: Adds full width toggle to preview
  • FEATURE: Adds a light and dark preview option
  • FEATURE: Adds ability to import images if none exist
  • FEATURE: Adds Gutenberg block
  • FEATURE: Adds ability to use the title in a shortcode
  • FEATURE: Adds translation functionality to JS components
  • TWEAK: Updates Pro slide types descriptions
  • TWEAK: Adds placeholder and comparison table entries for schedule functionality
  • TWEAK: Adds compatibility with Pro feature ability to change layer slide background
  • TWEAK: Updates option name on slideshow select box as title name changes.
  • TWEAK: Adds filters to slides edit buttons
  • TWEAK: Tweaks edits buttons style
  • FIX: Limits image srcset to image and layer slides (fixes post feed image)
  • FIX: Fixes broken Nivo themes (due to css specificity)
  • FIX: Fixes bug where icons would jump during delete

3.8.1 - 2018/Jun/07

  • FIX: Limits responsive image srcset to slideshows with cropping disabled only
  • FIX: Increases responsive image srcset maximum size to Full

3.8.0 - 2018/Jun/04

  • FEATURE: Adds compatibility with new Pro schedule feature
  • FEATURE: Adds compatibility with retina plugin https://wordpress.org/plugins/wp-retina-2x/
  • FEATURE: Adds option to enable or disable initial fade in
  • FEATURE: Improves Responsiveness
  • TWEAK: Adds default Flexslider fonts to repo for users that require them.
  • FIX: Fixes error when trying to save many slides
  • FIX: Fixes broken markup in settings in some languages.
  • FIX: Fixes bug that always strips referral tags.
  • FIX: Adds a check to the copy/paste element to make sure it exists before adding an event
  • REFACTOR: Removes plugin dependency on Notice class
  • REFACTOR: Standardizes the code to deny direct access
  • REFACTOR: Updates how the plugin handles setting updates.

3.7.2 - 2018/Mar/20

  • TWEAK: Removes an obsolete admin notice
  • SECURITY: Prevents a non-persistent logged-in XSS attack. The attacker must persuade a logged-in admin-level WP user to click on a malicious link specifically targeted to your site; this can result in his chosen JavaScript being run inside your browser on the MetaSlider page. Hence, the risk is low, but you should certainly update.

3.7.1 - 2018/Mar/13

  • FIX: Updates FlexSlider to remove flash on page load.

3.7.0 - 2018/Feb/26

  • FEATURE: Allows users to inherit default captions and other data from the image.
  • FIX: Adds capability filter to pages.
  • TWEAK: Updates to the correct support link.

3.6.8 - 2018/Jan/26

  • FIX: Updates support links to their correct locations
  • FIX: Updates compatibility for various themes (including Genesis)

3.6.7 - 2017/Dec/15

  • FEATURE: Adds back in some instructions on how to display the slideshow
  • TWEAK: Removes unnecessary type attribute that was causing validation errors
  • TWEAK: Adds DocBlock checking with CI for PHP and JS files
  • FIX: Adds compatibility fixes for older WP versions.

3.6.6 - 2017/Nov/23

  • FIX: Fixes FlexSlider bug when resizing slider.
  • FIX: Updates layout on post feed slides.

3.6.5 - 2017/Nov/20

  • FIX: Fixes issues with bottom margin of slideshow, among other minor tweaks.
  • TWEAK: Prevents a PHP debug log item that appeared in the short-lived 3.6.4

3.6.3 - 2017/Nov/16

  • FIX: Updates various styles to retain compatibility with previous releases based upon user feedback
  • FIX: Removes translation of slider brand names.
  • UPGRADE NOTE: If upgrading to MetaSlider 3.6+, users of the MetaSlider Add-On pack should also upgrade that plugin to a current release (2.7.1 or later).

3.6.2 - 2017/Nov/15

  • FIX: Update various styles to retain compatibility with previous releases based upon user feedback
  • FIX: Restore compatibility with old WP versions that lack the wp_add_inline_script() function

3.6.1 - 2017/Nov/14

  • FIX: Removes default FlexSlider styling

3.6.0 - 2017/Nov/14

  • FEATURE: Allow a slide to be restored after deletion
  • FEATURE: Allow the background image to be changed
  • FEATURE: Adds a guided tour
  • FIX: Loads inline JS properly
  • FIX: FlexSlider touch events respect pause on hover setting
  • FIX: Allow for https image URLs
  • TRANSLATIONS: Addresses spelling/localization issues
  • TWEAK: Accessibility enhancements
  • TWEAK: Adds links to activation page
  • TWEAK: Updates FlexSlider to latest
  • TWEAK: Change the label “Meta Slider” to “MetaSlider”
  • TWEAK: Add dashboard notices

3.5.1

  • Fix: Pre-populate caption and alt text fields for new image slides (based on original media file data)
  • Fix: When a media file is deleted from the media library, also remove it from the slideshow
  • Fix: Update _wp_attachment_metadata when creating new image sizes

3.5

  • New slides will now be added as a new post type (ml-slide) (existing slideshows and slides will be unaffected)
  • Workaround/Fix: Don’t use WP_Image_Editor to load slide images that are missing metadata (invalid images)
  • New: Add "metaslider_after_resize_image" action

3.4.2

  • Workaround/Fix: Don’t use WP_Image_Editor to load admin slide thumbnails, use wp_get_attachment_image_src instead. Attempts to fix white screen issues affecting some users. Related: https://core.trac.wordpress.org/ticket/36534
  • Fix: Load admin JavaScript in footer

3.4

This is the first in a series of small updates which will eventually allow us to remove restrictions in the plugin which prevent us from implementing certain functionality, including:

  • Changing a slide image
  • Using unique captions when the same slide has been added to more than one slideshow
  • Adding the same slide to a slideshow multiple times
  • Duplicating slides and sliders
  • Drafting slides
  • Scheduling slides

We are releasing this update in a number of small stages due to the number of users MetaSlider has. We are being overly cautious to ensure it’s a smooth transition. This update does not make any major changes to the current plugin functionality, but it does put in place the “scaffolding” code which we will rely on to implement further updates.

3.3.7

  • Fix: “Maximum level reached” error when inserting the shortcode for a slideshow into it’s own caption. Thanks to Zhouyuan @ Fortinet for reporting this.

3.3.6

  • Fix: Save Spinner

3.3.5

  • Prepare plugin for WordPress.org translation project (rename textdomain from ‘metaslider’ to ‘ml-slider’)
  • Small styling fix

3.3.4.1

  • Fix Roots theme CSS conflict

3.3.4

  • Add HTML5 validation by applying a property="stylesheet" attribute to MetaSlider CSS tags
  • Remove unused "Resource Manager" code
  • Chinese language pack updated (thanks to mamsds!)

3.3.3

  • Ukrainian language pack added (thanks to mister_r!)
  • Fix: MetaSlider hoplink incorrectly adding parameters to filtered url
  • Add "metaslider_attachment_url" filter

3.3.2

  • Fix: FPD Security issue. Thanks to Ole Aass (@oleaass) for finding and disclosing this issue.

More information:

The fix will prevent some servers (configured with ‘display_errors’ set to ‘on’) from disclosing the full path to certain files within MetaSlider.

https://codex.wordpress.org/Security_FAQ#Why_are_there_path_disclosures_when_directly_loading_certain_files.3F

3.3.1

  • Fix: Remove ‘create video playlist’ option from Media Library (on MetaSlider page only)
  • Fix: Support for Enhanced Media Library plugin
  • Fix: Return public slide when DOING_AJAX
  • Improvement: Use admin actions to save slideshow settings

3.3

  • New feature: Smart pad option (for Image Slides & Flex Slider only)
  • Portuguese language files added (thanks to mauro.mascarenhas)
  • Russian language files updated (thanks to asidoryak)

3.2.1

  • Change: Change slide image functionality backed out
  • Fix: Apply FireFox mobile fix to Flex Slider (github #1110)

3.2

  • New feature: Change slide image (click top right of slide thumbnail)
  • Update: German language files (thanks to Ov3rfly!)

3.1.1

  • Fix: restrict_to shortcode parameter
  • Change: Add metaslider_flex_slider_list_item_attributes filter

3.1

  • New feature: Ajax delete slide (to stop users from losing changes when deleting a slide)
  • New feature: restrict_to shortcode parameter now accepts page IDs
  • Update: Change icon
  • Fix: Minor admin styling fix
  • Fix: Hide share buttons for pro users
  • Change: Remove upgrade nags from media library, add Go Pro page (with an option to hide the page)

3.0.1

  • Fix: Escape admin setting text fields
  • Fix: Escape admin tab names (thanks to Dylan Irzi for spotting and reporting this!)
  • Change: Allow shortcode parameters to be filtered

3.0

This is not a major update. We’re just following the WordPress versioning conventions (3.0 comes after 2.9)

  • New feature: Set crop position for slides (requires WP 3.9+)
  • New feature: Disable cropping setting
  • Fix: Use get_posts instead of WP_Query to extract slideshows (fix conflicts with plugins using get_post_type in admin_footer hooks)
  • Change: Add filter for capability required to use MetaSlider

2.9.1

  • New feature: Hungarian Language Pack added
  • Fix: Escape attributes and JS in slideshow output (credit to jwenerd!)
  • Fix: Escape attributes and text fields in admin
  • New feature: Admin slide tabs can be modified with filters

2.9

  • New feature: Japanese Language Pack added
  • New feature: Persian Language Pack added
  • New feature: Switch between tab and list view
  • New feature: Added ms-left and ms-right css classes to align slideshow to left or right
  • Improvement: Flex Slider updated to 2.3.0-bleeding (fix initial image fade)
  • Fix: reference to window.parent in media library
  • Fix: Thumbnail outline in firefox

2.8.1

  • Fix: All in One Events Calendar conflict fix (Advanced Settings not toggling)
  • Fix: CSS resets to avoid theme conflicts
  • Fix: Autoload visibility conflict (https://wordpress.org/support/topic/autoload-visibillity-conflict)
  • Fix: Layer Editor in IE11 - text fields not accessible in modal windows
  • Fix: FlexSlider IE11 Fade transition

2.8

  • New feature: Russian Language Pack added
  • Fix: Carousel image scaling in FireFox
  • Fix: wpautop issue with double ampersand
  • New feature: Shortcode parameter added to restrict slideshow to displaying on homepage only (see FAQ)
  • Improvement: Save slideshow after reordering slides
  • Fix: PHP Warning when no slideshows have been created

2.8-beta

  • Improvement: Preview now uses admin-post action
  • Improvement: Classes are now auto loaded to reduce memory footprint
    (Thanks to Viktor Szepe for the above suggestions!)
  • Improvement: Slideshow initilization time reduced
  • Improvement: HTML5 Compatibility: Alt tags always present on image tag — even if empty.
  • Improvement: Flex Slider slideshows should now ‘reserve’ a space for themselves while they fully load
  • Update: Flex Slider updated to v2.2.2
  • New feature: Romanian Language Pack added (Thanks to Octav Madalin Stanoaia)
  • New feature: Dutch Language Pack added
  • New feature: WP Super Cache compatibility — cache is cleared when saving slideshow
  • New feature: HTML5 Compatibility (Experimental). Set define("METASLIDER_ENABLE_RESOURCE_MANAGER", true); in wp-config.php to move MetaSlider link tags head of the page.

2.7.2

  • Fix: Only apply carousel margin to slides
  • Fix: Enqueue Easing library when carousel mode is enabled, regardless of effect selection
  • Fix: Thumbnail margin when theme has #content div

2.7.1

  • Fix: Remove easing parameter when effect is set to fade
  • Fix: Navigation options grayed out in IE
  • Fix: qTranslate captions not being processed (typo)

2.7

  • New feature: Croatian Lang pack added
  • New feature: Carousel margin option added
  • New feature: Process shortcodes in captions
  • Improvement: Tab rename UX
  • Improvement: Admin save spinner functionality improved
  • Improvement: CSS Resets updated
  • Improvement: Use plugins_loaded action to initialize plugin
  • Fix: PHP Warnings when one slideshow exists
  • Fix: Smart Cropping sometimes not returning smart cropped image
  • Fix: Add z-index to MetaSlider, attempted conflict fix for themes with drop down menus.
  • Fix: Only include the easing library when transition effect is set to slide
  • Fix: White Label Branding plugin compatibility.
  • Change: "Responsive" option renamed to "R. Slides". The (old) “Responsive” option refers to the “Responsive Slides” jQuery library, but users were getting confused as the naming suggested it was the only responsive option. Flex Slider & Nivo Slider are also responsive.

2.6.3

  • Improvement: Various admin screen styling improvements
  • Fix: Add ‘ms-‘ prefix to Advanced settings toggle boxes and Preview button (avoid theme conflicts)
  • Fix: RTL fixes
  • Improvement: Filters added for complete slideshow output
  • Improvement: Filter added for slide image label
  • Improvement: ‘No Conflict’ mode refactored
  • Improvement: ‘slider’ parameter added to flexslider before/start/after etc callbacks
  • Change: Renamed in admin menu from “MetaSlider Lite” to “MetaSlider”

2.6.2

  • Fix: Vantage background image tiling

2.6.1

  • Fix: Advanced settings arrow toggle
  • Fix: All in one SEO/ Page builder / MetaSlider conflict
  • Fix: NextGen “Insert Gallery” conflict
  • New feature: Norwegian language pack added

2.6

  • Fix: Typo in metaslider_responsive_slide_image_attributes filter
  • Fix: Caption not working in Nivo Slider
  • Fix: Tab styling improved
  • Fix: New window styling improved in WP3.7 and below

2.6-beta

  • New feature: Interface update for WordPress 3.8 admin redesign
  • New feature: ‘Stretch’ setting for full width slideshows
  • New feature: No conflict mode
  • New feature: ‘Add slider’ button for posts and pages
  • New feature: SEO options (add title & alt text to slides)
  • Change: CSS is now enqueued using wp_enqueue_style (Use a minification plugin or caching plugin to move styles to the if HTML5 validity is required - eg W3 Total Cache)

More info/Comments: http://www.metaslider.com/coming-soon-meta-slider-2-6-free/

2.5

  • Fix: JetPack Photon conflict
  • Improvement: German Language pack added (thanks to gordon34)
  • Improvement: Chinese language pack updated (thanks to 断青丝)
  • Improvement: MP6 styling fixes

2.5-beta2

  • Fix: Vantage theme backwards compatibility
  • Fix: Flexslider anchor attributes filter

2.5-beta1

  • Fix: Center align slideshow

2.5-beta

  • New Feature: ‘percentwidth’ parameter added to shortcode to allow for 100% wide slideshows
  • Improvement: Generate resized images through multiple Ajax requests on save (blank screen fix)
  • Improvement: IE9 admin styling tidied up
  • Improvement: Filters added to add/change attributes in and tags
  • Improvement: Security — nonce checking added
  • Change: Remove bottom margin from flex slider when navigation is hidden (add a CSS Class of ‘add-margin’ if you need the margin)
  • Fix: Add slides to slideshow in the same order they’re selected in the Media Library
  • Fix: Symlink path resolution
  • Fix: Do not try to resize/open images that are corrupt (missing metadata) (blank screen fix)

2.4.2

  • Fix: qTranslate caption & URL parsing for image slides

2.4.1

  • Fix: PHP Warning (reported by & thanks to: fgirardey)

2.4

  • Fix: FlexSlider styling in twenty twelve theme
  • Fix: IE10 - “Caption” placeholder text being saved as actual caption
  • Improvement: Settings table tidied up
  • Improvement: New slides are resized during addition to the slideshow
  • Improvement: Default slideshow size increased to 700×300
  • Improvement: Image filename now displayed for each slide (instead of image dimensions)
  • Improvement: Replace deprecated 'live()' jQuery call with 'on()'
  • Improvement: Polish Language pack added (thanks to gordon34)
  • Improvement: Chinese language pack added (thanks to 断青丝)
  • Improvement: ‘metaslider_resized_image_url’ filter added (could be used to disable cropping)
  • Change: qTranslate support for slide URLs (see: http://screencast.com/t/FrsrptyhoT)
  • Change: PolyLang fix to ensure slides are extracted for all languages ​​(set up a new slideshow for each language)
  • Change: WPML fix to ensure slides are extracted for all languages ​​(set up a new slideshow for each language)

2.3

  • Improvement: Flex Slider upgraded to v2.2
  • Improvement: Responsive Slides upgraded to v1.54
  • Improvement: ‘Create first slideshow’ prompt added for new users
  • Change: ‘scoped’ attribute removed from inline CSS tag until browsers catch up with supporting it properly. A new filter has been added: “metaslider_style_attributes” if you wish to add the scoped attribute back in.
  • Change: wp_footer check removed due to confusion
  • New Feature: ‘metaslider_max_tabs’ filter added to convert tab list to ordered drop down menu
  • Fix: Remove' Insert Media’ tab from ‘Add Slide’ modal (WP 3.6 only)
  • New Feature: Filters added to allow modification of image slide HTML
  • Improvement: Settings area tidied up
  • Improvement: Image URL Field less restrictive
  • Improvement: HTML Output tidied up

2.2.2

  • Improvement: System check added with option to dismiss messages. Checks made for: role scoper plugin, wp_footer, wordpress version & GD/ImageMagick.

2.2.1

  • Fix: Responsive slides styling in FireFox (reported by and thanks to: dznr418)
  • Fix: Flex Slider carousel causing browser to crash in some circumstances

2.2

  • Fix: Paragraph tags being added to output using Nivo Slider

2.1.6

  • Fix: Use the original image file if the slideshow size is the same size as the image file
  • Fix: Conflict with Advanced Post Types Order plugin
  • Fix: Colorbox conflict when using resizable elements in lightbox
  • Improvement: Refresh slides after clicking ‘save’
  • Improvement: Ensure taxonomy category exists before tagging slide to slideshow
  • Fix:Only submit form when submit button is clicked (not all buttons)
  • Fix: Coin slider caption width in FireFox
  • Improvement: Added hook to adjust carousel image margin

2.1.5

  • Fix: HTML 5 Validation

2.1.4

  • Fix: Widget markup invalid (reported by and thanks to: CarlosCanvas)

2.1.3

  • Fix: User Access Manager Plugin incompatibility issues (reported by and thanks to: eltipografico)

2.1.2

  • Fix: Nivo Slider theme select dropdown (reported by and thanks to: macks)
  • Fix: HTML5 Validation fix for inline styles
  • Improvement: Title field added to widget (suggested by and thanks to: pa_esp)
  • New feature: Spanish language pack (thanks to eltipografico)

2.1.1

  • Fix: PHP version compatibility

2.1

  • New feature: Widget added
  • New feature: System check added (checks for required image libraries and WordPress version)
  • Fix: Multiple CSS fixes added for popular themes
  • Fix: Flex slider shows first slide when JS is disabled
  • Improvement: Display warning message when unchecking Print JS and Print CSS options
  • Improvement: Coinslider navigation centered

2.0.2

  • Fix: PHP Error when using slides the same size as the slideshow

2.0.1

  • New feature: French language pack (thanks to: fb-graphiklab)
  • Fix: Use transparent background on default flexslider theme
  • Fix: Set direction to LTR for flexslider viewport (fix for RTL languages)
  • Fix: Nivoslider HTML Captions
  • Fix: Responsive slides navigation positioning

2.0

  • Fix: Responsive slides navigation styling
  • Fix: Update slide order on save
  • Fix: Smart crop edge cases
  • Fix: Flexslider navigation overflow

2.0-betaX

  • Improvement: Error messages exposed in admin is MetaSlider cannot load the slides
  • Improvement: Load default settings if original settings are corrupt/incomplete
  • Fix: Smart crop ratio
  • Fix: UTF-8 characters in captions (reported by and thanks to: javitopo)
  • Fix: JetPack Photo not loading images (reported by and thanks to: Jason)
  • Fix: Double slash on jQuery easing path
  • Fix: Paragraph tags outputted in JavaScript (reported by and thanks to: CrimsonRaddish)

2.0-beta

  • New feature: Preview slideshows in admin control panel
  • New feature: ‘Easing’ options added to flex slider
  • New feature: ‘Carousel mode’ option added for flex slider
  • New feature: ‘Auto play’ option added
  • New feature: ‘Smart Crop’ setting ensures your slideshow size remains consistent regardless of image dimensions
  • New feature: ‘Center align slideshow’ option added for all sliders
  • New feature: Coin Slider upgraded to latest version, new options now exposed in MetaSlider
  • New feature: Captions now supported by responsive slides
  • Improvement: Responsive AJAX powered administration screen
  • Improvement: Code refactored
  • Improvement: Flex Slider captions now sit over the slide
  • Fix: Nivo slider invalid markup (reported by and thanks to: nellyshark)

1.3

  • Renamed to MetaSlider (previously ML Slider)
  • Improvement: Admin styling cleaned up
  • Improvement: Code refactored
  • Improvement: Plugin localized
  • Improvement: Template include PHP code now displayed on slider edit page
  • Improvement: jQuery tablednd replaced with jQuery sortable for reordering slides
  • New feature: Open URL in new window option added
  • Improvement: max-width css rule added to slider wrapper
  • Fix: UTF-8 support in captions (reported by and thanks to: petergluk)
  • Fix: JS && encoding error (reported by and thanks to: neefje)
  • Fix: Editors now have permission to use MetaSlider (reported by and thanks to: rritsud)

1.2.1

  • Fix: Number of slides per slideshow limited to WordPress ‘blog pages show at most’ setting (reported by and thanks to: Kenny)
  • Fix: Add warning when BMP file is added to slider (reported by and thanks to: MadBong)
  • Fix: Allow images smaller than default thumbnail size to be added to slider (reported by and thanks to: MadBong)

1.2

  • Improvement: Code refactored
  • Fix: Unable to assign the same image to more than one slider
  • Fix: JavaScript error when jQuery is loaded in page footer
  • Improvement: Warning notice when the slider has unsaved changes
  • Fix: Captions not being escaped (reported by and thanks to: papabeers)
  • Improvement: Add multiple files to slider from Media Browser

1.1

  • Improvement: Code refactored
  • Fix: hitting brings up Media Library
  • Improvement: Settings for new sliders now based on the last edited slider
  • Improvement: More screenshots added

A slider with pictures is a very popular and in-demand thing on a huge number sites. The popularity of sliders is that you can show a site visitor several different images on one fixed area of ​​your site without having to scroll the page.

Today there are many options on how to make your own image slider or add a ready-made one. But if we are talking about WordPress, then, of course, the most obvious and easiest way is to use ready-made plugins.

That's why today we'll look at the 12 best free WordPress image slider plugins that will only take you a couple of minutes of time and a couple of clicks to install.

1. SlideDeck 2

A fairly simple adaptive slider that allows you to easily create slides from almost any content. Able to connect to external content sources such as YouTube, Flickr and Pinterest.

2.EasyRotator


A beautiful, simple image slider with a minimum of settings. You can add a slider to posts, pages, and as a widget in any location.

3.Meta Slider


Surely the most popular free slider for WordPress. Very easy to set up: select pictures from the file library, drag them into the slider area, give titles to each slide and fill in the links and fields for SEO. You can choose from four slideshow types (Flex Slider, Nivo Slider, Responsive Slides, Coin Slider).

4. HG Slider


The plugin adds new slide areas in the WordPress admin area for further filling the slides with pictures. When setting up, a standard interface is used WordPress console, so there will be no difficulties with the setup.

5. Meteor Slides


A handy slider plugin that can be customized by adding a shortcode or widget. Support closed mobile devices to switch slides using touch gestures.

6. Cyclone Slider 2


A simple and convenient slider with an intuitive interface. Uses to show slides custom types records and custom fields. There is also a built-in template system for changing appearance slider and image animation options.

7. Morpheus Responsive 3D Slider


As the name implies, the slider makes extensive use of 3D animation effects when switching pictures. It uses regular CSS and jQuery, so your slider page won't take up a lot of resources. It looks quite impressive, see for yourself.

8. WOW Slider


A fairly advanced slider, albeit free. Its range includes many animation effects when switching pictures, including: Collage, Photo, Domino, Page, Rotate, Blur, Flip, Blast, Fly, Blinds, Squares, Slices, Basic, Fade, Ken Burns, Stack, Stack vertical, Basic linear, Book, Cube, Seven.

9. Huge-IT Slider


Another easy to set up and use image slider plugin. Nothing extra, simple setup by adding shortcodes that can be used on any page or post.

10. Easing Slider


Minimum settings, minimum load on the page, no unnecessary garbage. Here's how to briefly describe this slider. It just works.

11. Smooth Slider


According to the developer, you will need less than 1 minute to add this slider to your site. It can create dynamic slides from ready-made posts and pages with media content, so you don’t even have to upload your images to the library.

12. Promotion Slider


It has very flexible settings and allows you to configure a bunch of parameters for each slide. But at the same time, all the settings are collected in one compact menu, so you don’t have to wander through the admin area to add a slider to your site.

The slider is one of those elements that you see on almost every website. They're easy to implement and almost always look great if you use compelling images. Plus, you can do fun things with a WordPress slider, like adding transition effects to it.

However, sliders are not a feature of WordPress, so you will need plugins to add them. In this article, we'll teach you how to do it in just three steps:

  1. Install the WordPress slider and add the media you want to use.
  2. Customize your slider for WordPress.
  3. Place the new slider where you want it to appear.

Once that's done, we'll also introduce you to some of the best WordPress slider plugins so you know what your options are. Let's get to it!

Why do you need a slider for WordPress?

Sliders are simple features, but if you choose the right images they can look amazing.

The slider (or carousel for WordPress) is actually a pretty simple feature. A slider is a collection of images that you rotate using buttons or waiting for an automatic transition. In other words, it's a slideshow of images.

However, you can do much more with a slider. You can also add fun transition effects to it, change its text, create unique buttons and much more. In short, there are many ways to go from a boring, ordinary slider to something that really makes your web page stand out.

As for When It makes sense to use sliders, it depends on your website and goals. Many websites use so-called “hero” sliders, which are placed at the top of the web page as an alternative header. You can see an example in action at the beginning of this section.

In addition to these sliders, you can also post customer reviews, like this:

Ultimately, sliders are a great addition to almost any website. However, they are best used for practical purposes, such as displaying a lot of images in a small space, rather than simply as decoration. They also add a bit of nice interactivity to your site, which is a great way to increase user engagement.

How to Create a Slider for WordPress (in 3 Steps)

In the next few sections, we'll show you how to create a slider for WordPress using Master Slider. We chose this plugin because it is easy to use, offers many cool features, and allows you to install as many sliders as you want.

After that, we'll introduce you to some WordPress carousel plugins you can use and talk more about Master Slider itself. In the meantime, install Master Slider to get started!

Step 1: Set Up Your WordPress Slider and Add the Media You Want to Use

Once you activate the plugin Master Slider, you will find a new Master Slider tab in your panel. There you will see a list of all your WordPress sliders (which should be empty right now). Go ahead and press the button Create a new slider:

The plugin will ask you what type of slider you want to install. You can choose from eight options, including horizontal sliders with and without thumbnails:

In this tutorial, we'll set up a simple custom slider so you can see how the whole process works. So select this option and click the button CREATE.

The plugin will then send you to the tab SLIDES your new element. Here you can add all the images you want to include in your slider with using WordPress Media Uploader or select existing images from your library:

After adding several photos, the tab SLIDES should look something like this:

Your images are ready to go. Keep this tab open and move on to the next step.

Step 2: Customize your WordPress Slider

You can then customize the way the WordPress slider works. To do this, go to the section Background in the tab SLIDES. For each of your slides, you can customize a unique background using your chosen image and any colors and text you like:

Right now we'll set up a simple WordPress slider using all the images we've uploaded. If you scroll down you will see how each image will appear in the slider. There is also a button Preview, which you can select to see how your WordPress slider is shaped:

When you are done here you need to go to the tab SLIDER CONTROLS. There you can choose what type of controls your slider will use. The default setting is called Arrows, and you can probably guess what they look like:

Of course, you can choose any control scheme you want. Then you need to go to the tab SLIDER SETTINGS, where you can further customize your WordPress slider.

For example, you will find options that allow you to adjust the width and height of the slider. You can set a name that will appear in the tab Master Slider:

If you scroll a little further, you can also add simple transition effects to the slider. Keep in mind that the free version of Master Slider only includes two effects: Normal And Fade. We recommend the first option as it offers a neat transition for your WordPress slider:

Lastly, you can also play with skins by scrolling down to the section Appearance. These are slider templates that allow you to change its appearance.

We've shown the default skin in our examples so far, but there are other great options you can play with. You can even get into WordPress sliders if you like things like this:

Once you've finished customizing your WordPress slider style, click on the button Save changes and go to the last step.

Step 3: Place the new slider where you want it to appear

Now your WordPress slider is ready, all that's left to do is place it on your website. The process is simple as the Master Slider plugin generates a shortcode for each slider you create.

To find these shortcodes, go to the tab Master Slider in the toolbar and look under the column Shortcode:

Copy the shortcode for the slider you want to place on your site, and then open the editor of the page or post where you want to place it. Simply paste the shortcode where you want your WordPress slider to appear, like in the example below:

If you check your page, it should look something like this in the interface:

Remember that you can create as many sliders as you want using the Master Slider plugin. You can even delete the ones you no longer want to use in the tab Master Slider by pressing the button Delete next to any of them:

Now you can start creating the best WordPress slider for your website! Before we wrap up, though, let's look at a few alternative plugin options.

5 Best WordPress Slider Plugins

We've already seen one of the best WordPress slider plugins in action. However, we have not yet had the opportunity to introduce you to all its functions. Let's do that now and then show you some other best solutions you can use if Master Slider isn't your thing.

1.Master Slider

You're already familiar with Master Slider, so let's get straight to what you might not know about the plugin. Along with the ability to create WordPress sliders, this plugin also provides full responsiveness. It works with touch navigation, so it's ideal for mobile websites and is built to work with search engines.

Key Features:

  • Create as many sliders as you want.
  • Add sliders to your WordPress pages using shortcodes.
  • Customize slider style and transition effects.
  • Make sure your sliders are fully responsive without any additional customization.
  • Optimize the content of your sliders for search engines.

Price: You can try the free version of Master Slider or choose the full premium version.

2. Smart Slider 3

Smart Slider 3 offers many of the same features as Master Slider. However, it also has a live drag-and-drop editor that you can use to create sliders. If you're the type of person who likes to customize elements of your site using a page builder rather than customization lists, this plugin could be a great option.

Apart from this feature, Smart Slider 3 also ensures that your sliders are ready to use by default even without any additional settings. Additionally, it includes several templates that you can use to quickly customize your engines.

Key Features:

  • Create WordPress sliders using the drag-and-drop editor.
  • Use third party page builders like Divi and Beaver Builder along with the plugin.
  • Set sliders to default.
  • Choose from several templates to get your sliders up and running quickly.
  • Add some fonts to the content of your slides.

Price: Smart Slider 3 offers a free basic version as well as several paid levels.

3.MetaSlider

When it comes to WordPress slider plugins, few are as popular as MetaSlider. With almost 1,000,000 active installs at the time of publishing this article, it is at the top of the plugin food chain.

While MetaSlider doesn't have the slick interface of the other plugins we've reviewed so far, it scores when it comes to ease of use. Adding slides is easy, as is rearranging them, adding text, and even optimizing their metadata. With other plugins, all this work can take a while, but MetaSlider makes it easy with a simple and intuitive interface.

Key Features:

  • Install several WordPress sliders.
  • Quickly add slides and change their order.
  • Add text to your slides and do some search engine optimization (SEO).
  • Customize the transition effects of your sliders.
  • Add sliders to any of your pages using shortcodes.

Price: MetaSlider is free in the WordPress plugin directory, or you can get a premium license with several additional features.

4. Slider by WD

If you're the kind of person who likes to customize every little detail of your website, then Slider by WD might be right for you. It has many features that make it different from other slider plugins such as multiple slide support, responsive design and much more.

Where the plugin really shines is in how many customizations you can make for each of your slides. For example, you can play with their sizes, colors and transition effects. You can even import and export sliders to copy them from one site to another. Finally, the plugin includes the ability to watermark your images, which can come in handy if you need to protect your original work.

Key Features:

  • Install WordPress mobile sliders.
  • Access wide range settings for your sliders.
  • Watermark your slides to protect them from theft.
  • Import and export sliders so you can copy them from one site to another.

Price: The free version of Slider WD is a reliable tool, although you can also upgrade to a premium license.

5. Slide Anything

So far, all the plugins we've talked about are mostly focused on images. However, as we mentioned earlier, you can also use WordPress sliders for other purposes. You can showcase customer reviews and more.

The Slide Anything plugin allows you to set up sliders using almost any type of content you want. Along with images and text, it also allows you to use HTML and even shortcodes, which can create fun combinations. Plus, this plugin includes some fun features like infinite scrolling (so your slider loops). This plugin also has a whole collection of cool transition effects and much more.

Key Features:

  • Set the sliders using any type of content you want.
  • Choose from several transition effects for your slides.
  • Use shortcodes in your sliders.

Price: You can try Slide Anything Pro for free, or get access to a few extra features (like pop-ups) with the premium version.

Conclusion

There's a reason why sliders are so popular. All you have to do is select a few images, add a transition effect or two, and maybe include some text, and you have an element that looks great anywhere on your site (especially as a header). With WordPress you can easily customize your slider using your favorite plugin. We're partial to Master Slider because of its wealth of features, but there are many other great options.

Do you already have experience customizing a WordPress slider? Tell us about it in the comments section below!