In this brief tutorial we will cover how to effectively install the ArtPlacer Widgets into your WordPress (WooCommerce) website.

Initial Considerations

Before getting started 

An Advanced or Premium trial or active subscription is required in order to allow the implementation to work. If you don't have one, you can sign up for a free 7-day trial here.

If you are on the Basic plan, you can upgrade your trial or subscription plan from here.

We recommend reading the instructions provided in the Step-by-Step full guide to create your widget before proceeding with the steps described below.

This tutorial works for WordPress (WooCommerce) product pages. If you wish to embed the widget somewhere other than a product page or you don’t use WooCommerce, please read these instructions.

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


The widget will pull the units of measurement from your WooCommerce settings. Make sure you select the system of measurement you desire in WooCommerce > Settings > Products

For the widget to reproduce scale properly, you’ll need to input each product’s correct measurements under the ‘shipping’ option on your product page.
Compatible size formats can be one of the following:
WxH (e.g. 30x40) / HxW (40x30)


Download the ArtPlacer WordPress Plugin

1. Login to your WordPress dashboard.

2. Install the ArtPlacer Widget App from the WordPress plugins store, and activate it.

3. It should now look like this:

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

Generate your Widget Code

1. Click on Widget, at the bar in the top.

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

3. Adjusts the Style of the buttons (In step 2 of the Widget Generator).

4. Get your widget code using the Widget Generator. In the Step 3 of the Widget Generator make sure to choose "Artwork from your Website". 

5. Adjust the Settings and Style of your buttons.

6. Later, in the step 4 make sure you choose "Woo-Commerce". 


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

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

Add the Widgets

1. Head back to your WordPress Dashboard.

2. Click on ArtPlacer.

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 are all set.

Follow these steps whenever you need to create new widgets.

If you need further help, please contact us.