How to vertically center navigation arrows in a testimonial slider when text length varies

Ask the community
1

Hi everyone,

I’m working on a testimonial slider in Wix Studio and I’m running into an issue that feels like it should be basic functionality. So I’m hoping I’ve either missed something or that someone can advise me on the best setup.

I have a very simple testimonial layout:

  • A quote (text)

  • The person’s name underneath

  • Navigation arrows to move through the testimonials

The problem is with the vertical positioning of the navigation arrows.

Each testimonial has a different text height (some are 3 lines, some 4–5 lines). Because of that, the height of the item changes. Right now, I have to manually position the arrows so they appear visually centered. But this means:

  • They have to be manually adjusted on every breakpoint

  • They have to be manually adjusted for every page where the testimonials appear

  • When my client updates or adds new testimonials, the arrows are no longer centered

  • It becomes impossible to maintain consistent alignment across the site

This seems like something very common — a lot of websites use testimonial sliders with different text lengths — so I’m wondering if there is any built-in way to:

Automatically center the navigation arrows based on the height of the text/content inside the slideshow item.

For example, the Wix Pro Gallery has options like:

  • Center arrows based on gallery

  • Center based on image

  • Center based on text

But I can’t find anything similar for slideshow repeaters in Wix Studio.

Here are two public pages where you can see the issue clearly:

Screenshots are attached as well.

Is there a setting, best-practice layout, or workaround (flexbox, container settings, etc.) that would allow the arrows to auto-center relative to the testimonial text?

Screenshot 2025-11-21 at 9.45.07 am
Screenshot 2025-11-21 at 9.45.07 am2876×1022 139 KB

1 Like
2

Are you using the slideshow repeater option?

Either way, this sounds like a docking issue :slight_smile: Wherever the button is docked to, it will keep it’s distance relative to the docking as the screen size changes. For example, if you want it in the bottom right, you would dock to the right and bottom.

In this case, you want it to keep equal space from the top and bottom, but keep it’s distance from the side.

Sooo - make sure it’s not docked to either top or bottom and just the respective side

Screenshot 2025-11-21 at 11.34.42
Screenshot 2025-11-21 at 11.34.421343×858 128 KB

3

Thanks for explaining the docking! I understand how docking affects the arrow’s position relative to the slideshow container.

However, my core issue is a bit different:

Each testimonial in my slideshow repeater has a different text height (some 3 lines, some 4–5). Because the text height changes per item, the vertical “center” of each slide is different.

Docking only keeps the arrow positioned relative to the container edges, not relative to the text block.

So even with docking set up correctly, the arrow will not stay centered to the text unless I manually reposition it per testimonial and per breakpoint.

What I’m trying to achieve is:

auto-centered navigation arrows based on the height of the dynamic content, not the container.

Is there any recommended way to let the arrows center themselves dynamically?
Or is this simply not supported yet in slideshow repeaters?

4

If the vertical center of the text is changing, it means it’s also docked to a side. If you want the arrows to match the vertical center of the text they all need to have the same vertical (top and bottom) docking