Alternative Media Gallery

[CommunityJedi22]

Note: Display 4.0 documentation is provided as a courtesy for clients on this older version of PowerReviews. We recommend contacting your Account Manager to discuss upgrading to our newer Display 4.1 version as soon as possible.

This article discusses how to implement the Alternative Media Gallery. To learn more about the Alternative Media Gallery and its features, click here.

Requirements

In order to enable the Alternative Media Gallery, ensure that your PowerReviews solution is on the latest version of the Review Display. You must also be using the New Content Management and Moderation interface and the newest version of the Media Gallery.

Adding the Alternative Media Gallery

To enable the Alternative Media Gallery, use the Components Object Model to define what PowerReviews content you'd like to render, and where it will render to. The keys of the properties within the Components object correlate to the content you'd like to render for a product. Their values correspond to the ID of the container HTML element where the content should be rendered.

The key to using the Alternate Media Gallery is ReviewImageSnippet.

Example:

<div id='pr-reviewsnippet'></div>
<div id='pr-imagesnippet'></div>
<div id='pr-reviewdisplay'></div>

<script src="https://ui.powerreviews.com/stable/4.0/ui.js" async></script>
         
 <script>
POWERREVIEWS.display.render({
  api_key:'<API Key>',
  locale: <locale>,
  merchant_group_id: '<MGID>'
  merchant_id: '<Merchant ID>',
  page_id: '<PageID>',
  review_wrapper_url: 'http://yoursite.com/write-a-review/?pr_page_id=__PAGE__ID__',
  on_render: function(config, data) {
     console.log(config);
     console.log(data);
  },
  components: {
    ReviewSnippet: 'pr-reviewsnippet',
    ReviewImageSnippet: 'pr-imagesnippet', 
    ReviewDisplay: 'pr-reviewdisplay'
  }
});