Required parameters/values
1. widgetContainerId (string) (Deprecated in the latest version of the widget embed code) - ID of the HTML element in which the widget will be displayed. For example, for a container with HTML markup <div id="photoslurp_container"> the parameter will be established in the following way:
widgetContainerId: "photoslurp_container",
2. widgetId (string) (Not necessary in the latest version of the widget embed code unless widget Analytics Per Country are needed) - the name that allows distinguishing this instance of the widget univocally. This allows the Photoslurp platform to discriminate the statistical data of use of each of the widgets configured in the store, and the user will be able to identify each widget in the Photoslurp analytics panel. A practical way of naming widgets is by indicating the page on which they will be displayed. For example "Home", "Product", or "Lookbook".
3. username (string) (Only for Photoslurp module) - enter the username with which the Photoslurp dashboard is accessed.
Basic parameters
1. widgetType (string) - sets the design to be used in the widget. Options available are "carousel", "gallery", "circular" and "masonry".
2. albumId (integer) - the ID number of the campaign from which you want images to be displayed in the widget.
3. theme (integer) - sets the display theme used in the widget. Options available are: "retro", "modern" and "dark".
4. productId (string array) (only for JavaScript integrations) - it is used in product page widgets and allows you to show only those images related to the product displayed. Accepts individual values or multiple products as an array [‘product1’,’product2’].
5. collection (string array) - It allows filtering images by the collection they are part of. Collections are set up in the Photoslurp backend and provide a way in which to group photos in a campaign into sets.
6. lang (string) - can be any format language code (en, en-us, en_US) and should be the lang-code used in your eCommerce store. Therefore, the same that has been set in the product catalogue imported into Photoslurp platform.
7. pageLimit (integer) - the number of images to load per page for both the "gallery" and "carousel" modes.
8. showSubmit (true/false) - this parameter will enable the front-end upload widget, and when the value is set to true, the 'Submit' button is displayed in the upper right corner of the gallery or carousel.
9. submitText (string) - this is the text that will be displayed on the Submit button.
10. addPhotosImg (string) - URL of an image that will be displayed if there are still no images assigned to the product shown in the tab. We recommend showing a "banner" style image inviting users to post their images.
11. randomOrder (true/false) - if its value is set to true, it displays the images by randomly ordering.
12. noteAddPicsText (string) - this is the text to be added on the top of your gallery and carousels to motivate customers to participate and interact with the images shown.
13. socialIcons (true/false) - Enable social icons in the Lightbox to allow users to share pictures back to social networks.
14. tocLink (string) - a link to a T&C page that users need to agree to when uploading photos using the frontend uploader.
15. shopThisLookText - the text to be added as the heading for the "Shop This Look" section which should fit the product.
16. pageType (string) (Only for Photoslurp module) - currently supported types are Home, Product, Lookbook. This parameter is used in analytics calculations.
17. sameTabLinks (true/false) - When clicking in a product thumbnail, allows the product page to load in the current tab instead of a new one.
Advanced parameters
1. autoscrollLimit (integer) - This parameter is used to set the number of pages that will be loaded in "gallery" with infinite scroll before showing a "Load More" button.
2. loadMoreText (string) - related to the autoscrollLimit parameter, this parameter relates to the text that will be displayed on the "Load More" button.
3. enableGA (true/false) - enable Google Analytics. When set to true, all analytics events will also be sent to the Google Analytics property already enabled on the page.
4. ctaButton (string) - add a CTA button containing the string specified underneath the product image in "Shop This Look" that links to the product page.
5. thumbOverlay (true/false) - enable the mouseover effect on thumbnails showing author details.
6. varyingThumbSizes (true/false) - images will be displayed in mosaic style (various sizes) in the Gallery widget type.
7. autoScroll (true/false) - enable auto scrolling of images in "carousel" mode.
8. submissionFormCSSURL (URL) - sets the URL of a custom CSS file to style your front-end uploader.
9. inStockOnly (true/false) - only returns photos to products that are in stock.
10. strictProducts (true/false) - returns photos related to the product specified, and fills the rest of the response with other photos from the album. Use with product_id.
11. emptyThreshold (integer) - if the number of photos related to a product does not meet the minimum threshold, the widget does not appear. Use with product_id.
12. rightsClearedOnly (true/false) - only return photos for which media rights have been granted.
13. assignedOnly (true/false) - only return photos that have products associated with them.
14. visibleProducts (integer) - configure the number of products that are shown simultaneously in the lightbox when multiple products are linked to a photo (Number between 2-6).
15. utmParams (true/object) - when set to true, all product URL’s will be appended with Google Analytics UTM parameters. This parameter also accepts an object with custom values for each UTM parameter:
(&utm_source=photoslurp&utm_medium=widget&utm_campaign=albumid&utm_content=productId).
16. postedByText (string) - custom "Posted by" text is shown when thumbOverlay is active.
17. viewAndShopText (string) - custom "View and Shop" text when thumbOverlay is active.
18. emptyText (string) - This feature will allow you to add a CTA upload button and a text that encourages your users to upload their own photos for a chance to be featured. This will prevent the carousel widget from displaying an empty space after its images when there aren't enough images to fit the page width.
Example:
emptyText: "We want to see how you wear your watch! Click to upload your own photo for a chance to be featured here."
Note: If you have any questions or need any help with the installation, contact us at support@photoslurp.com and someone from our tech team will get back to you