JSJ Gallery Slideshow
[resolved] Vertical alignment (7 posts)

  1. Hannes17
    Posted 2 years ago #


    first of all great plugin!

    I was just wondering if I can have the thumbnails vertical aligned on the right side of the main picture. Instead of underneath.

    Could you help me what I need to add or change in the code?
    Thank you very much!


  2. Jorge Silva-Jetter
    Plugin Author

    Posted 2 years ago #

    That functionality is not built into the plugin and would probably not be that simple to implement.

    If you have some knowledge of CSS you might be able to pull it off through float:right; and setting a static width on the pagination div or something like that.

    In the future, this plugin might have a wider variety of themes and templates to choose from with some of them being premium. I'm still thinking about how this would work/look though.

  3. Hannes17
    Posted 2 years ago #

    Hey, thank you very much for the quick response!

    Unfortunately I am not really experienced in coding..
    I managed to get the thumbnails to float right and to align vertical with:

    .gallery_container_jsj-gallery-slideshow .gallery-pager {float:right; width:100px;}

    But the thumbnails are still listed underneath the main pic. I don't know how I should get them to align on the right.
    Do you have an idea?

    Thank you very much!

  4. Jorge Silva-Jetter
    Plugin Author

    Posted 2 years ago #

    Honestly, this is pretty complicated because it depends on the CSS you have for your theme, how the plugin outputs HTML, amongst other things.

    I would really try to find a developer with advanced CSS skills that could help you out.

    This is not a problem with the plugin itself but rather a customization and I think it's a bit beyond the scope of this forum.

    Let me know if you figure it out!

  5. Hannes17
    Posted 2 years ago #


    I played around a little with the css and I when I changed the width of the containers and added a float:right I got my desired results:

    .gallery_container_jsj-gallery-slideshow .gallery {width: 611px; float:left;}
    .gallery_container_jsj-gallery-slideshow .gallery img {width: 611px; float:left;}
    .gallery_container_jsj-gallery-slideshow .gallery-item {width: 611px; float:left;}
    .gallery_container_jsj-gallery-slideshow .gallery-pager {float:left; width: 170px; padding:5px; margin-top:15px;}

    Thank you very much for your assistance!

  6. Hannes17
    Posted 2 years ago #

    I mean I added a float:left, not float:right .. :)

  7. Jorge Silva-Jetter
    Plugin Author

    Posted 2 years ago #

    Wow, that's great! Happy to hear that!

    If you enjoy the plugin, don't hesitate to write a review :)


Topic Closed

This topic has been closed to new replies.

About this Plugin

  • JSJ Gallery Slideshow
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic


No tags yet.