After you've logged in to your GoHighLevel site, head to your Home/default page. You're going to want to first edit your "header", or navbar, to include the required code to connect your site with Goodshuffle Pro.
After your "Custom HTML/Javascript" element is added to your Navbar, click to open the "Code Editor"
Here, you'll paste this code:
<script type="module" src="https://unpkg.com/@goodshuffle/[email protected]/dist/gspro-wc/gspro-wc.esm.js"></script> <script nomodule="" src="https://unpkg.com/@goodshuffle/[email protected]/dist/gspro-wc/gspro-wc.js"></script> <gspro-wishlist-config data-url="https://data.goodshuffle.com/vendor/YOUR-PUBLIC-WEBSITE-KEY" ></gspro-wishlist-config>
Then, you'll replace YOUR-PUBLIC-WEBSITE-KEY with the key from your Integrations tab.
Your code box will look like this,
Now, you're ready to add items to your page!
First, highlight the area you want your items to appear, and then add another Custom Code element.
Then, highlight this code element and click "Open Code Editor". Here you can choose how you'd like your items listed. For specific code snippets, you can review this article. One option is,
<gspro-item-gallery show-categories="false" category="furniture-rentals"></gspro-item-gallery>
Which will have your items appear with a search bar and starting with Furniture, like this:
Lastly, you may want to change some colors on your GoHighLevel site. You can do so by clicking the paintbrush that says "Custom CSS"
Here, you can paste any of the code snippets we have to change your site colors.