Introduction:
Tailoring your offer templates to suit your unique needs can greatly enhance the effectiveness of the Checkout Upsell for WooCommerce plugin. In this guide, we'll walk you through the steps to seamlessly customize these templates, ensuring they align perfectly with your business branding.
Example scenario:
Customizing the offer template of Checkout Upsell Campaign
Please make sure you have already installed and activated the WooCommerce Checkout Upsell plugin. Please note that some of the features explained here are available only in the PRO version.
Let us get started,
Customizing the offer template of Checkout Upsell Campaign :
While creating offers via Campaign types like Checkout Upsell, you can find the option “Add Offer”, and from the offer page we can find options available to customize the upsell template.
To customize,
Go to WordPress dashboard -> Checkout Upsell -> click on the button "Create new campaign"
Choose "Checkout Upsells" Campaign -> click on the button “Add offer”
Screenshot showing the section to customize Template contents:
Offer title - from this section, we can change the title of offer. For example we can change it as: {discount} Off!
Offer description - from here we can change the description of offers
Offer CTA text - change the CTA text here. For example: Grab this exclusive deal now !
Image -
Product image - this option will display the woocommerce product image you have uploaded while creating products
Custom image - using this option we can set/ choose custom image for the product/ offer.
Screenshot showing the section to customize Template styling:
From “Template styling”, you can find two options:
Template
Styles
Template - using the “Change template” button, you can find more than 5 different templates for displaying offers and from which can change template designs based on our choice.
For example screenshot showing the "Change template" option:
Styles - from custom styling click on “Enable”. Then from the available options, we can further choose font color, size and background colors of offer templates.
Screenshot showing the available options to customise the offer template:
Then, update the changes for this specific offer and save the campaign.
Screenshot of Checkout page showing the customised upsell product:
Likewise, for other type of Campaigns like Cart Upsells, Post-purchase and so on.., we can customise the offer templates using the content and styling option.
Some of the options discussed above will require Checkout Upsell PRO.
How to further customise the offer templates ?
This can be done by creating a simple override at your theme level.
NOTE : You will have to use an FTP client or the File Manager in your cPanel to carry out this change.
You can follow the below steps:
Copy template file from the following path:
/wp-content/plugins/checkout-upsell-woocommerce/templates/<TEMPLATE_GROUP>/<TEMPLATE_NAME>.php
Example: /wp-content/plugins/checkout-upsell-woocommerce/templates/offer/template-1.php
Paste to your active theme:
/wp-content/themes/<YOUR_THEME_FOLDER>/checkout-upsell-woocommerce/<TEMPLATE_GROUP>/<TEMPLATE_NAME>.php
Example: /wp-content/themes/<YOUR_THEME_FOLDER>/checkout-upsell-woocommerce/offer/template-1.php
Now, you can edit the overridden file and do customisation.
Next Steps:
You may also want to check out these helpful guides:
Still unclear?
If you need any assistance, please create a support request at our ticket system. We are always happy to assist you :)