Skip to main content
Help CenterWidget & CustomizationWidget sizing & responsive behavior

Widget sizing & responsive behavior

The Vorbra widget automatically adapts to fit its container. It's fully responsive and works on mobile, tablet, and desktop.

How sizing works

  • The widget fills 100% of its parent container's width
  • Height adjusts automatically based on content
  • On mobile, grid and masonry layouts switch to a single column
  • The carousel layout shows one card at a time on all screen sizes

Controlling the width

To control the widget's width, wrap it in a container with a specific width:

<div style="max-width: 800px; margin: 0 auto;">
  <script src="https://www.vorbra.com/embed.js"
    data-vorbra-space="your-slug">
  </script>
</div>

Limiting testimonials shown

Use the data-max attribute to control how many testimonials are displayed:

data-max="6"

This is useful for homepage sections where you want a compact display. Leave it off to show all approved testimonials.

Tip: The widget uses shadow DOM isolation, so your site's CSS won't accidentally break the widget's styling.