[Plugin: NextGEN Gallery] Centre images in slideshow

I was going to ask the same thing – did you ever get this sorted?

Hi QuizToon

I did get some speedy help from Photocrati Support but the best they could come with is to use <center>[slideshow id=1]</center> or <div align=”center”;>[slideshow id=1]</div>.

My widest image in the slideshow was then correctly centred but the narrower ones align to the left edge of where the wide image was if that makes sense. So, it almost worked but not quite.

I’m just going make my main slideshow with images of all the same width as that works.

Thanks for that, I have tried all those solutions but to no avail

Wouldn’t have thought it was quite so difficult just to center something.

sounds this problem comes from the nextgen-gallery/js/jquery.cycle.all.js,
line 278 $slides.css({position: 'absolute', top:0, left:0}).hide().each(function(i) {
which dynamically put a “position : absolute” css tag on images

impossible to solve it like that, you can try at your own risks to change position: ‘absolute’ to position : ‘relative’
in this case be sure that you’re not using the compressed js file nextgen-gallery/js/jquery.cycle.all.min.js

Thanks renoproc – apparently the problem should be resolved when nextgen and photocrati become more integrated.

Just a quick follow up on this – I tested renoproc’s suggestion but it made no difference for me.

I’m working with it by adding canvas to narrower images. Works fine that way, but if the browser window is not fully expanded, the images slide to the right.

I am after the same fix. I will probably put a layer under my portrait photos in my slideshow until this is fixed

changing the js on line 278 from absolute to relative does something. Still not very convenient. My js knowledge is not to good. But one thing that appeared strange to me and seems to come from the js is that the height of my images always stays the same (400px) which is correct. thought the width changes constantly which gives me headaches. Anyone got a hint how I can force my images to stay at 630px, no matter what?

Thank you!

j

try this it’s what i do

https://damienquintal.tumblr.com/post/21844240055/center-align-images-with-nextgen-gallery

As mentioned previously in this thread, we will have the slideshows centered by default within the next few upgrades. For now, you might try this temp. CSS option:

div.ngg-slideshow {
margin: auto;
}

So where do I put that code to make it work?

Same question here

I try to add in nggallery.css file /* -Single picture -*/ area but without results.

I’m using Enable AJAX pagination with Shutter effect.

ANY SOLUTION?!

The most simple way to add the custom css I provided to you above [here] is to install WordPress.com Jetpack, then once activated, go to Appearance >> Edit CSS and copy and paste the Custom CSS to this stylesheet and save changes. That should work. What it does, is overwrites the CSS for the NGG Slideshow and forces it to margin:auto; (center).