How to install the Arbor showcase widget on your site

The Arbor Dashboard makes it easy to measure the CO2 impact of your products and showcase these metrics on your products. To begin, ensure that you have added a product to the Arbor Dashboard - checkout our blog on how to add a product if you need help. To install the Arbor showcase widget on your site please follow the steps below.

Step 1

Start by visiting app.arbor.eco, then ensure you’re on the “Install” Tab. To begin the installation process, enter a domain in the box “Add the domains Arbor will work on.” If you would only like Arbor to work on specific pages, enter the product pages or a collection of pages. Ex. “example.com/collections/1-2-years” this will only enable Arbor on the products in the 1-2 years category. If you want Arbor to work everywhere, enter your homepage domain.

 

Group 12

Step 2 

For whichever website platform/builder you are using, you will need to paste the <script> tag below somewhere between <head> and </head> tags in the code on each page or on your entire site. It should be in the Index file of your website to display on your entire website.

For Shopify, please refer to this link (but use the Arbor scripts instead of Hotjar scripts).

 

Group 12 (1)

Step 3 
Paste the snippet from step 2 inside of the <head> and </head> tags. Your snippet will contain the API Key instead of the letters API_KEY. Save this file / publish it and then close it.

Frame 4817 (4)

Step 4

Keep your branding consistent by customizing the look of the widget. Click the colour swatches on the right-hand side to change the widget to your brand colours. 

Screen Shot 2022-10-24 at 1.27.15 PM

Step 5

Visit each product page and depending on your website platform/builder, insert this block of code below wherever you would like Arbor to show up. And you’re done!

Frame 4817 (6)

Need help? Support@arbor.eco