Contents

Video Testimonials — Plugixa Testimonial

Attach a video URL to any testimonial. The plugin auto-detects the video type (YouTube / Vimeo / self-hosted) and renders the appropriate player.

Adding a video

Edit a testimonial and fill in Video URL. As you type, the helper text shows the detected type.

Supported URL patterns:

URL pattern Detected type
youtube.com/watch?v=... youtube
youtu.be/... youtube
youtube.com/embed/... youtube
youtube.com/shorts/... youtube
vimeo.com/{id} vimeo
player.vimeo.com/video/{id} vimeo
.mp4, .webm, .ogg, .mov self-hosted

Leave blank for a text-only testimonial.

Free users see the field dimmed with a PRO chip + Upgrade button overlay — the field can’t be edited without a Pro license.

Rendering strategy

YouTube

  • Displays the high-quality thumbnail from img.youtube.com/vi/{id}/hqdefault.jpg.
  • Shows a YouTube-style play button overlay.
  • On click, JS replaces the thumbnail with a youtube-nocookie.com iframe with autoplay=1.
  • Uses privacy-enhanced mode by default to minimize third-party tracking.

Vimeo

  • Displays a styled placeholder (fetching Vimeo thumbnails requires a separate API call, so we use a branded placeholder).
  • On click, JS replaces with a player.vimeo.com iframe with autoplay=1.

Self-hosted

  • Renders a native <video> element with:
    • controls — standard player UI.
    • preload="metadata" — loads only enough to know duration.
    • playsinline — keeps inline playback on iOS (no full-screen auto-launch).

Lazy loading

All video embeds are lazy-loaded. No iframe is created until the user clicks the thumbnail — meaning:

  • Faster initial page load — no external requests to YouTube / Vimeo on page load.
  • Better privacy — YouTube / Vimeo cookies don’t set until the user opts in by clicking.
  • Lower memory — idle cards don’t hold iframe contexts.

The VideoPlayer JS class in testimonials.js listens for clicks on .pxt-video-thumb elements and performs the thumbnail-to-iframe swap.

Where videos render

Videos render after the testimonial text and before the rating stars in all 4 templates (grid, slider, masonry, list).

You can hide video for a specific shortcode:

[plugixa_testimonials show_video="0"]

Or hide it globally in the saved shortcode config.

16:9 aspect ratio

All videos render in a 16:9 aspect-ratio container with a black background. The CSS uses modern aspect-ratio: 16/9 for reliable sizing across themes.

If your theme enforces unusual width constraints, the video container shrinks to fit the available card width while preserving the 16:9 ratio.

Multiple videos

Each testimonial has a single video_url field. For multiple videos per testimonial, use custom fields (Pro) — see Custom Fields — with the url field type, then render them via a template override.

Import / Export

The video_url column is included in:

  • CSV headers — video_url.
  • JSON export — full value preservation.
  • CSV import — auto-mapped from video, video_url, or video_link column names.

See Import / Export.

Admin UI

In the testimonial form:

  • Text field labeled Video URL with a PlayCircleOutline icon.
  • As you type, the helper text shows “Detected: YouTube” / “Detected: Vimeo” / “Detected: Self-hosted” / “No video detected.”
  • Validates the URL format on blur.

Free users see the field overlaid with a PRO chip and an Upgrade button — the underlying input is disabled.

Frontend JS

The VideoPlayer class (in assets/frontend/js/testimonials.js) is initialized by TestimonialApp on DOMContentLoaded. It:

  1. Finds all .pxt-video-thumb elements.
  2. Attaches a click listener.
  3. On click, builds the appropriate iframe (YouTube, Vimeo) or triggers <video> playback (self-hosted).
  4. Handles nested nesting inside slider slides — re-initializes when Swiper creates new slide DOM.

Troubleshooting

YouTube thumbnail not appearing

  • The YouTube video ID extraction may have failed — check the URL format.
  • YouTube occasionally returns 404 for hqdefault.jpg. Try a different quality suffix:
    • hqdefault.jpg (default, 480×360)
    • mqdefault.jpg (320×180)
    • sddefault.jpg (640×480)
    • maxresdefault.jpg (1280×720, not guaranteed to exist)

Vimeo iframe not loading after click

  • Check the Vimeo video ID in the URL — should be numeric.
  • Private Vimeo videos require embed permissions — enable “Where can this be embedded?” in Vimeo privacy settings.

Self-hosted video doesn’t play on iOS

  • playsinline should already be on the video element.
  • iOS requires MIME type video/mp4 — ensure the file has a .mp4 extension and the server sends the correct Content-Type header.

Video container is the wrong size

  • .pxt-video-wrapper uses aspect-ratio: 16 / 9. If your theme’s CSS resets this, add a rule in Settings → Custom CSS:
.pxt-video-wrapper { aspect-ratio: 16/9; }

Quick Links

Plugin page Changelog