This article explains how to use app embed advanced settings to integrate your customizers into your online store. This is mostly used when the standard integration is not working properly, or when you need more flexibility or a custom configuration.
Customizer Only integration
Scroll down into the app embed block of Kickflip until the “product advanced settings” section.
Toggle on the “use advanced mode” option (Be sure to be inside your desired product template. By default, Kickflip is using the “Default product” template without disturbing your non-customizable products).
If you are currently using the Shopify selector a message will appear at the bottom center of your screen indicating that you must turn off the Shopify selector.
The button to turn it off looks like this.
Now turn on the Kickflip helper by clicking on the blue button at the bottom of your screen. It should look like this :
With the helper now toggled on, hover the section where you want the customizer to appear (you should see a blue box overlay).
Click on the section.
You should see a notification telling you that the selector has been copied. If you don't see it you can select the selector in the helper and press ctrl + c (cmd + c on Mac).
Paste this selector in the Add customizer only selector text field in the App Embed settings. You should now see the customizer appear.
If you wish to hide any elements inside the page, please repeat steps 6 to 9. However, you will need to place any elements copied by the Kickflip blue helper inside the “Hide element selectors”.
Click on Stop.
Click on Save in the top right corner.
Customize Button integration
Scroll down into the app embed block of Kickflip until the “product advanced settings” section.
Toggle on the “use advanced mode” option (be sure to be inside your desired product template. By default, Kickflip is using the “Default product” template without disturbing your non-customizable products).
If you are currently using the Shopify selector a message will appear at the bottom center of your screen indicating that you must turn off the Shopify selector.
The button to turn it off looks like this.
Now turn on the Kickflip helper by clicking on the blue button at the bottom of your screen. It should look like this :
Hover the button you want to replace with the 'customize button'.
Click on the button.
You should see a notification telling you that the selector has been copied. If you don't see it you can select the selector in the helper and press ctrl + c (cmd + c on Mac).
Paste this selector in the Replace add to cart button selector text field in the App Embed settings. You should now see the button appear.
If you wish to hide any elements inside the page, please repeat steps 6 to 9. However, you will need to place any elements copied by the Kickflip blue helper inside the “Hide element selectors”.
Click on Stop.
Click on Save in the top right corner.