View source for How to create a slider from gallery images

=== About the slider ===
Gallery slider short code introduced in v7.2.3 makes the custom slider short code introduced in v7.2.1 and the regular slider shortcode that was present from a long time obsolete.

If you have to insert a slider in post or a page, this is the way to go.

Did we tell you this slider is a smart slider meaning it serves different sized images for desktops, tablets and mobiles?

'''Note''': [http://unslider.com Unslider], a lite weight slider that spans the entire window width was introduced in v7.2.4. Please refer to its usage instructions below.

=== Using the gallery_slider shortcode ===

[gallery_slider ids="1780,1771,1766" width="640" height="380"]

The above short code create a slider with slides of width 640px and height 380px using the images with id's 1780,1771,1766 from your media library. 

Unlike the slider shortcodes before or the custom slider  you don't have to crop, or resize images before uploading.
 
Resizing and cropping is automatically handled for you.

''Just note that, wordpress can not upsize a images. If you upload a image smaller than slider dimensions.
''

[[File:Gallery-slider-shortcode.jpg]]

[[File:How to insert a slide in gallery slider shortcode.jpg]]

Target link field is added by Swift theme, and isn't a standard WP option.

'''Update''': In version 7.2.4, we added a new field called caption class below the target link.  You can define new css classes to style the captions and add them here.
Swift by default gives you three classes(styles) namely
#bookmark
#tall
#middle

You can combine the first two with alignleft and alignright classes to change their position. So effectively you have 5 different ways to style your slides. Cool, right?

===How to get the ID's of images?===
====Standard way====
One way is to hover over the image in wordpress media library page or media uploader, and get the ID from the status bar of your browser.

#Select the image.
#Hover over edit or delete image link
#In the status bar you will find the ID.

[[File:Selecting-slides-for-gallery-sldier.jpg]]
====The smart way ====
#Click on create gallery and insert a gallery with you slides.
#Switch from visual to html mode editor
#Now change the gallery short code to gallery_slider and add the width and height.
# No step 4, thats it :)

===More shortcode attributes ===
Apart from the width, height and the ids, you can specify the following attributes

=====responsive_images (Default = true)=====

When you enable responsive layout, this shortcode serves images that are optimism for tablets/mobiles. 
Some times this may not be the desired behaviour, specially when you are using a slider that spans the entire width of the page.

setting this to false will not alter image sizes on tablets on mobiles.
===Window width slider (gallery_window_width_slider) ===
Creating the window with slider is same as above except you say gallery_window_width_slider instead of gallery_slider.

Owing to how the slider works, you have only one caption style and it is entered both vertically and horizontally.