MoreConvert Documentation

How to Add Wishlist Button in WooCommerce Custom Product Options?

You might be wondering what makes your product pages so excellent. Extra custom choices, such as a pricing calculator, are undoubtedly a solution. But what could be better? To add a wishlist button in WooCommerce custom product options! These possibilities on a single product page will more easily attract clients than you believe. We’ll go through the UNI CPO plugin, which is the ideal connection for MC wishlist (to Add Wishlist button in WooCommerce) for having WooCommerce custom product choices.    

Use Add to Wishlist Button in  WooCommerce Custom Product Options #

Whether you own a small clothing store or a big tech business, you need to add extra options to your product pages. WooCommerce custom product options become handy in two ways:
  • Minimizing the need for support and answering every customer
  • Improving the user experience and engaging visitor to make purchase
  For your information, you can add a wishlist button in the WooCommerce product page using MC WooCommerce wishlist plugin. But you need a WooCommerce custom product options plugin for having extra product options.  The best plugin to achieve this goal is Uni CPO WooCommerce Options. This plugin has a friendly workspace, and It’s easy to use. I will review the options you can set in this plugin.  

Basic Modules #

Uni CPO Basic Modules settings   All the options that we review will include the parts that you can see in the image below. Uni CPO move, duplicate, and delete sections   The most useful section is the settings, which is divided into three parts.
  • General: General settings that are different for each field
  • Style: Appearance settings including color, font, size, etc.
  • Advanced: Margins and paddings setting 
 

1 – Row:

To add any option, you must first drop a line into the box (plug-in box on the product page).

2 – Column:

After adding a row, you must use the column. Notice that a column is created along with creating a row. To change the width of each column, go to the settings section of the same column.

3 – Paragraph:

Using this option, you can create your desired paragraph and change its text through the settings section. Uni CPO Paragraph settings  

4 – Button:

You can create more buttons for your product page. Just create a column and drop the button field into the column and set its URL through the general settings. Uni CPO Button settings  

5- Image:

You can add any photo you want to your product page by creating a column and dropping the image from into the column. Uni CPO Image settings    

Options #

Uni CPO Options settings   The settings in this section are different from the previous one. The options you see here are related to the type of field as follows:
  • General: General settings that are different for each field
  • Style: appearance settings including color, font, size, etc.
  • Advanced: setting margins and paddings
  • Main: related to slug field settings, making the field necessary, field cost, activating the tooltip, etc.
  • Secondary options: creating options for fields such as select boxes, check boxes, etc.
  • Rule: control rules (in some fields)
  • Condition: Create a condition for using the field
  • Validation: Changing the text of errors, for example, the error of the required field being empty
 

1 – Input:

You can create and customize your input field in this section. It can be created in three modes (string, number, decimal) which you can choose from the main settings section. Uni CPO Input settings  

2 – Text area:

You can use this option to create a field to receive text from the user.

3 – Select Box:

You can add your own select box for your product page. Notice that you can assign a different price to each of the select box options through the settings of the secondary options. Uni CPO Select box settings  

4 – Radio inputs:

You can create your own radio input type. For this field, you can also define a different cost for each option like the select box. Uni CPO Radio settings  

5 – Checkbox input:

For this field, you can define a different cost for each option like the previous two fields. Their main difference is that the user can choose several options in this section. Uni CPO Input checkbox settings  

6 – Date Picker:

With this field, you can provide the user with the possibility to choose a date. This field has three types for choosing a date (single date – date range – choosing several dates together). You can also activate Timepicker from the main settings section. Uni CPO Date picker settings  

Product price calculation formula #

According to the fields you use, if your field changes the price of the product, you must also set the calculation formula. To set the formula, go to CPO builder > Formula and conditional logic section. Uni CPO price calculation settings    

Uni CPO integration with MC Wishlist #

We saw that it is easy to add a wishlist button in WooCommerce custom product options. At first, using the MC WooCommerce Wishlist Plugin, we add the add to wishlist button to the single product page and make the settings for the button. Then, using the Uni CPO WooCommerce Options plugin, we create a row and add the required number of columns and add all the additional fields we need for the product page. Then we make the corresponding settings for each field and finally set the mathematical formula to calculate the price. As we can see in the picture, all the fields work with the wish list without any problems and are added to the wish list page. Uni CPO integration with MC wishlist   These two reviewed plugins work well with each other and solve all our needs together. On the other hand, their coordination increases the beauty of the product page and attracts the user with custom options. Considering all the mentioned issues, using these two plugins together is the most complete way to add additional fields to a single product page.  
What are your feelings?
Updated on March 25, 2023