In this part, you’ll see how to display referral codes elements in your WooCommerce pages. First, go to the following page :
WordPress Admin
Admin menu
Use this form to let customers input a referral code and get an immediate discount on their order. Here are the options available :
Accept Coupon Field
Accept referral codes input in the WooCommerce coupon field in classical cart/checkout pages
Cart Display
Select if you want to display the referral code form on the cart page. The possible values are :
- Not displayed at all
Not displayed at all
You don’t want to display the tool on the cart page
Between products and total
The tool will be visible under the products list in the cart page
Aside from totals
Display the tool next to the totals panel
Reload cart page
Force a page reload after a user inputs a referral code
Checkout Display
Select if you want to display the referral code form on the checkout page. The possible values are :
- Not displayed at all
Not displayed at all
You don’t want to display the tool on the checkout page
Top of the page
The tool will be visible above everything else
Before customer details
The tool will be visible above customer details
Before order review
The tool will be visible above the order review
Reload checkout page
Force a page reload after a user inputs a referral code
Styling tool
Use the styling tool to change the look of the referral code look
WooCommerce My Account
Set a new tab in WooCommerce’s My Account page. You can set the following options :
Enable
Turn this on to show the Referral Codes Tab on the My Account page.
Tab Title
The name of the tab.
Slug
The tab’s url to your customers. It will look like https://yourwebsite.com/my-account/the_url_slug_you_chose
Role restriction
By default, all users can see this tab if you enable it. However, you can restrict the visibility to a list of user roles by selecting them here.
Content page
Select the page in which you want to display wallet information. By default, Referral Codes creates a page but you can change it at any time.
Edit the page
Click this link to open the standard wordpress page edition where you can set your tab content.
Create a new default page
Use the “Content page” and create the default content inside it (titles and shortcodes)
You have total control over what you display on this page. You can use your standard page builder or set text content like for a regular post.