EqualServing

WooCommerce, ActiveCampaign, 1ShoppingCart, Infusionsoft Expertise.

You are here: Home / Archives for How To

Step By Step Tutorials and How Tos

Here you will find step-by-step tutorials about integrating plugins, APIs, and/or services into your website to provide a more robust experiences for your visitors.

How To: Configure Our WooCommerce ActiveCampaign Plugin

by Leave a Comment

Before we begin to configure our WooCommerce ActiveCampaign plugin, please know ActiveCampaign has four (4) subscription levels – Lite, Plus, Professional and Enterprise. The Plus, Professional and Enterprise subscriptions offer Deep Data Integration that works with WooCommerce and other popular eCommerce solutions to synchronize online sales with the ActiveCampaign CRM. This integration collects your contact’s sales history which can trigger automations and/or subscribe contacts to lists depending upon the value of the sale or the contents of the order.

The Deep Data Integration and site tracking that is offered with the ActiveCampaign premium subscriptions enable you to track abandoned carts. Cart abandonment rates are almost 75% according to a recent study. Therefore, your sales conversion rates may improve by subscribing to a premium level of ActiveCampaign.

For those using the Lite subscription, we have an alternative way to track your customer purchases. We built our plugin before ActiveCampaign built their Deep Data Integration and it still serves a great many businesses.

Time needed: 20 minutes.

Follow these steps to configure the WooCommerce ActiveCampaign Plugin by EqualServing to get your plugin setup and ready.

  1. Visit ‘Plugins > Add New’

    From your WordPress administration, mouse over Plugin and select Add New from the pop-out menu.

  2. Search for ‘WooCommerce ActiveCampaign’

    In the keyword search box, enter the keywords ‘activecampaign woocommerce‘ and select the plugin authored by EqualServing.

  3. Activate the plugin

    Activate the WooCommerce ActiveCampaign plugin from your Plugins page.

  4. Establish WooCommerce Integration

    Mouse over the WooCommerce menu item and select Settings from the pop-out menu.WooCommerce ActiveCampaign settings integration page

  5. Click on the Integration tab.

    The ActiveCampaign configuration panel should display. If other integrations are available, just make sure you select the link labeled ‘ActiveCampaign.’

  6. Enable the plugin and enter the necessary API information.

    Press the Save changes button to continue with the rest of the configuration.

  7. Select the Subscribe event.

    WooCommerce has various order statuses to denote the stage in the order processing. The statuses are – Pending payment, Failed, Processing, Completed, On-Hold, Cancelled, Refunded. For more information, please see the WooCommerce docs. Of these statuses, our plugin can subscribe your customer at one of three statuses – Order Created, Order Processing, or Order Completed.

  8. Select the Main List you want your customers subscribed to.

    This dropdown list will be populated with all the List names you have created in ActiveCampaign. Select the List you want your customers subscribed to for future correspondence. If you don’t see a list you created, click the link to reset the list and a call will be made to ActiveCampaign to refresh the list.

  9. Apply a specific tag to your customers.

    This dropdown list will be populated with every tag you have created in ActiveCampaign. If you want a particular tag applied to your customer, you can select it from this list.

  10. Select Display Opt-In Field

    Visible, checked by default – customers will be presented with an “Opt-in” checkbox during checkout which will be checked by default but the contact will only be added to the Main List above if the checkbox remains checked during the checkout process.
    Visible, unchecked by default – customers will be presented with an “Opt-in” checkbox during checkout which will not be checked by default but the contact will only be added to the Main List above if they opt-in.
    Hidden, checked by default – customers will not see an “opt-in” checkbox during checkout and all customers will be added to the List selected in the Main List option.

  11. Enter an Opt-In Field Label

    Here you can enter the text you would like to see displayed next to the opt-in checkbox visible from the above step. WooCommerce ActiveCampaign display label

  12. Do you want the Opt-In Field Positioned Above Order Notes?

    By default, the Opt-In Field will appear below the Order Notes. If you would like the Opt-In Field to appear above the Order Notes, please check this box.

  13. Tag Products Purchased

    If you enable this option, all customers added to ActiveCampaign via a purchase through Woocommerce will be tagged with the WooCommerce product id. WooCommerce ActiveCampaign contact tags and lists

  14. Enter a Purchased Product Tag Prefix

    If Tag Products Purchased is enabled, customers added to ActiveCampaign via a purchase through WooCommerce will be tagged with this prefix followed by the product id of the product purchased. If multiple products are purchased, you will see this text followed by the product id for each and every product purchased.

  15. Enter any Purchased Product Additional Tags

    If Tag Products Purchased is enabled, customers added to ActiveCampaign via WooCommerce can be tagged with additional information.
    For example:
    + To tag your customers with the product SKU of all the products they buy, just enter #SKU# in this field.
    + To tag customers with the product category, enter #CAT#.
    + To tag customers with both the product SKU and product category, enter “#SKU#, #CAT#“. Please note the comma between the two placeholders. This will generate two separate tags. If the comma is omitted, one tag will be applied with the SKU and category name in it. If this field is left blank, NO tag will be applied.

If you have any problems configuring the plugin, please feel free to submit a ticket with our helpdesk at https://www.equalserving.com/support.

Sales Cadence ActiveCampaign Automation

by Leave a Comment

I have been using ActiveCampaign for a few years and I am pleased with the functionality and the appealing price point. Recently, I was asked if a sales cadence contact flow recommended on the HubSpot blog could be implemented in ActiveCampaign. I reviewed the flow of activities and I was convinced that this was certainly do-able. I’ll admit it, I do love a challenge and I set out to create a Sales Cadence ActiveCampaign Automation using the HubSpot article as my guide.

The ActiveCampaign automation that I came up with requires 10 tags. The whole goal of the automation is to have the contact respond to an email. Once they respond, the automation is ended and they are sent to a separate automation.

I created an email template for the automation. It includes one paragraph with links that allow the contact to, either stop the email sequence completely, or stop the email sequence, but move them to a Remind Me Later About Your Services automation. This latter automation will email contacts when there are special events coming up.

Part 1 – Start Sales Cadence Automation

sales cadence activecampaign automation - part 1

Tagging a contact with the tag Sales Cadence: Begin, will trigger the automation. The first 2 steps create a deal for the contact and an Email task in the deal. The automation waits for the email to be created and sent. A secondary automation is triggered when the Email task is complete that tags the contact with the tag Sales Cadence: Intro Email Sent. Once the contact is tagged with this tag, they proceed to the next step.

Part 2 – Prepared Emails in Sales Candence Automation

sales cadence automation - part 2

These steps are self explanatory. The contact waits two (2) days and at 10am the contact’s timezone, we send the second email and then two (2) days later the third email is sent out.

Part 3 – Warm Call

sales cadence - part 3

Here the contact waits two (2) more days before being sent one more short and sweet email. If still no reply from the contact, we schedule a call to take place two days later. Once the call is marked complete, the contact waits another two (2) day period before another prepared email is sent out from the automation.

activecampaign automation - sales cadence

According to Carlos A. Monteiro, the gentleman who authored this process, this is a good time to send a second very personal email with an article or photos or some other link that is appropriate to win over the sale. This personal email will target a need the contact may have discussed on their blog or in their social media feed that you discovered while following them over the course of this sales process.

After the Article/Link/Photo Email is sent, we schedule another call to be added to the deal to take place in two (2) days.

Part 4 – Last Chance For The Win

activecampaign email marketing automation

We wait two (2) more days and send the last pre-authored email from the automation. Here the contact will wait for an additional ten (10) days in our hopes they respond to any of the previous emails. If they don’t respond, they are tagged as lost, the deal is marked as lost and the deal is moved to the lost stage of the Sales Cadence pipeline.

Part 5 – Goal Achieved Sales Cadence Automation

sales cadence email marketing automation activecampaign - part 6

This very last part of the automation directs the actions taken on those contacts that achieve the goal we set – Contact Replied to Email.

If at any time during this automation the contact responds to an email, the contact has achieved the goal and is immediately moved to this section of the automation bypassing all other steps.

Here the contact is tagged with the tag Sales Cadence: Has Replied, the deal is moved to the To Contact stage in the pipeline and the deal status is marked as Won.

In our example, the contact is added to the next automation where we schedule an appointment to review their requirements. However, your process may add the contact to a nurture series or suspend all automations while you work through the order process. The next stage depends completely upon your sales processes and procedures.

I was pleased that I was able to meet the challenge and create the Hubspot recommended Sales Cadence using ActiveCampaign Automation. I was also happy that ActiveCampaign has the flexibility and functionality to meet the needs of a mixed channel sales process.

Abandoned Cart Reminder With WooCommerce and ActiveCampaign

by Leave a Comment

In this article I will discuss how you can create an Abandoned Cart Reminder process for your WordPress site using WooCommerce and ActiveCampaign to boost sales and encourage customer engagement.

Amazon uses this process all the time. Perhaps you have received one of those Amazon reminder emails saying you’ve added items to your cart and here’s the link to complete your purchase. They look something like this –

Customer Name,
Thank you for visiting Amazon.com. You recently added items to your Shopping Cart. If you haven’t already purchased or removed them, simply visit your Shopping Cart to complete your order.

What you need to create an Abandoned Cart Reminder process with WooCommerce

1. First and foremost, this process requires ActiveCampaign. If you are not using ActiveCampaign, you can click on this link to learn more about this email marketing and automation tool.

2. This process requires that the ActiveCampaign site tracking script be running on your website. The easiest way to add the tracking script to your website is to download and install the ActiveCampaign WordPress plugin from the WordPress repository.

Explanation of the Abandoned Cart Reminder Process

The process steps

The steps of an Abandoned Cart Reminder process are simple and straight forward:

1. Send an email to contacts with link to site, product or shop.
This step is important. When the ActiveCampaign WordPress plugin is installed and activated on your site, you can track a contact’s travels around your site. When you send an email to a contact that contains a link to your site, that link is coded with the contact’s information so that the contact’s activity on your site can be properly tracked. All your contact’s page visits are then recorded in ActiveCampaign. Please note: Activity can only be tracked of known contacts.
2. Contact adds a product to the shopping cart and visits the WooCommerce Cart page (/cart/); contact tagged with [cart created].
The tracking script detects that the contact has visited /cart/ which will trigger an automation that tags the contact with the tag [cart created].
3a. Contact proceeds to the checkout page (/checkout/order-received/*) and completes the product purchase; remove [cart created] tag.
If the contact makes a purchase, we can remove the [cart created] tag. Since the contact made a purchase, we don’t want to send them a reminder to check their cart.
3b. Contact leaves site – abandons the product in the cart.
The contact gets distracted and leaves your site without making a purchase, the contact remains tagged with [cart created].
4. Wait specified amount of time; if contact still has tag [cart created], send the email reminder.
Setting the wait time interval is up to you. The time period can be as short as an hour or as long as 24 hours. It is entirely up to you. Once the time has elapsed, the automation will send a reminder email to the contact.

The ActiveCampaign Automations

Using ActiveCampaign, the process requires two automations. Each automation begins when a contact visits a page on your site.

The first automation, Part 1, is needed to identify the contacts that add a product to their shopping cart. Any contact that adds a product to their shopping cart and visits [YourWebsite]/cart/ gets tagged with [cart created].

The second automation, Part 2, removes the tag [cart created] if a purchase is made when the contact visits [YourWebsite]/checkout/order-received/*. Notice the asterisk in the URL. This is important. When a purchase is made in WooCommerce the contact or customer is redirected to a page with an address like [YourWebsite]/checkout/order-received/[Order Number]/?key=wc_order_9999aa99a9999. For our purposes, we don’t need to know what comes after/order-received/. So, we use a wildcard (*) to accept anything.

What the Abandoned Cart Reminder Process Looks Like

The first diagram on the left below illustrates the process flow, including the campaign that triggers the initial email addressed to your contact, the interactions your contact has with your website and the logic of the two necessary automations. It may seem complicated but once you understand the steps it is quite simple. Click on the image to see the full size image.

The second and third diagrams are screenshots of the ActiveCampaign automations. These will serve as guides for you while creating your automation within your account.

ActiveCampaign Abandoned Cart Reminder Process Flow
ActiveCampaign Abandoned Cart Reminder Process Flow
abandoned cart reminder automation part 1
ActiveCampaign – Abandoned Cart Reminder Automation Part 1
abandoned cart reminder automation part 2
ActiveCampaign – Abandoned Cart Reminder Automation Part 2

Let’s Create the Abandoned Cart Reminder Process

Step 1: Open ActiveCampaign and create a new Automation.
Step 2: Select Start From Scratch automation and name it Part 1 – Abandoned Cart Reminder.
Step 3: Add New Start of Web Page is Visited
Abandoned Cart Reminder - Add New Start of Web Page is Visited - WooCommerce Cart
In the Action Options section, enter the website domain and the path to your WooCommerce cart usually /cart/.
Check the Segment the contacts entering this automation. Select Not currently in automation and select this automation that you are working on Part 1 – Abandoned Cart Reminder. Use the screenshot as a guide.
Step 4: Add a Tag
Abandoned Cart Reminder - ActiveCampaign add a tag
Click the plus sign to add a new action. Click on Contacts in the left column and then click on Add tag. On the next popup, Enter a tag to add, enter [cart created] without the brackets. Use the screenshot as a guide.
Step 5: Wait a Period of Time
 
Click the plus sign to add a new action. Select Conditions and Workflow from the left column and choose Wait. Select For a specified period of time and then enter the time period you want to wait. Tip: While testing, you might want to use just a few minutes (10 or 15 minutes).
Step 6: Send email
Abandoned Cart Reminder - ActiveCampaign Add Action Email
Click the plus sign to add a new action. Select Sending Options from the left column and choose Send email. If you already have the email created, select it from the list. Otherwise, you may see a popup that states –
Send email
You don’t have any emails to send. You can create an email to get started.
Click on the “create an email” to create the email that you would like to send to your returning customer. Use the screenshot as a guide.
Step 7: End this automation
 
Click the plus sign to add a new action. Select Conditions and Workflow from the left column and choose End this automation.
Step 8: Create a new Automation.
Step 9: Select Start From Scratch automation and name it Part 2 – Abandoned Cart Reminder.
Step 10: Add New Start of Web Page is Visited
Abandoned Cart Reminder - Add New Start of Web Page is Visited - WooCommerce Checkout
In the Action Options section, enter the website domain and the path to your WooCommerce cart usually “/checkout/order-received/*” Please ensure that you enter the asterisk in the URL as shown here.
Use the screenshot as a guide.
Step 11: Remove a Tag
Abandoned Cart Reminder - Remove tag cart created
Click the plus sign to add a new action. Click on Contacts in the left column and then click on Remove tag. On the next popup, Enter a tag to remove, enter [cart created] without the brackets. Use the screenshot as a guide.
Step 12: End other automation
 
Click the plus sign to add a new action. Select Conditions and Workflow from the left column and choose End other automation and select “Part 1 – Abandoned Cart Reminder” to remove the contact from Part 1. This step is necessary since the contact made a purchase there is no need to keep them queued in the automation to send the reminder email. Tip: While testing, you might want to use just a few minutes (10 or 15 minutes).
Step 13: End this automation
 
Click the plus sign to add a new action. Select Conditions and Workflow from the left column and choose End this automation.
Step 14: Create an eMail Campaign With A Link to Your Shop
 
Create an email campaign that includes a link to your new product or service or just a link to your site.

I hope this article helped explain how you can add an Abandoned Cart Reminder to your business process using ActiveCampaign and WooCommerce.

Using Simple Social Icons with W3 Total Cache

by Leave a Comment

In a previous post, W3 Total Cache Garbled My Simple Social Icons, I explained how to prevent your icons from being garbled by adding the Simple Social Icons style sheet to the list of style sheets that never get minified.

Simple social icon problem with W3 Total Cache CDN This image on the left is the result after upgrading the Simple Social Icons plugin to the latest version. This issue was caused because Simple Social Icons now uses scalable vector graphics (SVGs) instead of web fonts for better accessibility and legibility and the W3 Total Cache plugin did not upload the new SVG files to my CDN. No worries, it can be done manually.

To correct the problem so that the Simple Social Icons render correctly with W3 Total Cache follow these steps:

  1. Login to your WordPress Admin panel.
  2. Mouse over the Performance menu item and select CDN.
  3. W3 Total Cache CDN Purge button Look for the Purge button as pictured to the left and tap/click it.
  4. Enter the path and object names for all the SVG files associated with the Simple Social Icons plugin. You can see my list below.
  5. Press the Purge button. The files on your CDN will be deleted and refreshed with the files from your server.
  6. Refresh the page and you should see the icons rendered properly.

Simple Social Icons rendered properly after W3 Total Cache CDN purged.

 

wp-content/plugins/simple-social-icons/icons/SVG/behance.svg
wp-content/plugins/simple-social-icons/icons/SVG/bloglovin.svg
wp-content/plugins/simple-social-icons/icons/SVG/dribbble.svg
wp-content/plugins/simple-social-icons/icons/SVG/email.svg
wp-content/plugins/simple-social-icons/icons/SVG/facebook.svg
wp-content/plugins/simple-social-icons/icons/SVG/flickr.svg
wp-content/plugins/simple-social-icons/icons/SVG/github.svg
wp-content/plugins/simple-social-icons/icons/SVG/gplus.svg
wp-content/plugins/simple-social-icons/icons/SVG/instagram.svg
wp-content/plugins/simple-social-icons/icons/SVG/linkedin.svg
wp-content/plugins/simple-social-icons/icons/SVG/medium.svg
wp-content/plugins/simple-social-icons/icons/SVG/periscope.svg
wp-content/plugins/simple-social-icons/icons/SVG/phone.svg
wp-content/plugins/simple-social-icons/icons/SVG/pinterest.svg
wp-content/plugins/simple-social-icons/icons/SVG/rss.svg
wp-content/plugins/simple-social-icons/icons/SVG/snapchat.svg
wp-content/plugins/simple-social-icons/icons/SVG/stumbleupon.svg
wp-content/plugins/simple-social-icons/icons/SVG/tumblr.svg
wp-content/plugins/simple-social-icons/icons/SVG/twitter.svg
wp-content/plugins/simple-social-icons/icons/SVG/vimeo.svg
wp-content/plugins/simple-social-icons/icons/SVG/xing.svg
wp-content/plugins/simple-social-icons/icons/SVG/youtube.svg

Infusionsoft: Redirecting After Submitting Web Form Version 2

by Leave a Comment

I was asked today how could I route users to different pages using the value of a dropdown list and thought my original version of the routing function would work perfectly but it did not. It required a little tweaking but here you go…

Infusionsoft Web Form

For my example, I created another simple Web Form at https://fr381.infusionsoft.com/app/form/interests1. I set the Thank You page for this form as a Web Address -> http://clients.equalserving.com/loreen/infusionsoft-router-v2/

Shortcode Verion 2

Version 2 of the shortcode –

[esifs_router_v1 field_name="inf_custom_BlogInterests" pages = '{"Digital Downloads":"https://www.equalserving.com/category/digital-downloads/","Infusionsoft":"https://www.equalserving.com/category/infusionsoft/","How Tos":"https://www.equalserving.com/category/how-to/"}']

Where the field_name (inf_custom_BlogInterests) that I want to interrogate is named and the values of the choices (Digital Downloads, Infusionsoft, How Tos) and the pages I want visitors redirected to follow in the variable pages.

SelectRedirect to Page
Digital Downloadshttps://www.equalserving.com/category/digital-downloads/
Infusionsofthttps://www.equalserving.com/category/infusionsoft/
How Toshttps://www.equalserving.com/category/how-to/

If you take a peek at the source code of my web form, you will notice that each of the items in the dropdown has the values that you entered in the field in the Infusionsoft web form builder.

<div class="infusion-field"> 
   <label for="inf_custom_BlogInterests">Blog Interests *</label> 
   <select id="inf_custom_BlogInterests" name="inf_custom_BlogInterests">
      <option value="">Please select one</option>
      <option value="Digital Downloads">Digital Downloads</option>
      <option value="Infusionsoft">Infusionsoft</option>
      <option value="How Tos">How Tos</option>
   </select> 
</div>

To enable the use of such a shortcode requires that I add a function to my WordPress theme’s function.php file. I’ll explain what the following code does line by line below.

add_shortcode('esifs_router_v2', 'esifs_router_v2_function');
 
function esifs_router_v2_function($atts, $content = null){
    //* What is the IFS field name we are concerned with that predicts the routing
    if ((isset($atts["field_name"]) && $atts["field_name"] != "") && (isset($atts["pages"]) && $atts["pages"] != "")) {
        //* Convert the pages to a proper array
        $pages = json_decode( $atts["pages"], true );
        if( !is_array( $pages ) or count( $pages )<1 ) $pages = array();
        //* Get the value of the IFS field
        $field_name = $atts["field_name"];
        //* Make sure there is a value
        if (isset($_GET[$field_name]) && $_GET[$field_name] != "") {
            $value = $_GET[$field_name];
            $url = $pages[$value];
            if ($url != "") {
                $string .= '<script type="text/javascript">';
                $string .= 'window.location = "' . $url . '"';
                $string .= '</script>';
                echo $string;
            } else {
                echo "<p>No value found.</p>";
            }
        }
    }
}
  • Line 1: Associates the shortcode [esifs_router_v2] with the function esifs_router_v2_function. WordPress now knows that when it sees the shortcode [esifs_router_v2] in a page or post, it will call the esifs_router_v2_function. For more on WordPress shortcodes, you can read Smashing Magazines guide on shortcodes.
  • Line 3: passes the attributes from the shortcode to the function esifs_router_v2_function.
  • Line 5: checks to ensure that the field name is set in the shortcode and not empty.
  • Line 7 – 8: converts the details of the pages parameter into an array to use in the rest of the code.
  • Line 11: tells the function what field name I want to check for redirection. In my case, it is the field name inf_option_MyInterest.
  • Line 14: checks to ensure that the field name is being passed to the page by Infusionsoft and that the value is not empty.
  • Lines 15: assign the value of the option the visitor selected to the variable $value.
  • Lines 16: assigns the appropriate URL to the variable $url.
  • Lines 18 – 21: Will output a small piece of Javascript to the page that will redirect the visitor to the page you defined in the shortcode.
  • Lines 22 – 23: If a URL is not found in the array, it will output a message without the JavaScript code to redirect.

To finish this post I wanted to show you how to change the shortcode from my original example so that I could use the new version of the shortcode.

The new shorcode would look like –

[esifs_router_v2 field_name="inf_option_MyInterest" pages='{"213":"http://clients.equalserving.com/loreen/infusionsoft-router/213-kayaking", "215":"http://clients.equalserving.com/loreen/infusionsoft-router/215-biking", "217":"http://clients.equalserving.com/loreen/infusionsoft-router/217-hiking"}']

What the Heck is MsoNormalTable? And How Did it Get in my Post?

by Leave a Comment

Have you ever created a post or page in WordPress and found the following weird code staring at you?

<!--[if gte mso 9]><xml><br />
<w:WordDocument><br />
<w:View>Normal</w:View><br />
<w:Zoom>0</w:Zoom><br />
<w:PunctuationKerning/><br />
<w:ValidateAgainstSchemas/><br />
<w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid><br />
<w:IgnoreMixedContent>false</w:IgnoreMixedContent><br />
<w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText><br />
<w:Compatibility><br />
<w:BreakWrappedTables/><br />
<w:SnapToGridInCell/><br />
<w:WrapTextWithPunct/><br />
<w:UseAsianBreakRules/><br />
<w:DontGrowAutofit/><br />
</w:Compatibility><br />
<w:BrowserLevel>MicrosoftInternetExplorer4</w:BrowserLevel><br />
</w:WordDocument><br />
</xml><![endif]--></p>
<p><!--[if gte mso 9]><xml><br />
<w:LatentStyles DefLockedState="false" LatentStyleCount="156"><br />
</w:LatentStyles><br />
</xml><![endif]--><!--[if gte mso 10]></p>
<style>
 /* Style Definitions */</p>
</style>
<p><![endif]--></p>

Yeah? Chances are you copied the content straight from Word and pasted it right into the WordPress editor. To prevent this from happening in the future use the Paste From Word feature as pictured below.

PasteFromWord

Using the Paste From Word feature strips out the Word formatting commands from your WordPress page or post.

  1. Copy your content from Word
  2. Click on the Paste From Word icon
  3. Paste your content from Word into the provided space
  4. Click on the Insert button

In the event that you do not see the Paste From Word icon in your editor, click on the Show/Hide Kitchen Sink icon . This will reveal a second row of editing icons/features.

For more information about the Paste From Word feature in wordpress, please see the WordPress Support page.

W3 Total Cache Garbled My Simple Social Icons

by Leave a Comment

I put it off long enough. My site was in desperate need of optimization. I installed the popular W3 Total Cache plugin and then began the task of configuring it for my needs. I will not get into the specifics here – I will let the plugin’s developers and experts guide you on the configuration.

I won’t lie, it took some time to get the site configured with W3 Total Cache but when all was said and done, I was sad to see that while the pages loaded much quicker, the graphics of the Simple Social Icons plugin displayed garbled nonsense. You can see what I’m talking about below –

simple-social-icons-garble

I found others had similar problems but what resolved their problems had already been coded and accounted for by the developers of the W3 Total Cache plugin.

I tried a few things to no avail but because I minified the CSS of the site, I went to the Minify settings at – {website.com}/wp-admin/admin.php?page=w3tc_minify and scrolled down to the Advanced area and specifically the Never minify the following CSS files setting. In Never minify the following CSS files field I entered the path to the Simple Social Icons’ style sheet which in my case was => /wp-content/plugins/simple-social-icons/css/style.css

Once I made that change …

Viola! Problem solved.

How To Present An Infusionsoft Product Bundle with Gravity Forms

by Leave a Comment

Last month, Infusionsoft hosted a Mastermind call about building a dynamic checkout process which started me thinking about how to implement such a feature for a client. By the way, if you are an Infusionsoft user and you are not attending the weekly Mastermind calls, you are really missing out. I have been well impressed with the topics they cover.

In the Mastermind Demonstration, which you can view at the Mastermind Archive, Corey Harding of Infusionsoft builds a dynamic checkout process using an Infusionsoft web form and an Infusionsoft product bundle link.

What is the Infusionsoft Product Bundle Link?

Through a product bundle link, Infusionsoft provides a mechanism to add multiple products to the shopping cart in one click.

As Corey explains in the video, the bundle link has to be “built” using the product ids and quantities included in the bundle. One stipulation in building the link – a product id CANNOT have a quantity of zero (0). Therefore, he uses a JavaScript (provided on the MM archive page) to remove any products with a quantity of zero (0) from the query string which is submitted to the Infusionsoft bundle process. If you include a product id with a quantity of zero (0) in the query string, the bundle link will fail.

The Infusionsoft bundle link has the following form where the query string lists the productId and productQuantity of all the products you want to add to the shopping cart –

https://{ifsapp}.infusionsoft.com/app/manageCart/processBundle?productId=1&amp;productQuantity=1productId=2&amp;productQuantity=10&amp;productId=3&amp;productQuantity=9

Once I saw what Corey did, I was sorry I did not think of it myself. It works especially well with Gravity Forms for a product that includes many options. Let’s say for demonstration purposes, I am selling a plugin. Along with the plugin, I offer an eBook that explains some of the nuances of the plugin and how to make the most of your purchase. I also offer installation of the plugin and an annual premium support plan. If the customer purchases 2 years of support in advance, I offer a 50% discount.

Using Gravity Forms Instead of Infusionsoft Webform

You can view my demonstration form at https://www.equalserving.com/useful-tools/infusionsoft-product-bundle-test/

I used Gravity Forms’ Product Pricing Fields to configure the form. The top field is a Single Product field with the quantity disabled (because this is presumed to be a digital product – there is no need for quantity). The installation, ebook and support fields also use a Product Pricing Field with Radio Buttons field type.

I included a hidden field on the form that contains a promo code for the multi-year support discount. This hidden field is unnecessary as you can configure purchase discounts in Infusionsoft that do not require a promo code but I included it anyway for this example.

Lastly, I dragged in a Total Pricing Field so that the customer could see how much the purchase was going to be before adding it to their cart.

Once the customer clicks on the button labelled “Process My Product Bundle,” the form is configured to redirect to the Infusionsoft product bundle link. Gravity Forms allows the fields of the form to be redirected to another page by clicking on the Form Settings | Confirmations. Select the Confirmation Type – Redirect; enter the Redirect URL and click the Merge Fields button to include the fields necessary in the bundle link. Below is a snapshot of my completed Confirmations screen –

infusionsoft_bundle_gravity_forms

Below is the default Infusionsoft bundle link –

https://{ifsapp}.infusionsoft.com/app/manageCart/processBundle

Below is the Redirect Query String I entered for my particular form. This field is activated when you enable the “Pass Field Data Via Query String” checkbox –

productId=35&productQuantity=1{AddOn Installation:4:value}{Taking Awesome Plugin to the Next Level - eBook:7:value}{Support:6:value}

The above query string as written will append only the values of the fields onto URL Redirect. The evaluated “raw un-filtered” Redirect URL with query string will look as follows:

https://{ifsapp}.infusionsoft.com/app/manageCart/processBundle?productId=35&productQuantity=1001

If the above was submitted, 1001 units of product id 35 would be added to the shopping cart. This, of course, is not what we want.

We must add code to ensure that only products with a quantity of more than zero (0) are added to the query string and that the parameters are properly formatted. Therefore, we must modify the theme’s functions.php file to include the following:

add_filter("gform_merge_tag_filter", "gv_filter_all_fields", 10, 4);
function gv_filter_all_fields($value, $merge_tag, $options, $field){
    if($field["formId"] == "84") {
    	if ($merge_tag == 4 && $value != 0) {
    		// Installation
    		$retVal = "&productId=39&productQuantity=".$value;
    	}
    	if ($merge_tag == 7 && $value != 0) {
    		// eBook
    		$retVal = "&productId=37&productQuantity=".$value;
    	}
    	if ($merge_tag == 6 && $value != 0) {
    		// Support
    		$retVal = "&productId=41&productQuantity=".$value;
    	}
    	if ($merge_tag == 9) {
    		// promoCode
    		$retVal = "&promoCode=".$value;
    	}
    } else {
    	$retVal = $value;
    }
    return $retVal;
}

The above function is triggered with the gform_merge_tag_filter filter. Line 4 evaluates the form id. If formId equals 84 (our bundle form), the function then interrogates the merge_tag and the value parameters. Depending upon which merge tag is passed, the proper productId is returned along with the value of the form field (product quantity). So, the above “raw unfiltered” Redirect URL with query string becomes –

https://{ifsapp}.infusionsoft.com/app/manageCart/processBundle?productId=35&productQuantity=1&productId=41&productQuantity=1&promoCode=MULT
I

Conclusion

Like everything in life and especially online, there are many ways to accomplish any one task. Using an Infusionsoft webform to create a dynamic product bundle is possible and requires no additional tools. But if you are already using Gravity Forms, and want to create a more pleasant customer experience why not put the process together using Gravity Forms?