What can we do to make it easier to design with Wild Apricot?

Responsive slideshow with automatic width/height

I'm experimenting with the WA slideshow gadget, but the problem I'm having seems to be with the choices for the sizing. It seems I can only choose from fixed layouts (16:9, 3:4, 1:1, or a fixed height). This works ok for camera photos that actually are in those aspect ratios but not so good for custom images like banners and header images which may have different aspect ratios such as being very long and rectangular (e.g., a 10:1 aspect ratio). Choosing the "Landscape 16:9" option displays the entire banner image, but it also puts a lot of whitespace above and below the image (to fit it into the 16:9 box) that is not acceptable.

What I'd like is:

* I want the slideshow to be responsive so it shows up properly on various devices,

* I don't want the images to get cropped in any direction as seems to happen with the "Fit image to slideshow area" option,
* I want the containing box to *fit* the image, whatever the aspect ratio is, without adding unnecessary whitespace.

If anyone has a solution for this, I'd greatly appreciate hearing it. Otherwise, I'd like to add this to the wishlist for the slideshow. Many of my clients would like to use the slideshow gadget for rotating banner ads or slideshows in their headers.



4 votes
Sign in
Sign in with: facebook google
Signed in as (Sign out)

We’ll send you updates on this idea

Kim Skimmons shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →


Sign in
Sign in with: facebook google
Signed in as (Sign out)
  • Kim Skimmons commented  ·   ·  Flag as inappropriate

    No, the problem is that the slideshow gadget's image container is not elastic. i.e., it doesn't stretch to fit any size image, it only has a few aspect ratios to choose from. If you have an image that is very wide but not very tall, or vice versa, the slideshow gadget will add "letterbox" bars above/below or to right/left in order to display the images within the fixed aspect ratio container. A rotating banner in the header of a website will likely not be a 16:9 aspect ratio. Same with a rotating ad banner on a sidebar which might be tall and skinny. Does that make sense?

    - Kim

  • Deanna DSAIA commented  ·   ·  Flag as inappropriate

    We are currently using another company for our website and we have a set h/w for our slideshow image. I normally just edit my image in picmonkey to make it fit correctly into the slideshow parameters.

    Is it just that you want to have several different sizes? Because a uniform slideshow looks so much better.

  • Merge commented  ·   ·  Flag as inappropriate

    I'm having this issue too. I often use images that are wide but not tall (1140 x 300px for example) which does not display well in any setting in the slider gadget on a responsive site.

    It seems the only option for now is to install a third-party slider like nivo which is not ideal.

    The slider gadget in general needs some updating to include the ability to add text and links. I hope they add this to the roadmap soon

  • FredS commented  ·   ·  Flag as inappropriate

    I have the same issue...have you gotten any help with a workaround?

Feedback and Knowledge Base