🌐Wordpress

How to use the Mazing Script to integrate projects into Wordpress

Overview

To prepare for the WordPress script integration you first have to install a Header / Footer Code Snippet Plugin, afterwards, you can enter your Mazing Script Integration Code into this script. Please be sure to first follow the Button Integration guide, so you have a glimpse how our feature can work for you.

Step 1: Install Header/Footer Plugin to WP

At first, you have to install a plugin, that lets you input custom Header and Footer code. The header code is used to integrate the mazing tag itself, so that mazing commands are available globally in your shop, the footer command is to place the 3D/AR buttons on your product pages. In this demo case we have choosen to install WPCode, but feel free to select whichever Custom Code Plugin you prefer.

WP Code Installation page

Step 2: Navigate to the settings after plugin activation

Side Menu in wp-admin

Step 3: Insert Mazing Code into the header

Add the header code from Button Integration into the plugin and press save. IMPORTANT: don't forget the <script> </script> Tags

Header Code

Step 4: Adapt your mazing code snippet

If the header code is now enabled you can open the developer console in your WP page with F12. In the console, you can pretest your implementation by calling the globally exposed mazing() method now. And test the custom implementation you created from Button Integration.

Test your script and the placement of the 3D/AR buttons

Step 5: Integrate your final snippet into the footer

After you are happy with your custom development, integrate the script into your footer with the WPCode plugin, like you did with the header and press "Save". IMPORTANT: don't forget the <script> </script> Tags

Footer Code Implementation

Step 6: Enjoy your freshly created shop integration.