Author 诗语

How to Resolve the Error – 「Please select a Simple, Virtual and Free product」?

Do you notice an Error Message – Please select a Simple, Virtual and Free product.

Solution:

Following are the steps using which you can select the free Simple & virtual products on the optin page of the CartFlows.

Step 1: Go to CartFlows -> Flows -> Your_Flow

Step 2: Click Edit button on the Optin Step.

Step 3: Navigate to the Select the Product Tab and Search & select your free simple or Virtual product from the optin page.

In a Nutshell, to resolve this issue, you will need to select Simple & Virtual Products.

The Optin Step type only allows selling the above-mentioned type of products. This Step Type provides only three fields such as First Name, Last Name, Email ID.

So the user cannot make a payment in this scenario, this is the reason you need to set the zero price value Simple / Virtual product.

If you need to add more custom fields in the Optin Type you will need the CartFlows Pro version.

How to Style the Highlight Product Section?

We have provided some basic options to provide the flexibility and modify the design & the text that will be displayed on the frontend along with the border color, text color, and the Highlight Product section』s background section.

To find these options please follow the below steps.

Step 1: Goto CartFlows -> Flows

Step 2: Your_flow -> Click on edit button on the checkout step. 

Step 3: Goto Select Product Options Tab and enable the Enable Product Options checkbox

Step 4: Now, under the Selected Products Section, open the product options by clicking on the small arrow. Add the text as per your needs and Enable the Highlight option (4)

Step 5: Add the Highlight text as per your necessity.

Step 6: Update / Save the page.

The above steps will guide you to set up the CartFlows Product Highlight feature. Now to do more customization such as changing the color of the text, section, and the border color, you can find these settings by scrolling down the same page under the Design Setting. 

Related Articles –

How to 「Highlight Product」 in CartFlows Checkout Page?

How to Setup Square Gateway for the Cartflows Upsell & Downsell?

In the latest CartFlows Pro update i:e 1.5.10 we have added custom support of the most awaited payment gateway i:e Square Payment Gateway. 

Now, you can also offer the CartFlows upsell and downsell using Square Payment Gateway.

Let』s see how you can configure it to use it with the CartFlows.

# Pre-requisites-

Below are a few pre-requisites that are required to configure the gateway.

First, you need to login to the Square Payment Gateway』s account from here and if you haven』t created an account then you can also do it from the same page.After logging in get the Application ID from the 「My Applications」 section and the 「Access Token」 from the Account section on your Square Payment Gateway』s account.Now, download & install the Square Payment Gateway Plugin from here. If you need help on how to install the plugin here is the article which will help you.

You can read more information about the Payment gateway configuration options in this WooCommerce article.

Let』s see how to enable the Square Payment gateway for your online store/website.

Step 1: From your WordPress Dashboard, go to – WooCommerce -> Settings -> Payments Tab -> Enable the 「Square-Credit Card option and click on the Save Changes button at the bottom of the same page.

Step 2: Now go to Square Tab to configure the gateway.

Step 3: Enable the Sandbox Checkbox if you want to make the test payment & add the Application ID & Access Token. If the sandbox checkbox is not checked then you will have to enter the Live Application ID & Access Token.

Note: Your website should have an SSL configured and all the URLs should be forced to use HTTPS.

How to Change the 「Choose A variation」 text?

In some cases, there might be a need to change the Popup Variation Toggler text so that you can match it with your website theme or the product that you are selling from the Checkout or to grab the attention of the users. 

As there is no option in the backend setting to change this text it does not mean that you cannot change it. You can!!. But using the filter that we have provided.

It is very simple to change the text using the filter you just need to copy-paste the code into your child theme』s functions.php file and change the text as per your requirement.

add_filter( 'cartflows_variation_popup_toggle_text', 'change_variation_toggle_text', 10, 1 );

/**
* Change Choose a variation text.
*
* @return text.
*/
function change_variation_toggle_text( $text ) {

return "Add your choice of text here";
}

Note: Add the above filter to your child theme』s functions.php, here』s an article to help you Add Custom code.

Introducing the 「Separate Orders」 Feature in CartFlows?

In the latest release of the CartFlows free version and the CartFlows Pro v1.5.5 and above, we have released a new feature known as 「CartFlows Separate Orders」.

This feature will allow you to create Separate Orders for each Upsell & Downsell product purchases.

Previously, in the CartFlows, all the products which are purchased from the Checkout page, Upsell & Downsell pages are getting added in the one single order of WooCommerce. In that case, the main order's order status gets set to MainOrderAccepted.

Now, we have introduced a new option as 「Create a New Child Order」. This option will create an separate orders for each of the pages which are checkout, upsell & downsell.

This option is added in the new menu located under the CartFlows menu –

Step 1: Visit CartFlows -> Global [New Menu-option] requires CartFlows Pro v1.5.5 and above.

Step 2: In this setting there are two options and they are as follows –

Add to the main order: This option will merge all accepted Upsell / Downsell offers into the main order. As it was the default working of the CartFlows.Create a new child order: This option creates a new order for all accepted Upsell / Downsell offers. The main order (product purchased from the checkout page)  which has been placed from the checkout page will be parent order for all the orders placed from the Upsell & Downsell.

This new option to create a child order will create a separate order for checkout page, upsell and downsell which will be displayed in the WooCommerce -> Orders.

This feature will help store owners in various ways. Such as it will become easy to refund the Main Product & the Offer Product. As you can decide whether to create Separate Orders for the upsell & Downsell products.

This will also help solve the problem of the order generation email not getting sent due to the order status not getting changed to complete. Which was getting set as MainOrderAccepted if the user leaves the checkout process on the Upsell & Downsell page by closing the browser window.

If you are selling the course products from the Upsell & Downsell pages then this will also give you access to the course products as soon as the product is purchased as the order will be placed separately and the order status will be changed to complete/processing.

If the new order is created for the Upsell & Downsell then WooCommerce will automatically send the order related notification emails to the users as soon as the products are purchased.

These are some of the cases that will be automatically solved and there are others too which depends on the situation and the case of the checkout process.

Which Multi-Currency Plugin does CartFlows Support?

CartFlows supports the official WooCommerce Multi-currency plugin.

In this article, we will see how to set-up the WooCommerce Multi-Currency plugin. And also on how to add the dropdown option to convert the currency based on the user』s choice. 

So we will be using the WooCommerce Multi-Currency plugin to add multiple currencies and currency switcher on the CartFlows Checkout page.

You can download the plugin from the official website of WooCommerce from here.

Now, it』s time to set up the plugin for your needs and requirements.

Tutorial: You can follow this in-depth and easy steps guide provided by WooCommerce.

This multi-currency plugin provides a set of shortcodes to display the currency switcher option on any page of your website. You can add this multi-currency shortcode on the Landing & Checkout page of the CartFlows.

If you want to include the same shortcode in the CartFlows shortcode then it is not possible because both the shortcodes are different.

While using this shortcode, you may get certain requirements such as – you may want to or you may have included the multi-currency shortcode in the footer or header or even in the sidebar widget.

So, in that case, the multi-currency shortcode will not be displayed. 

The reason behind this is – CartFlows by default does not load any widget and theme's Header & Footer on its pages. If you want to display it in the header or footer or in the sidebar widgets then you need to change the page template to 「Default」 and this article will help you with it.

Elementor Widgets of CartFlows

We are pleased to announce that we have successfully released Elementor widgets in the CartFlows 1.5.18 & CartFlows Pro』s 1.5.10 versions. These widgets will provide more styling options for the shortcode and increase the flexibility to design the CartFlows pages.

These widgets are being introduced by CartFlows and not the Elementor to bring a whole new experience. For which we have divided them into two parts CartFlows free and the CartFlows Pro widgets.

In the CartFlows, you will get widgets for all the shortcodes that are available in the free as well as Pro version and they are as follows

Next Step Button/Link WidgetOptin Form WidgetCheckout Form WidgetUpsell & Downsell Shortcodes including Product variations and offer accept & reject Widget.Order Review Widget ( Thank you page).

These widgets will be displayed only on their respective pages. That means when you open/edit the landing page in the elementor editor then you will see the Next Step Button/Link widget. Similarly for the rest of the steps/pages.

Let』s see, respective widget's page/step wise and how it's setting can be managed –

Page 1: Landing page and it』s widget

This Page has one widget and that is the Next Step widget.

# Settings in Content Tab: Here you will get the settings to change/add/update/delete the string on the next-step button and you can add the icon as well. 

# Setting in Style Tab: There are two tabs one is General & Content in which you will get all the designing options to design the button/link.

# Setting in Advanced Tab: In this section, you will get all the designing options of the section on which the model is displayed.

Page 2: Optin Page and it』s widgets

This Page has one widget and that is the Optin form widget. Do make sure your product is Simple, Virtual, and Downloadable to use the Optin form.

# Setting in Content Tab: In this section you will get the text and width setting of the optin fields.

# Setting in Style Tab: In this section you will get the styling options for the form text, field texts and the button texts.

# Setting in Advanced Tab: In this section you will get all the designing option of the section on which the model is displayed.

Page 3: Checkout Page & it』s widgets

This page also has one widget and various design options for various features. Such as Bump Order, Pre-check Offer.

# Setting in Content Tab: Here in this tab you will get the content setting for Billing & shipping Fields, Bump & pre checkout offer and product options.

# Setting in Style Tab: Here in this section, you can change the design of the checkout page features as mentioned above.

# Setting in Advanced Tab: In this section, you will get all the designing option of the section on which the model is displayed.

Page 4 & 5: Upsell & Downsell pages

As you all know, these pages support variation products as well. That means you can display and sell the variation products from the upsell & downsell pages. By default there are several shortcodes that are available in the backend setting of these pages similarly for the same, we have introduced an elementor widget for it. 

# Setting in Style Tab: There are separate styling options for each of the widgets. These widgets are as follows –

Offer Yes/No Button: To display the offer accept or reject button.Offer Yes/No Link: To display the offer accept or reject links.Offer Product Title: Displays the offer product title and dynamically displayed.Offer Product Price: Displays the offered product price and dynamically displayed.Offer Product Description: To display the product』s description and dynamically displayed.Offer Product variation : To display the variation of the product if it is available )Offer Product Quantity field : To give option to the user to select the quantity of offered product.

# Setting in Advanced Tab: In this section you will get all the designing option of the section on which the model is displayed.

Page 6: Thank You Page & it』s widget

Using this widget you can design setting as well as you can enable/disable the sections which are displayed in the thank you page order review form

# Setting in the Style Tab: This tab has all the required styling options to change the look and feel as well as the overall appearance of the order review form.

# Setting in Advanced Tab: In this section you will get all the designing option of the section on which the model is displayed.

All of the widgets and settings are provided to provide more flexibility while designing the CartFlows pages and to avoid the confusion regarding which shortcode needs to be added and on which page it has to be added. 

If you are not using the Elementor Page Builder, and want to use it in the default way i:e using the shortcode then this article will help you to understand the right places of the shortcodes.

Happy Designing!!

How to Display the 「Account Creation Fields」 on CartFlows Checkout Page?

It is a nice idea to let the user register him from the Checkout Page at the same time during the process of purchasing the products.

Allowing the user to register and create an account right from the Checkout Page gives flexibility and reduces the user's efforts to create the account separately.

So, to accept the User's username & password from the Checkout Page, WooCommerce adds the two extra account fields depending on the setting that you have made in the WooCommerce -> Settings -> Account & Privacy Tab -> Account Creation Section.

There are various options using which you can manage the display of the account creation fields.

WooCommerce has an easy to understand and in-depth documentation for those setting which can be found in this article. [ Link here ]

Also here is a video which will give you the step-by-step visual guide:

How to Turn Off the Auto-fill of Address Fields on Entering Zip-Code?

You might be wondering why your Country, State & City fields are getting automatically filled with the proper data when you enter the zip code on your checkout page. Well, it』s not magic, it』s a feature. 

We have integrated the 「Zippopotam」 library API in the CartFlows which automatically search for the Country, State & City associated with the zip code that you have just entered on the checkout page. 

If the data is found for respective ZIP code then it will be fetched and auto-filled on the checkout page of the CartFlows automatically. 

There might be some cases where you might want to disable this feature and for that, we have provided the following WordPress Filter –

/**
* Filter to enable/disable the address auto-fill using the zip code.
*
* @param string $allow having yes/no
* @return string $allow yes or no
*/

add_filter( 'cartflows_autocomplete_zip_data', 'wa_disable_autocomplete_zipcode', 10, 1 );

function wa_disable_autocomplete_zipcode( $allow ) {
$allow = 'no';
return $allow;
}

Note: Add the above filter to your child theme』s functions.php, here』s an article to help you Add Custom code.

How to Refresh / Flush WordPress Permalinks?

Whenever a new Custom Post is added through a plugin or code; usually WordPress permalinks needs to be flushed.

Step 1: In the WordPress admin area, go to 「Settings > Permalinks」Step 2: Click 「Save Changes」Step 3: Permalinks and rewrite rules are flushed.