Follow These Steps:
Important note!
In order to integrate with Wordpress WooCommerce, UPCs must be on each of your product pages. The default version of WooCommerce does not support GTIN (UPC, EAN) product numbers out of the box. If you have not already done so, please install a plugin like Product GTIN (EAN, UPC, ISBN) for WooCommerce and add UPCs to all products and variants.
Install Plugin & Add UPCs
- Go to: Dashboard > Plugins > Add New
- Search for Product GTIN (EAN, UPC, ISBN)
- Activate the Plugin.
- Now when you add a product, you will see a field for UPC like the one below.
- Ensure all products have a UPC before proceeding.
Embed the Product Locator Code
For embedding the code, you will need to be familiar with editing template pages in Wordpress or you can try a plugin, like Elementor. Elementor allows you to edit your PDP layout without coding skills needed. To edit a PDP and add the Embed code with Elementor, go to any product page, and then click Edit with Elementor at the top of the screen. Select Elementor Single Product.
This will open up options to select different blocks to add to your product page. We want to select HTML and place a block for HTML where we would like to see the product locator.
Once you drag the block where you would like for it to be, you can add content to the HTML block. This is where you will paste your Product Locator embed code. Click update.
Now when you go to the product page, you will see the embedded Product Locator Wizard.
Important Note: Completing Installation
To ensure installation is complete, you need to change one parameter in the code per PDP. The UPC (or Style) parameter will need to be changed per PDP so you will need to write a script to call the UPC into the code.
The WooCommerce plugin uses the following post meta keys:
hwp_product_gtin, and hwp_var_gtin
Need Support or Further Guidance?
For specific questions, feel free to reach out to your Implementation Manager for further support.