Wordpress integration and theme setup

To quickly get started integrating with WooCommerce we have developed a plugin which handles creating products in your backend for you.

Our plugin is available via the WordPress plugin directory

https://wordpress.org/plugins/sign-customiser/

You can add it to your WordPress by navigating to the plugins page via the lefthand menu and clicking "Add New Plugin".

You can then search for "Sign Customiser" and press "Install Now"

Then make sure to click "Activate" after it is done downloading.

The plugin is now installed and activated!

Next, on the page where you want your Customiser to live, add the following HTML code.

<iframe src="https://web.signcustomiser.com/embed/YOUR_CUSTOMISER_ID"></iframe>

<style>
  iframe {
    border: 0;
    width: 100%;
    height: 100vh;
  }
</style>

<script src="https://integrations.signcustomiser.com/sign-customiser-woocommerce.js"></script>

<script>
window.SpcWc.init();
</script>

Make sure to replace YOUR_CUSTOMISER_ID in the <iframe> code above with the ID of your customiser, found below within the dashboard of web.signcustomiser.com

If you are using the WordPress Gutenberg editor you will need to make sure you are pasting the above code into a "Custom HTML" block:

Make sure the content goes inside the white box to indicate that it is custom HTML:

Now if you visit the page you placed the customiser on you should be able to create a sign, hit "Add to cart" and it will create the product in your WooCommerce backend and add it to the cart!