1. Home
  2. Docs
  3. Documentation
  4. Platforms
  5. Inserting the Widget into Shopify

Inserting the Widget into Shopify

In this brief tutorial we will cover how to effectively install the ArtPlacer Widgets into your Shopify website.

We recommend reading the instructions provided in the Widget Generator section of this manual before proceeding with the steps described below.

Initial Considerations

The ArtPlacer Widget can be embedded into Regular Pages or Product Pages.

This tutorial works for Shopify product pages. If you wish to embed the widget somewhere other than on a product page please read these instructions.

We will be installing the Sample Room Widget. The process for installing the Client Room Widget is quite similar.

Important

For the widget to reproduce scale properly, you’ll need to input each product’s correct measurements under the ‘variants’ option on your product page – even if you don’t have more than 1 variant of them

The order of your measurements (WxH or HxW) will be determined by you later, so make sure you input it the way you want it to be detected by the widget.

Theme Compatibility

While we we are continuously adding support for several Shopify themes, we may not support a specific Shopify theme at given moment. But don’t worry! If you experience any issues using the ArtPlacer Shopify App, let us know right away and we will add compatibility with your theme in a snap.

Let’s get started.

Download the ArtPlacer Shopify App

1. Login to your Shopify dashboard.

2. Head to the Shopify App Store. You can do this by clicking on the Apps icon at your left.

3. Search for ArtPlacer, and download the ArtPlacer App.

4. It should now look like this:

5. Step out of Shopify for a moment. In a new tab, log into your ArtPlacer Dashboard

Generate your Widget Code

1. Click on Widget, at the top.

2. Next, click on Create New Widget

3. You now need to create your widget. As mentioned before, on this tutorial we’re creating a Sample Room widget, so choose Sample Room

4. Type the name of your preferred space. You can find all offered spaces on the Library Spaces tab.

5. Choose Dynamic

6. Adjust the Settings and Style of your buttons.

7. Under the Code section, always select HTML.

8. Now, copy the code that was created for you. You’ll need it soon.

NOTE: Do not copy the script code. The ArtPlacer Shopify App will do this part for you.

Add the Widgets

1. Head back to your Shopify Dashboard.

2. Click on ArtPlacer (the blue hyperlink).

3. Click on Start Creating Widgets


4. Name your widget to easily identify the button (this will not be the button text) Set your preferred size unit. Make sure you select the one that matches the units in your website. Under Artwork,  select Dynamic. If you don’t want the active artwork to be displayed automatically in your widget (and want the user to select one from the artworks’ slider instead), select Not Specified.

5. Paste the code you’ve copied from your ArtPlacer Dashboard.

It should look something like this:

6. Choose where you’d like your widget placed, and whether you’d like to exclude the widget from a collection(s) (e.g.: If you also sell pottery, you don’t want the widget to be applied to your pottery products.)

7. Click on Save Widget.

That’s it! You’re all set.

Follow these steps whenever you need to create new widgets.

If you need further help, please contact us.

Was this article helpful to you? Yes No