Sep 292015
 

Last Updated: February 14, 2016

How To Center WordPress Slideshow Plugin post shows you what settings to edit to center the slideshow on a post or page.

There are times when you need to customize your slideshow and edit the settings to center the slideshow. This post will help you achieve this. There are only a few changes you need to make to center your slideshow. It is very simple and easy.

WordPress Slideshow Plugin Tutorials:

  1. General Settings
  2. Default Settings
  3. Custom Styles
  4. Advanced Settings
  5. Insert Slide Into Post
  6. Pagination Bar
  7. How To Center The Slideshow
  8. Change Slideshow Width And Height
  9. Troubleshooting

How To Center WordPress Slideshow Plugin Steps

Step 1 ) The following image shows you the slideshow displayed but it is not centered. It does not look very nice when viewed on the website.

I added the following shortcode to a post to display the slideshow. (Remember your shortcode will have a different id)

[ slideshow_deploy id=’3959′ ]

wordpress-plugin-slideshow-not-centered

Step 2 ) The following image Display Settings illustrates the following settings. In this tutorial I have concentrated in the following two values.

  • Maximum width. When maximum width is 0, maximum width is ignored = 650
  • Image behavior = Stretch to fit

Note: Your settings will be different.

wordpress-plugin-slideshow-centered-display-settings

Step 3 ) The following image Custom Styles displays the CSS code added to the following area to center the slideshow. Click on Custom Style select the style you wish to edit and enter the CSS code in the following class .slideshow_container.

CSS Code Added:

.slideshow_container {
    margin: 0 auto; /* This centers the slideshow, if the slideshow has a maximum width. */
}

Note: Remember you need to add a maximum width value as shown in Step 2 ) above.

wordpress-plugin-slideshow-centered-css-code

Step 3 ) If everything went well then you should see your slideshow centered as illustrated below.

Note: Your slideshow will be different.

wordpress-plugin-slideshow-centered

Click on the following link Change Slideshow Width And Height which provides some answers to some of the most common questions.

I will be updating this tutorial from time to time so keep coming back for the latest updates.

If you have a questions send me an e-mail or leave a comment.

Enjoy

Manuel Ballesta Ruiz is a web developer, Blogger and WordPress Enthusiast.

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)

The following GDPR rules must be read and accepted:
This form collects your name, email and content so that we can keep track of the comments placed on the website. For more info check our privacy policy where you will get more info on where, how and why we store your data.