Skip to main content

Documentation Index

Fetch the complete documentation index at: https://developer.dashsocial.com/llms.txt

Use this file to discover all available pages before exploring further.

​
Overview

The Product Page Gallery Widget displays product-linked media in a carousel on your product pages. It matches the product’s URL on the page with the URL in your Dash Social library to pull relevant media. Clicking on a post opens a popup with product details and tagged products. You can disable the popup using the data-links-disabled parameter.

​
Before you start

  • Get your brand ID .
  • Make sure your products in the library have URLs that match your product page URLs.

​
Embed the widget

To add the Product Page Gallery Widget, place the script inside any product page template. For e-commerce platforms with a shared PDP template, you only need to add the script once.
Replace <brand id> with your Dash Social brand ID. Keep the value wrapped in double quotes.
<script
  src="https://cdn.dashsocial.com/web/js/product-carousel-embed.js"
  type="text/javascript"
  data-name="dhproduct-carousel"
  data-id="<brand_id>"  <!--Replace <brand_id> with your Brand ID-->
  data-id-type="brand_id"
  data-row-size="3"
  data-mobile-row-size="2"
  data-mobile-gap-size="4"
  data-call-to-action="learn_more"
  data-autoplay="false"
  data-carousel-dots="true"
  data-disable-product-new-tab="false"
></script>

​
Displaying localized products

To display localized product data, use the data-override parameter. This value must match the override in your localized product feed. When using localized feeds, you must also include the data-product-id parameter, matching the product’s unique identifier (e.g., SKU) from the feed. 
<script
  src="https://cdn.dashsocial.com/web/js/product-carousel-embed.js"
  type="text/javascript"
  data-name="dhproduct-carousel"
  data-id="<brand id>" <!--Replace <brand_id> with your Brand ID-->
  data-id-type="brand_id"
  data-product-id="abcdef123"
  data-override="FR"
  data-show-price="true"
></script>

​
Widget parameters

These parameters control the behavior and appearance of the Product Page Gallery widget. If you are interested in more advanced styling and customization, refer to the Widget Customization Guide:

Widget Customization

Customize Dash Social widgets with CSS for fonts, colors, and layout tweaks.
ParameterRequiredDescription
data-idYesYour brand ID. Wrap it in double quotes.
data-id-typeYesSpecifies the type of ID used. Must be "brand_id".
data-row-sizeNoNumber of images per row. Defaults to 3 if not specified.
data-gap-sizeNoSpace between images in pixels. Default is 2.
data-mobile-row-sizeNoNumber of images per row on mobile. Defaults to data-row-size.
data-mobile-gap-sizeNoSpace between images on mobile. Defaults to data-gap-size.
data-call-to-actionNoHover label text. Default is "learn_more". Examples: "shop_now", "book_now".
data-lazyNoLazy-loads images when they enter view.
data-links-disabledNoDisables the product detail popup when media is clicked.
data-hide-popup-footerNoHides the Dash Social logo in the popup footer.
data-high-resNoShow high-resolution images (1, default) or low-resolution (0).
data-media-formatNoSet to "original" to use the media’s original aspect ratio and resolution. Overrides data-high-res.
data-scroll-disabledNoHides the carousel scroll buttons.
data-autoplayNoAutomatically scroll the carousel. Default is false.
data-autoplay-speedNoTime in milliseconds between automatic carousel scrolls. Only applies when data-autoplay is true. Default is 5000.
data-infiniteNoLoop carousel back to start. Default is false.
data-carousel-dotsNoShow carousel navigation dots. Default is false. Set to true to display them.
data-disable-product-new-tabNoDefault is "false". When set to "true", clicking a product link opens in the same tab instead of a new tab.
data-show-priceNoShow product price from the product feed in the popup. Default is false.
data-overrideNoRequired to display localized product feed data. Must match the override value on the feed.
data-product-idNoRequired for localized feeds. Matches the product’s SKU or unique identifier.
data-use-product-groupNoRequires data-product-id. When true, matches products by group ID from the product feed instead of URL. If no group ID exists, no media is returned.
data-minimum-mediaNoMinimum number of media items required for the gallery to display.
data-media-typesNoFilter media by source. Accepts comma-separated values like "INSTAGRAM_UGC,TIKTOK_UGC". Supported values: TIKTOK_OWNED, INSTAGRAM_OWNED, INSTAGRAM_STORY, FACEBOOK_OWNED, PINTEREST_OWNED, TWITTER_OWNED, THREADS_OWNED, LINKEDIN_OWNED, TIKTOK_UGC, INSTAGRAM_UGC, INSTAGRAM_STORY_UGC, UPLOADED.

​
Content Security Policy

If your site uses a Content Security Policy (CSP), you’ll need to allow the domains and MIME types used by the Product Page Gallery Widget. This ensures scripts, images, and network calls load correctly.

​
Why this matters

  • Ensures the widget script can load safely.
  • Allows image and video assets from approved Dash Social domains.
  • Prevents CSP errors that block network calls or media loading.

​
Required CSP directives

script-src https://cdn.dashsocial.com;
connect-src https://likeshop.me;
img-src 'self'
  data:
  https://cdn.dashsocial.com
  https://likeshop.me
  https://dashsocial-static.s3.amazonaws.com
  https://d1cka1o15bmsqv.cloudfront.net
  https://dashsocial.com
  https://www.dashsocial.com

​
Approved domains and MIME types