View Categories

[trip_reviews_gallery] Shortcode

The Trip Reviews Gallery shortcode displays only reviews that include photos, making it ideal for showcasing visual testimonials from travelers. This shortcode filters out text-only reviews, creating a photo-focused display that highlights authentic traveler experiences through images.

Basic Usage #

Insert the shortcode:

[trip_reviews_gallery]

By default, this displays up to 10 reviews with photos in a grid layout, showing star ratings, author information, and dates.

Shortcode Syntax #

[trip_reviews_gallery trip_id="1234"]

Replace 1234 with the ID number of the specific trip whose photo reviews you want to display.

Available Options #

The Trip Reviews Gallery shortcode uses the same options as the Trip Reviews shortcode, giving you complete control over how your photo testimonials appear.

Layout Options #

layout – Choose how photo reviews are arranged on the page.

  • Options: grid, list, or slider
  • Default: grid
  • What it does:
    • grid – Displays photo reviews in a multi-column card layout
    • list – Stacks photo reviews vertically as individual stories
    • slider – Creates a swipeable carousel with automatic lightbox galleries for viewing full-size images

Example:

[trip_reviews_gallery layout="slider"]

Trip Selection #

trip_id – Display photo reviews for a specific trip.

  • Format: trip_id="1234" (use the trip’s ID number)
  • Default: Auto-detects the current trip when used on a trip page
  • When to use: Add this option when placing the gallery on pages other than trip pages, or when you want to show photo reviews from a different trip

Example:

[trip_reviews_gallery trip_id="2487"]

Display Controls #

count – Limit the number of photo reviews shown.

  • Format: count="8" (any positive number)
  • Default: 10
  • What it does: Controls the maximum number of photo reviews that appear at once

Example:

[trip_reviews_gallery count="8"]

show_rating – Toggle star ratings on or off.

  • Options: true or false
  • Default: true
  • What it does: When set to true, displays the star rating for each photo review. Set to false to hide ratings and keep the focus purely on images.

Example:

[trip_reviews_gallery show_rating="false"]

show_author – Toggle reviewer name and avatar.

  • Options: true or false
  • Default: true
  • What it does: When set to true, shows the reviewer’s name and profile picture. Set to false to display anonymous photo reviews.

Example:

[trip_reviews_gallery show_author="false"]

show_date – Toggle the review timestamp.

  • Options: true or false
  • Default: true
  • What it does: When set to true, shows when the photo review was posted (e.g., “visited 3 months ago”). Set to false to hide dates.

Example:

[trip_reviews_gallery show_date="false"]

Sorting Options #

order – Set the sort direction.

  • Options: DESC (newest/highest first) or ASC (oldest/lowest first)
  • Default: DESC
  • What it does: Controls whether photo reviews appear in descending or ascending order

orderby – Choose what to sort by.

  • Options: date, title, rand, rating, or modified
  • Default: date
  • What it does:
    • date – Sort by when the photo review was published
    • title – Sort alphabetically by review title
    • rand – Show photo reviews in random order
    • rating – Sort by star rating
    • modified – Sort by when the review was last updated

Example:

[trip_reviews_gallery orderby="rating" order="DESC"]

This shows the highest-rated photo reviews first.

Styling Options #

class – Add a custom CSS class to the gallery wrapper.

  • Format: class="your-class-name"
  • When to use: When you want to apply custom styling to a specific instance of the photo gallery
  • What it does: Appends your chosen class name to the gallery container, allowing you to target it with CSS

Example:

[trip_reviews_gallery class="storyboard-gallery"]

custom_css – Inject inline CSS directly from the shortcode.

  • Format: custom_css="your CSS code here"
  • When to use: For quick styling adjustments without editing your theme files
  • What it does: Applies the CSS rules you provide directly to this photo gallery

Example:

[trip_reviews_gallery custom_css="background: #f9f9f9; padding: 30px;"]

Complete Example #

Here’s a fully customized shortcode combining multiple options:

[trip_reviews_gallery trip_id="2487" layout="grid" count="8" show_rating="false" class="storyboard-gallery"]

This shortcode:

  • Shows photo reviews for trip #2487
  • Displays them in a grid layout
  • Limits the display to 8 photo reviews
  • Hides star ratings to emphasize visual content
  • Applies the “storyboard-gallery” CSS class for custom styling

Custom Styling Example #

You can style your photo gallery by adding CSS to your theme. Here’s an example that creates a modern storyboard design with elegant shadows and optimized image display:

Where to add this code: Go to Appearance → Customize → Additional CSS in your WordPress dashboard, or add it to your theme’s stylesheet.

.trepro-trip-reviews-gallery.storyboard-gallery .trepro-review-card {
  box-shadow: 0 20px 40px rgba(34, 37, 49, .12);
  border-radius: 24px;
  overflow: hidden;
}

.trepro-trip-reviews-gallery.storyboard-gallery .trepro-review-images img {
  aspect-ratio: 4/3;
  object-fit: cover;
}

This CSS:

  • Adds a soft, elevated shadow effect to review cards
  • Creates rounded corners (24px radius) for a modern look
  • Ensures content stays within card boundaries with overflow: hidden
  • Standardizes all images to a 4:3 aspect ratio
  • Uses object-fit: cover to ensure images fill their space without distortion

Summary #

The Trip Reviews Gallery shortcode ([trip_reviews_gallery]) is your solution for creating visually compelling testimonial displays that feature only reviews with photos. Perfect for landing pages, photo galleries, or anywhere you want to showcase authentic traveler experiences through images, this shortcode automatically filters out text-only reviews.

It offers the same flexible customization options as the standard Trip Reviews shortcode, with the added benefit of automatic lightbox galleries in slider mode. Use this shortcode to build trust with potential travelers by letting your customers’ photos tell the story of their journey.

What are your Feelings