This tutorial covers how you can add galleries and cards to your website.
To learn how to change the design and layout of galleries, read this guide.
To learn how to change the design of cards, head over to this guide.
Get the embed code or ID for a Gallery or a card
Before you embed a UGC widget to your website, copy the gallery ID.
From the showcase tab, select the gallery you want to embed
Press Embed gallery
Copy the Gallery ID
Use the Gallery ID for Cevoid’s sections in the Shopify theme editor and the <div> code for all other interfaces.
Add a gallery with sections
In the Shopify theme editor,
Select the Interface, page, or blog post you want to add a gallery to
Press Add section
Under apps, click Cevoid gallery
Paste the Gallery ID in the Gallery ID field to the right
Press Save
Optional: Change, style, or remove the title and paragraph
Click Save
Check the Display as product page gallery checkbox when you add the product page gallery to your product pages.
To add a gallery to a new page like a community wall, navigate to your Shopify Admin > Online Store > Pages and then click Add Page. Then navigate back to the Theme editor and execute the Add a gallery with sections steps.
Add Cevoid’s script
This step is not needed when working with sections
Before you add Cevoid’s widgets outside of sections, you must add the following Cevoid script to your theme.
<script type="module" src="https://gallery.cevoid.com/index.js" defer></script>
In the Shopify admin panel,
Press Online Store
Click the three dots symbol (...) on the theme you want to edit
Press Edit code
Navigate to the theme.liquid file
Paste the script code before the </head> tag
Click Save
Add a card or gallery with a custom Liquid section
In the Shopify theme editor,
Click Add section
Press Custom Liquid
Paste the card/gallery <div> code in the custom liquid field to the right
Optional: add custom CSS to limit the width of the card
Click Save
Make sure you’ve added the Cevoid script before doing this. Otherwise, the card won’t be displayed correctly.