Category Archives: woocommerce

A Very Good Managed Hosting for a High-Traffic WooCommerce Site (Rapyd Cloud)

We’ve tested enough hosting providers to know that promises don’t always match reality. Speed, uptime, scalability—everyone claims to be the best. But when traffic spikes, databases strain, and real users start clicking around, the cracks show fast. That’s why we put Rapyd Cloud to the test. A relatively new name in managed hosting, it claims [...]

Read More...

The post A Very Good Managed Hosting for a High-Traffic WooCommerce Site (Rapyd Cloud) appeared first on Learn WordPress with WPLift.

WBW Product Filter Review: Make Product Search Actually Work

WBW ReviewRunning a WooCommerce store means managing hundreds of products. Without proper filtering, your store becomes a massive catalog that’s frustrating to browse. When shoppers can’t find that medium black hoodie in their price range, they leave. That’s why we’ve tested WBW Product Filter for two weeks. The plugin adds essential filters for price, size, colour, [...]

Read More...

The post WBW Product Filter Review: Make Product Search Actually Work appeared first on Learn WordPress with WPLift.

How to Add Express Checkout Buttons in WooCommerce

Are you looking to add an express checkout button to your online store?

Express checkout helps streamline the checkout process and improves the overall shopping experience for your customers. It can also boost conversions and reduce cart abandonment.

In this article, we will show you how to add express checkout buttons in WooCommerce.

How to add express checkout buttons in WooCommerce

Why Add Express Checkout in WooCommerce?

Adding express checkout to your WooCommerce store provides a better shopping experience for your customers.

It allows customers to go directly to the payment page and skip the shopping cart or checkout pages. They also won’t have to go to a payment provider page or fill out a checkout form to complete their purchases.

Express checkout buttons make the entire buying process quicker. Customers can simply click the buttons and log in to pay for the products they wish to buy in an instant. As a result, you may see a boost in conversions and fewer abandoned carts.

Adding express checkout also helps mobile users where their screen sizes are small. Customers will just tap the buttons to quickly purchase the products.

However, WooCommerce doesn’t offer an express checkout option by default. You will need to use a WooCommerce plugin to add the feature to your online store.

That said, let’s see how you can add express checkout buttons in WooCommerce.

Setting Up FunnelKit on Your WooCommerce Store

FunnelKit is the best WooCommerce sales funnel plugin on the market. It lets you add express checkout buttons and create different funnel pages for your online store.

The best thing about using the plugin is that it works with Stripe, Apple Pay, Google Pay, PayPal Express, Amazon Pay, and other payment gateways for express checkout. This way, you don’t have to add each payment provider to your online store using third-party plugins or extensions.

FunnelKit also provides user-friendly templates and lets you do A/B testing. You can easily customize your funnels using different drag-and-drop page builders. Plus, there are multiple pre-built templates and automation features for your marketing campaigns.

FunnelKit

Note: For this tutorial, we will be using the FunnelKit Pro plugin because it includes premium templates and more customization options. You can also use the free Funnel Builder for WordPress by FunnelKit plugin to add express checkout buttons in WooCommerce.

First, you will need to install and activate the FunnelKit plugin. If you need help, then you can follow our guide on how to install a WordPress plugin.

Upon activation, you will see the FunnelKit setup wizard. Go ahead and click the ‘Get Started’ button.

Start FunnelKit setup wizard

After that, you will need to enter your license key. You can find the key in the FunnelKit account area.

Simply click the ‘Activate’ button after entering the license key.

Enter FunnelKit license key

Next, FunnelKit will ask you to install essential plugins. These include WooCommerce, Stripe, FunnelKit Automations, and FunnelKit Cart.

The best part is that you just have to click the ‘Install and Activate’ button, and FunnelKit will take care of the rest.

Install essential plugins

After the plugins are active, the final step is to enter your email address.

Once that’s done, simply click the ‘Submit & Finish’ button.

Enter email and finish setup

You will now see a success message. You are ready to create funnels using the plugin and add express checkout buttons to your WooCommerce store.

Go ahead and click the ‘Go to Funnels’ button to continue.

Close the congratulations message

Enabling Payment Gateways in WooCommerce

Before moving forward, make sure you have set up at least one payment service in your WooCommerce store.

To do that, simply go to WooCommerce » Settings from your WordPress dashboard and click on the ‘Payments’ tab.

Enable payment services in WooCommerce

After that, you can click the toggle to enable the payment gateway of your choice and click the ‘Finish set up’ button to complete the configuration.

To learn more, you can follow our guide on how to allow users to choose payment methods in WooCommerce.

Adding Express Checkout Buttons to WooCommerce

Once you have enabled your preferred payment gateways, you can head to the FunnelKit » Store Checkout page from your WordPress admin panel.

From here, simply click the ‘Create Store Checkout’ button.

Create store checkout

On the next screen, FunnelKit will show you professionally-designed templates for your checkout page. It will also let you create a checkout page from scratch.

However, we recommend using a template and quickly customizing it according to your requirements.

Simply hover over a template you’d like to use and click the ‘Preview’ button.

Previewing FunnelKit's WooCommerce templates

For this tutorial, we will use the Livewire template.

Next, go ahead and click the ‘Import This Funnel’ button at the top.

Import the funnel template

Depending on the template you use, FunnelKit may ask you to install additional plugins like Elementor to edit the checkout page.

Next, you will need to enter a name for your store checkout and click the ‘Add’ button.

Enter a name for your checkout page

After that, you will see all the steps that are included in the template.

You can simply click the ‘Edit’ button for the Checkout page to continue.

Edit the checkout page

Next, you can switch to the ‘Optimizations’ tab. From here, simply enable the ‘Express Checkout Buttons’ option.

FunnelKit will also let you choose the position of the buttons from the following options:

  • Top of the checkout page
  • Before/after the product switcher
  • Before/after the order summary
  • Above the payment gateways
Enable express checkout

When you are done, simply click the ‘Save Changes’ button.

That’s it, you have successfully added express checkout buttons to your online store.

If you want to edit the appearance of the checkout page, then you can switch to the ‘Design’ tab and click the ‘Edit Template’ button.

Edit the template

You can learn more by following our guide on how to customize the WooCommerce checkout page.

Once you have made your changes, simply visit your online store to view the express checkout buttons in action.

Express checkout buttons preview

Additionally, FunnelKit helps you upsell products in WooCommerce. This way, you can boost sales by encouraging users to buy more products.

You can also set up automated emails in WooCommerce using FunnelKit Automations, a sister product of FunnelKit. This plugin lets you create automated workflows and send email campaigns to customers.

We hope this article helped you learn about how to add express checkout buttons in WooCommerce. You may also want to see our list of the best WooCommerce plugins for your store and how to create a WooCommerce popup to increase sales.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Express Checkout Buttons in WooCommerce first appeared on WPBeginner.

How to Create a WooCommerce Subscription Reminder Email in WordPress

Are you looking for a way to create WooCommerce subscription reminder emails in WordPress?

Customers who subscribe to your products may not always remember the renewal date. This can cause confusion and panic when you automatically take money from their accounts.

In this article, we will show you how to improve the subscriber experience by creating a WooCommerce reminder email in WordPress.

How to create a WooCommerce subscription reminder email in WordPress

Why Create a WooCommerce Subscription Reminder Email in WordPress?

Subscriptions are a great way to get consistent and ongoing revenue for your business. You might sell physical products such as subscription boxes or digital products like online memberships and digital courses.

If you are using WooCommerce, then you can sell subscriptions using the WooCommerce Subscriptions extension. For step-by-step instructions, please see our guide on how to add subscriptions to WooCommerce.

After you have set up WooCommerce Subscriptions, it’s a good idea to create subscription reminder emails. These automatic messages let customers know that their subscriptions are about to renew.

In this way, you can give the subscriber a chance to update their payment details and contact information or make other changes before their subscription auto-renews. This can help you avoid admin headaches, refund requests, and customer complaints.

It also gives the customer a chance to cancel their subscription. Although you will want to get as many subscribers as possible, people who feel tricked into renewing their subscriptions may complain or leave negative customer reviews.

With that in mind, let’s see how to create a subscription reminder email in WordPress using the WooCommerce Subscriptions extension and FunnelKit.

How to Create a WooCommerce Subscription Reminder Email in WordPress

The best way to create a subscription reminder email is by using FunnelKit Automations. FunnelKit Automations is the best marketing automation tool for WooCommerce websites.

FunnelKit lets you easily set up automated emails for abandoned cart recovery, lead nurturing, post-purchase education, next order coupons, subscription reminders, and more.

Step 1: Set Up FunnelKit Automations

First, you will need to install and activate the FunnelKit Automations Pro plugin. For more details, please see our guide on how to install a WordPress plugin.

You will also need the free FunnelKit Automations plugin, as the premium plugin uses it as the base for its more advanced features.

Upon activation, you need to go to FunnelKit Automations » Settings and add the license to the ‘FunnelKit Automations Pro’ field.

Adding a FunnelKit Automations license to your WordPress website

You can find this information under your account on the FunnelKit website. After entering the key, just click on the ‘Activate’ button.

Now, you are ready to create all kinds of WooCommerce automations that increase sales.

Step 2: Create a FunnelKit Email Reminder Automation

To create a subscription reminder email, go to FunnelKit Automations » Automations (Next-Gen) and click on the ‘Add New Automation’ button.

Adding a new automation to your WooCommerce store

Here, you will see all the ready-made email campaigns you can use to recover WooCommerce abandoned cart sales, sell online courses, and more.

To create a WooCommerce subscription reminder, click on ‘Start From Scratch’.

The FunnelKit Automations library

You can now type in a name for the automation. This is just for your reference, so you can use anything you want.

With that done, click on the ‘Create’ button.

Creating a WooCommerce subscriptions reminder email

This launches FunnelKit’s user-friendly email automation builder, ready for you to create the WooCommerce workflow.

To get started, you need to click on ‘Select Trigger’.

Adding a FunnelKit trigger to an automation workflow

You can now choose the action that will trigger the automated workflow in WordPress.

To start, click on the ‘WooCommerce’ tab and then select the following trigger: ‘Subscriptions Before Renewal’.

Creating a WooCommerce subscription reminder email

When you are ready, click on ‘Done.’

This will add a basic trigger to the FunnelKit editor. To go ahead and configure the trigger, click on ‘Subscriptions Before Renewal’.

Editing the subscriptions renewal WooCommerce trigger

Now, you can decide when to send the reminder.

Just be aware that you can also create follow-up emails. For example, you might send an email 5 days before the subscription renewal and a follow-up the day before.

To set a date, simply type a number into the following field: ‘Days before subscription renewal’.

Creating an automated time-based trigger

You can also choose the time when the email will be sent. It’s a good idea to send reminder emails when the subscriber is more likely to be online and opening messages.

That said, it helps to know as much about your subscribers as possible. If you haven’t already, then we recommend installing Google Analytics in WordPress. It will help you learn more about your customers, including their timezone and when they are most likely to be online.

After setting up your reminder emails, it’s also a good idea to track your email open rates. You can even set up A/B split testing by sending messages at different times and then seeing what gets the best results.

By continuously monitoring and fine-tuning all your custom WooCommerce emails, you should be able to improve your open rates and conversion rates.

You can tell FunnelKit to send reminder emails at a specific time by typing it into the fields that show ‘HH’ (hour) and ‘MM’ (minute) by default.

Creating an automated WooCommerce workflow

After that, you can choose whether to send this email once or multiple times.

Later in this guide, we will show you how to add follow-up emails to this campaign. With that in mind, you will typically want to send this email once by selecting the ‘Once’ button.

When you are happy with how the trigger is set up, simply click on the ‘Save’ button.

Configuring the WooCommerce subscription reminder email

Step 3: Design the WooCommerce Subscription Reminder Email

Now, it’s time to create the WooCommerce email that will be sent to your subscribers by clicking on the ‘+’ button.

You can then select ‘Action.’

Adding actions to an automated WooCommerce workflow

In the popup that appears, choose ‘Send Email.’

Then, click on ‘Done.’

Sending a WooCommerce reminder email

You can now create an email by typing in a subject and preview.

You can use a mix of plain text and merge tags. FunnelKit will replace any merge tags with real values every time it sends a subscription reminder email. In this way, merge tags can catch the subscriber’s attention with personalized content.

For example, you might use a merge tag to add the subscriber’s name to the subject line or the date when their subscription will auto-renew.

To add a merge tag, just click on the ‘{{.}}’ icon next to the field where you want to use the tag.

FunnelKit's dynamic merge tags

This opens a popup where you can look through all the available merge tags.

When you find a tag you want to use, you might see either a ‘Copy’ or ‘Settings’ icon. If you see the ‘Copy’ symbol, then simply click it to copy the merge tag.

Copying dynamic merge tags

With that done, you can go ahead and paste the merge tag into the email.

At this point, you may also want to add some static (plain) text by typing it directly into the field.

Adding merge tags to a WooCommerce reminder email

When looking through the merge tags, you may see a ‘Settings’ icon instead of a ‘Copy’ icon.

For example, this image shows a ‘Settings’ icon next to the Contact First Name merge tag.

Adding merge tags to a subscription reminder email

This icon allows you to set a fallback, which FunnelKit will use if it doesn’t have access to the real value.

If you see a ‘Settings’ icon, then give it a click and type some text into the ‘Fallback’ field.

Setting a fallback for your WooCommerce subscription reminder emails

After creating a fallback, click on ‘Copy.’

With that done, simply paste the merge tag into the field where you want to use it. You can also type static text directly into the field.

Adding dynamic text to a WooCommerce subscription reminder email

When you are happy with how the subject and preview text is set up, just scroll down to the small text editor.

Here, you can create the email body text by typing it into the editor. You can also add dynamic tags by selecting ‘Merge Tags’ and then following the same process described above.

Adding body tags to a WooCommerce subscriber email

The text editor has all the standard text formatting options, so you can add links, change the text size, change the font, and more.

As you are creating the email, you can preview it by clicking the ‘Show Preview’ button.

Previewing WooCommerce emails using FunnelKit

When you are happy with the subscription reminder email, just click on the ‘Save & Close’ button.

Step 4: Create Follow-up Emails

At this point, you might want to add one or more follow-up emails to the campaign.

To start, you will typically add a delay between these emails by clicking on the ‘+’ icon and then selecting ‘Delay’.

Adding a delay to an automated WooCommerce email sequence

On this screen, open the dropdown that shows ‘Minutes’ by default and choose a value from the list. When creating reminder emails for your online store, you will typically want to select either ‘Days’ or ‘Weeks.’

After that, type in the value you want to use, such as 1 Week or 3 Days.

Adding a delay to a FunnelKit automated workflow

With that done, you may want to set the time when FunnelKit will send the follow-up email. You will typically want to send the reminder email when subscribers are more likely to be online or when you usually get the best open rates.

To do this, just check the following box: ‘Delay until a specific time of day’.

Adding a delay to an automated workflow

You can now set the time using the new settings that appear.

By default, FunnelKit will use the timezone in your WordPress settings. However, you can also send the email based on the subscriber’s timezone by checking ‘In Contact Timezone’.

Sending subscription reminder emails based on the customer's timezone

When you are happy with how the delay is set up, click on ‘Save.’

With that done, it’s time to create the follow-up email. Go ahead and click on the ‘+’ icon and then select ‘Action’.

Creating follow-up emails for your online store

In the popup that appears, select ‘Send Email.’

After that, you need to click on ‘Done.’

Adding follow-up emails to an automated WooCommerce workflow

This opens a popup where you can create a subject and preview, as well as add body text by following the same process described above.

When you are happy with the follow-up email, just click on the ‘Save & Close’ button.

Adding automated follow-up messages to your eCommerce store

You can now add more delays and follow-up emails by repeating the exact same steps.

When you are ready to make the automation live on your WordPress website, click on the ‘Inactive’ slider so that it turns to ‘Active.’

Publishing an automated WooCommerce workflow

Now, FunnelKit will now send automated subscription reminder emails for your online store.

We hope this article helped you learn how to create WooCommerce subscription reminder emails. You may also want to see our guide on how to create a WooCommerce popup to increase sales or our expert picks for the best WooCommerce plugins for your store.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Create a WooCommerce Subscription Reminder Email in WordPress first appeared on WPBeginner.

How to Easily Add a Sliding Side Cart in WooCommerce

Do you want to add a sliding side cart in WooCommerce?

This allows shoppers to see their shopping cart from any page on your online store. Customers can then add items to their basket, remove products, and add coupons without ever having to visit a separate cart page.

In this article, we will show you how you can easily add a sliding cart in WooCommerce.

How to add a sliding side cart in WooCommerce

Why Add a Sliding Side Cart in WooCommerce?

A sliding side cart is a panel that appears when a customer adds an item to their basket.

Customers can also open the cart at any time by clicking on the cart icon. This allows them to check their shopping basket without having to visit a separate WooCommerce cart page.

An example of a sliding cart in WooCommerce

Depending on how the cart is set up, shoppers may also be able to add and remove items as well as apply coupons directly from the sliding panel. You can even add call to action buttons such as a link to your WooCommerce checkout page.

Sliding carts can improve the customer experience by removing friction from the shopping process, and help shoppers keep track of how much they’ll pay at checkout. This can reduce cart abandonment rates, while also possibly increasing the average order value.

With that being said, let’s see how you can add a sliding side cart in WooCommerce. Simply use the quick links below to jump straight to the method you want to use.

Method 1. How to Add a Sliding Side Cart in WooCommerce Using a Free Plugin

The quickest and easiest way to create a sliding side cart is by using Cart For WooCommerce By FunnelKit. This free plugin allows you to add a cart icon to your online store.

Shoppers can click the button to open the sliding side cart.

An example of a sliding side cart in WooCommerce

You can change the cart’s colors, borders, buttons, messaging, and more.

There are a ton of options to make it perfectly fit your WordPress theme.

A WooCommerce sliding side cart

You can show the cart button across your entire site, limit it to WooCommerce pages only, or add the button to specific pages and posts using a shortcode.

How to Setup the Cart For WooCommerce Plugin

First, you’ll need to install and activate the FunnelKit Cart for WooCommerce plugin. If you need help, then please see our guide on how to install a WordPress plugin.

Upon activation, go to FunnelKit » Cart. You’ll see a preview of the sliding slide cart towards the right of the screen.

Previewing the FunnelKit cart

You can now customize the cart to better suit your needs.

To start, you can decide whether to show the cart icon across your entire website or on WooCommerce pages only.

If you select ‘Entire Site’, then shoppers can open the sliding cart from any page, so this is a good choice for online marketplaces and stores.

Adding a cart icon to your WordPress website

However, some WooCommerce sites have lots of non-ecommerce content. For example, you might run a popular WordPress blog, but use WooCommerce to sell merchandise to your fans.

Showing a cart button on every single blog post may become annoying. In that case, you can check the ‘WooCommerce Pages’ radio button.

Adding a cart icon to your WooCommerce pages

Another option is ‘None,’ which hides the cart icon completely.

If you select the ‘None’ option, then you can add the icon to any page, post, or widget-ready area using a shortcode. You can also add the icon to your navigation menu.

We’ll show you how to do this later in the post, but for now, select ‘None’ if you plan to add the cart icon manually.

After making this decision, select ‘Bottom Left’ or ‘Bottom Right’ depending on where you want to show the cart button. Here, it may help to check how the button will look on your online store by selecting ‘Preview on Page.’

Previewing the FunnelKit sliding cart

By default, the plugin shows ‘Review Your Cart’ at the top of the sliding side cart.

You can replace this with your own messaging by typing into the ‘Cart Heading’ field.

Adding a heading to your online store's cart

If you don’t want to show a heading, then simply leave the field empty.

By default, FunnelKit shows the cart icon before the shopper adds any items to their basket.

If you prefer, then you can hide the icon until the visitor starts adding items. Simply click on the ‘Hide Cart Icon’ toggle so that it turns blue.

Hiding the WooCommerce cart

This is all you need to create a basic sliding side cart, but there are settings that can get you even more sales. With that in mind, let’s take a look at FunnelKit’s more advanced features.

Accept Coupons in the WooCommerce Sliding Side Cart

Coupons are a great way to get more sales and build customer loyalty.

If you’ve created any smart WooCommerce coupons using the Advanced Coupons plugin, then shoppers can type them directly into the sliding cart page.

Adding coupon codes to a sliding side cart in WooCommerce

When the customer clicks on ‘Apply,’ the sliding cart will show how much they’ve saved.

Since customers can see the discount straight away, this will encourage them to add more items to their basket and may reduce your cart abandonment rates.

How to accept coupon codes in a sliding side cart

You can create these codes using the built-in WooCommerce coupon feature or by using a coupon code plugin.

To add the coupon field, click on the ‘Enable Coupon Box’ toggle, which turns it from grey (disabled) to blue (enabled).

Accepting coupons on your online store

After that, you can switch between ‘Minimized’ and ‘Expanded’ layouts. Minimized takes up less space so it’s less distracting, but shoppers will need to expand the coupon section before they can type in any codes.

In the following image, you can see the minimized layout.

An example of a minimized layout for coupon codes and discounts

After choosing a layout, you can change the text that FunnelKit uses for the coupon box heading, discount placeholder text, and button text.

Customize the Cart Summary

The cart summary shows customers how much their purchase will cost. This helps reduce cart abandonment rates since there are no nasty surprises at checkout.

Customizing the WooCommerce cart summary

For that reason, we recommend leaving the ‘Show Subtotal’ toggle enabled.

However, if you want to simplify the side cart, then you can click to disable the ‘Show Subtotal’ toggle.

Showing the subtotal on your eCommerce cart page

You can also show any savings the customer has qualified for, including discounts from any coupons they’ve applied.

In this way, you can use FOMO to increase conversions, especially if the savings are time-sensitive. For example, you might schedule coupons in WooCommerce so the customer can only use them for a limited time.

Showing savings and discounts on your e-Commerce site

If you prefer to hide this information from the sliding side cart, then you can disable the ‘Display Savings’ toggle.

You can also replace the ‘Saving Text’ and ‘Shipping Text’ with your own custom messaging.

Customizing the message on a sliding side cart screen

Customize the WooCommerce Cart’s Call To Action

The sliding side cart has a default checkout button, but you can customize this call to action button to get more conversions. To start, you can add a checkout icon using the ‘Enable Button Icon’ toggle.

FunnelKit's checkout settings

This can be particularly useful if you’re creating a multilingual WordPress site.

You can also add the cart price to the checkout button using the ‘Enable Cart Price’ toggle.

Customizing the WooCommerce checkout button

This may help shoppers keep track of how much the cart will cost, especially if you’ve removed the subtotal from the cart summary section.

By default, FunnelKit adds a ‘Continue Shopping’ link at the bottom of the sliding side cart. You can replace this text with your own messaging by typing into the ‘Continue Shopping Text’ field.

Customizing the 'Continue shopping' text

After that, choose whether this link will simply close the side cart panel or redirect the shopper to your WooCommerce store page.

Most shoppers will expect to exit the sliding cart, so we recommend selecting the ‘Close Side Cart’ button.

Closing the sliding side cart in WooCommerce

If you select ‘Redirect to Shop,’ then you may want to change the ‘Continue Shopping Text’ text so it’s clear what will happen when customers click the link.

Create a Custom Empty Cart Screen

It is possible to hide the cart button until the shopper adds at least one item to their basket, following the process described above.

However, if you don’t hide the button then customers may sometimes see an empty cart screen.

The 'Empty Cart' screen

You can change the title, description, and button text using the settings in the ‘Empty Cart’ section. Typically, you’ll want to encourage customers to start shopping. For example, you might talk about things you offer such as free shipping or a money-back guarantee.

You might even give the shopper a coupon code such as a buy one get one free (BOGO) discount.

Adding a CTA to the 'empty cart' screen

You can also choose whether clicking on the ‘Shop Now’ button will take the customer to the WooCommerce store page, or simply close the side panel.

We recommend selecting ‘Redirect To Shop’ as this will make it easier for shoppers to start adding items to their carts.

Enabling 'redirect to shop' in the FunnelKit WordPress plugin

Add The Cart Icon Anywhere on your Site

If you want more control over where the cart icon appears, then you can add it to any page, post, or widget-ready area using a shortcode. You can also add it to your site’s menu.

This is a great choice if you selected ‘None’ in the ‘Icon Visibility’ settings following the process described above.

FunnelKit's 'icon visibility' settings

However, if you selected ‘WooCommerce Pages’ then this method allows you to add the cart icon to other important areas of your site. For example, you might add the icon to your custom home page or contact form.

To start, select ‘Cart Menu’ and then click on the ‘Enable Cart Menu’ toggle.

Enabling the cart icon on WordPress

You can now change how the icon looks by selecting one of the icon templates, and choosing whether to show the product count and cart total as part of the icon. This information can help visitors keep track of their carts.

You can also change the icon size and text size. As you make changes, the small preview will update automatically so you can try different settings to see what looks the best.

How to create a custom cart icon for WordPress

When you’re happy with how the sliding side cart icon looks, click on the ‘Save’ button.

You can now add the icon to any page, post, or widget-ready area using the code next to ‘Embed Shortcode.’

How to add a cart icon using shortcode

For more information on how to place the shortcode, please see our guide on how to add a shortcode in WordPress.

Another option is to add the icon to your site’s navigation menu. In this way, the sliding side cart is always within easy reach, without distracting from the main page content.

How to add a cart icon to a navigation menu

To do this, open the ‘Add to Menu’ dropdown and choose the menu you want to use.

After that, click on the ‘Save’ button.

Adding a cart icon to the WordPress menu

Now if you visit your WordPress website, you’ll see the cart icon in the navigation menu.

Add Your Own Colors and Branding

You may want to change the sliding side cart’s colors to better match your WooCommerce theme or branding. To change the text color, button color, link color, and more, go ahead and click on ‘Styling.’

Adding your own branding to a WooCommerce cart

To change any of the default colors, simply give it a click. This opens a popup where you can try out different colors.

For example, in the following image, we’re customizing the border.

How to add custom colors to a WooCommerce store

Another option is to type a hex code into the ‘Hex’ field. This is perfect if you already have a specific shade in mind.

If you don’t know what hex code to use, then it may help to use a site like HTML Color Codes. Here, you can explore different colors and then get a code that you can simply paste into the FunnelKit plugin.

How to Create a Responsive Sliding Side Cart

Many people buy products and services using a mobile device. With that in mind, you’ll want to make sure the sliding side cart looks just as good on smartphones and tablets, as it does on desktop computers.

Here, it may help to change the cart’s width so it doesn’t completely fill the small screen of a mobile device. To do this, click on ‘Styling’ and then look at the ‘Cart Preview Mobile Width.’

Create a mobile responsive cart page

You may want to try typing different values into this field. If you do change the default settings, then it’s a good idea to check the mobile version of your WordPress site from the desktop to make sure you’re happy with the results.

While you’re on this screen, you can also change the width of the sliding side cart on desktop. To do this, simply change the number in the ‘Cart Preview Desktop Width’ field.

How To Publish Your Sliding Side Cart

When you’re happy with how the sliding side cart is set up, it’s time to make it live. Simply click on the ‘Draft’ button next to ‘Cart’ and then choose ‘Publish.’

Adding a sliding side cart in WooCommerce

Now if you visit your online store, you’ll see the sliding cart live.

If you want to remove the sliding side cart at any point, then just head back to FunnelKit » Cart in the WordPress dashboard. Then, click on the ‘Publish’ button and select ‘Draft.’

Method 2. Add an Advanced Sliding Side Cart (With Upsells, Cross-Sells, and Rewards)

If you want to increase the average order value on your store, then you can upgrade to FunnelKit Cart Pro. This advanced sliding side cart plugin adds powerful upsell, cross-selling, and reward features to the FunnelKit sliding side cart.

With this plugin, you can recommend related products every time a customer adds an item to their cart.

Get more sales with upselling and cross-selling promotions

You can also create unique rewards such as coupon codes and free gifts, and then promote them inside the sliding cart.

FunnelKit can even track how much more the customer needs to spend, in order to unlock the next reward.

Offering extra rewards to shoppers

To add these powerful features, you’ll need to upgrade to FunnelKit Funnel Builder Pro. Just be aware that you’ll need the Plus or higher plan.

After buying a plan, log into your FunnelKit account. Here, you’ll find the FunnelKit Funnel Builder Pro plugin, plus FunnelKit Funnel Builder and FunnelKit Cart. You’ll need to install all three plugins to unlock the advanced sliding cart features.

First, you’ll need to install and activate the three plugins. If you need help, then please see our guide on how to install a WordPress plugin.

Upon activation, go to FunnelKit » Settings and add your license key to the ‘FunnelKit Funnel Builder Pro’ field.

Adding the FunnelKit license

You can find this information by logging into your account on the FunnelKit website. With that done, click on ‘Activate.’

After that, simply go to FunnelKit » Cart.

Adding an advanced sliding side cart to an online store

You can now configure and customize the side cart by following the same process described in method 1. When you’re happy with how the sliding side cart is set up, you’re ready to add upsells, cross-sells, and rewards.

Get More Sales By Upselling and Cross-Selling WooCommerce Products

When a customer opens the sliding side cart, you can show them unique upsell and cross-sell promotions based on the items in their shopping basket.

Adding upsell and cross-sell promotions to WooCommerce

Upselling is where you encourage shoppers to buy a higher-priced product instead of the one they already have in their shopping cart.

For example, imagine a customer adding a waterproof jacket to their cart. You might suggest a higher-quality jacket that’s more durable, versatile, and comes in different colors.

Cross-selling is where you promote a product that’s related to something the customer is already buying. For example, if they add a greeting card to their cart, then you might encourage them to buy chocolates or flowers too.

WooCommerce has a linked product feature that allows you to create upsells and cross-sells. For more information, please see our guide on how to upsell products in WooCommerce.

However, you can also create upsells and cross-sells directly from the FunnelKit dashboard. This is the quickest option, so it’s the one we’ll be using in this guide.

To start, click on the ‘Upsells’ option and then select ‘Enable Cart Upsells.’

How to add upsells and cross-sells to WooCommerce

After that, scroll to the ‘Upsells and Cross-Sells’ section.

Here, you’ll see all the products on your online store.

How to create WooCommerce linked products

Simply click on the item where you want to add one or more linked products.

Then, click on either ‘Add Upsell’ or ‘Add Cross Sell’ depending on the kind of promotion you want to create.

FunnelKit's advanced conversion features

In the popup, start typing the product that you want to use as the upsell or cross-sell. When the right product appears, give it a click.

To offer multiple products, simply follow the same process described above.

Adding a linked product on your online store

With that done, simply click on the ‘Add’ button.

You can now create unique cross-sell and upsell campaigns for every product in your store, simply by following the same process described above.

An example of a high-converting eCommerce sliding cart

Now, you’re ready to customize how the upsell and cross-sell promotions will look on your sliding side cart.

To start, try switching between different styles by clicking the radio buttons next to ‘Display.’

Customizing the upsell and cross-sell promotions in WooCommerce

The live preview will update automatically so you can try different styles to see which one you like the best.

By default, FunnelKit will show both upsells and cross-sells in the sliding side cart. If you prefer then you can show only upsells, or only cross-sells using the radio buttons in ‘Product Recommendation Type.’

FunnelKit's product recommendation settings

Next, you can change the heading that FunnelKit shows above the upsell or cross-sell promotion by typing it into the ‘Heading’ field.

Just be aware that FunnelKit will use the same heading for both types of promotion.

Adding promotions to your sliding side cart

After that, you can set the maximum number of suggested products that FunnelKit will show, by typing into the ‘Show Maximum Upsells’ field.

Wherever possible, it’s a good idea to create unique upsell and cross-sell promotions for every product. However, if your online store has lots of items then this might not be possible.

With that in mind, you can set a default upsell product that FunnelKit will promote when no linked products are available. To do this, simply type the name of a product into the ‘Default Upsells’ field. When the right product appears, give it a click.

Setting a default linked product

When you’re happy with the upsell and cross-sell promotions you’ve created, don’t forget to click on ‘Save’ to store your changes.

Offer Free Shipping, Discounts, and Free Gifts

You can often increase the average order value by giving customers a reason to spend more. With that in mind, FunnelKit allows you to create various rewards and then promote them as unlockable bonuses in the sliding side cart.

For example, you might offer free shipping if the customer exceeds a minimum spend. FunnelKit will even show customers how much more they need to spend to unlock their prize.

This is an easy way to get more sales and build customer loyalty with gamification.

FunnelKit allows you to offer three different rewards: free shipping, a discount, and a free gift.

To offer free shipping, you’ll need to have already set up shipping in your WooCommerce store. For step-by-step instructions, please see our complete WooCommerce made simple guide.

Meanwhile, the ‘discount’ reward auto-applies a coupon when the customer reaches the minimum spend. If you want to offer this reward, then you’ll need to create a percentage discount coupon using either the built-in WooCommerce coupon feature or a WordPress coupon plugin.

For step-by-step instructions, please see our guide on how to create smart coupons.

After that, you’re ready to create a reward by selecting ‘Rewards’ in the FunnelKit settings and then clicking on ‘Create Reward.’

How to get more sales with rewards

You can now open the ‘Type’ dropdown and choose the kind of reward you want to create.

No matter whether you choose free gift, free shipping, or discount, you can change the text that FunnelKit shows to customers by typing into the ‘Message’ field.

If you do make any changes, then be careful not to edit {{remaining_amount}} as this allows FunnelKit to show how much more the customer needs to spend.

Adding incentives to your WooCommerce store

If you’re offering a discount, then make sure you change the message to show how much the customer will save.

With that done, type a number into the ‘Amount to Get Reward’ field. This is how much shoppers must spend, in order to unlock the reward.

Offering your customers rewards and incentives

If you’re offering a percentage discount, then you need to specify which coupon FunnelKit should auto-apply.

In the ‘Coupon’ field, start typing the coupon that you want to use. When the right code shows up, give it a click.

Adding a discount offer to your eCommerce site

Now, FunnelKit will auto-apply the coupon when someone meets the minimum spend.

Offering a free gift instead? Then start typing the name of the gift into the ‘Product’ field.

Offering shoppers a free gift

When the right product shows up, give it a click.

Now, FunnelKit will add this item to the customer’s shopping cart as soon as they meet the minimum spend.

How to offer shoppers a free gift

To add more rewards, simply click on ‘Create Another Reward.’

You can now configure the discount, free gift, or free shipping reward by following the same process described above.

Get more sales by offering shoppers a reward

By default, FunnelKit will show the following message once a customer qualifies for all the awards: ‘Congrats! You have unlocked all the rewards.’

To show a different message instead, simply type into the ‘When All Rewards Unlocked’ field. You might even offer the customer a special bonus for unlocking all your rewards, such as an exclusive coupon code to use on their next purchase.

Offering visitors a reward

When you’re happy with how your rewards are set up, click on the ‘Save’ button.

How To Publish Your Sliding Side Cart

When you’re ready to make the sliding side cart live, simply select the ‘Draft’ button next to ‘Cart.’ You can then click on ‘Publish.’

Adding a sliding side cart in WooCommerce

If you want to remove the sliding side cart at any point, then simply head back to FunnelKit » Cart in the WordPress dashboard. Then, click on the ‘Publish’ button and select ‘Draft.’

We hope this article helped you add a sliding side cart in WooCommerce. You may also want to check out our guide on how to create a WooCommerce popup to increase sales and the best WooCommerce plugins for your store.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Easily Add a Sliding Side Cart in WooCommerce first appeared on WPBeginner.

How to Speed Up Your WooCommerce WordPress Theme for Better Performance

From compelling copy to efficient checkout processes, effective marketing, and more, there are a whole host of factors that combine to make a successful eCommerce site, but of them all, few make a bigger impact than performance. Poorly performing websites upset users, drive away potential customers and damage your SEO efforts. But why? How? And [...]

Read More...

The post How to Speed Up Your WooCommerce WordPress Theme for Better Performance appeared first on Learn WordPress with WPLift.

WooCommerce WordPress Theme Security: Best Practices to Keep Your Online Store Safe

Choosing a WooCommerce theme for WordPress can feel like a minefield; many factors exist, from design to user experience to functionality. However, one aspect of choosing a theme is vital: security. Some themes are more secure than others, and there are some key factors to consider regarding safety for you and your site visitors. Even [...]

Read More...

The post WooCommerce WordPress Theme Security: Best Practices to Keep Your Online Store Safe appeared first on Learn WordPress with WPLift.

How Does WordPress Search Work (+ Tips to Make It Better)

Do you want to learn how WordPress search works, and how you can make it better?

By understanding and improving the built-in WordPress search, you can help visitors find what they’re looking for. This can get you more conversions while keeping people on your site for longer.

In this article, we’ll look at how the default WordPress search works, and share tips on how to make it better.

How does WordPress search work + tips to make It better

How Does WordPress Search Work?

WordPress comes with a search system that will look for content within your website.

How the search bar looks and where it appears will vary depending on your WordPress theme, but most themes show the search bar in the top right corner.

The built-in WordPress search bar

Note: If your theme doesn’t show the WordPress search bar by default, then skip ahead to our FAQs, where we’ll show you how to add it.

Visitors can type a search query into this field, and WordPress will search:

  • Page titles
  • Page content
  • Single-image titles and captions
  • Image alt text
  • File names

As you can see, it doesn’t search widgets, user comments, categories, tags, WooCommerce products, or PDF documents. It also doesn’t search image gallery titles, captions, or alt text, although you can search this content using a search engine plugin like SearchWP.

WordPress performs this search using the WP_Query class. It will start by displaying any posts that have the search term in the post title, arranged in reverse-chronological order, meaning that the newest entries will be displayed at the top of the results.

After that, it’ll show any posts that have the matching term in the post content.

For example, imagine you’ve just published a post about cats titled ‘My Favorite Pet’, and you also have an older post titled ‘Best Cat Photos.’ In this case, searching for ‘Cat’ will display the older ‘Best Cat Photos’ post first, since it has the search term in the title.

This may not a problem for WordPress blogs or websites that only have small amounts of content. However, this ordering logic will often show inaccurate or confusing results for bigger blogs, online stores, or business websites.

The built-in system is also missing some of the features that people expect from modern search engines. This includes autocomplete, live Ajax search, filtering, and spellcheck.

Why Improve the Default WordPress Search?

An advanced, fast, and accurate on-site search can help visitors find interesting and relevant content, which will keep them on your website for longer. This can increase pageviews and reduce bounce rate in WordPress.

Since visitors are spending more time on your site, this will send positive signals to the search engines. This can improve your WordPress SEO, which means search engines like Google will show your content to more people and drive more visitors to your website.

For more information, please see our guide on how to increase your blog traffic.

People who are using your site’s internal search are already highly engaged. They’re actively looking for specific content, which may mean they’re ready to take actions such as buying a product, signing up to your WordPress membership site, or booking an appointment.

If these people can’t find what they’re looking for, they may give up and go to a different website. This means you’re losing out on visitors who were ready to convert.

A search results page is also an example of personalized content since you’re showing the visitor results that match their unique search query. By providing personalized content that’s accurate and helpful, you can improve the visitor experience. Once again, this can encourage them to convert.

Performance is another reason why it’s a good idea to replace the default WordPress search with a better alternative.

The larger your WordPress website gets, the longer it’ll take WP_Query to scan your database and get the results. This means your site’s search will get slower, as your website gets bigger.

How to Make the WordPress Native Search Better

On-site search helps visitors find what they’re looking for, including products to buy and interesting blogs to read. Since it’s such an important part of your site, it’s a bad idea to rely on the limited built-in WordPress search.

With that being said, let’s see how you can improve the native WordPress search.

Show Instant Results With Live Ajax Search

Live Ajax search adds a dropdown and autocomplete feature that’s common in search engines like Google.

As the user types, live search guesses what they want to search for and then shows them results without even reloading the page.

How to improve WordPress search with live ajax results

This can help visitors find the right content, without having to manually press the ‘Search’ button or wait for the page to reload.

The easiest way to add Ajax live search to WordPress is using the free SearchWP Live Ajax Lite Search plugin. It enables instant search automatically and there are no settings for you to configure, so it’s very easy to set up.

The first thing you need to do is install and activate the plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, the default WordPress search form will automatically use the Ajax live search feature. If you visit your site and start typing into the search bar, then you’ll see the instant search in action.

Change the Default Search URL Slug

By default, WordPress search URLs typically look something like this:

http://example.com/?s=search-term

The extra ?s= characters make this URL more difficult to read and understand, which can confuse visitors who are trying to find their way around your site.

Even worse, these URLs aren’t optimized for search engines which can stop them from correctly indexing your site’s contents.

The easiest way to change these URLs is by adding custom code to WordPress using a plugin such as WPCode.

You can go ahead and use the following custom code to replace the ‘/?s=search-term’ characters with ‘search.’ Your slug will look something like this when finished: http://example.com/search/wordpress

To use something other than ‘search’ in your URL, simply customize the code snippet below.

function wpb_change_search_url() {
    if ( is_search() && ! empty( $_GET['s'] ) ) {
        wp_redirect( home_url( "/search/" ) . urlencode( get_query_var( 's' ) ) );
        exit();
    }
}
add_action( 'template_redirect', 'wpb_change_search_url' );

For detailed instructions on how to insert this code to your WordPress website, please see our guide on how to change the default search URL slug in WordPress.

Make PDF Files Searchable in WordPress

By uploading PDFs to your WordPress website, you can share information about your services and products in a format that works on all devices. They’re also perfect for offering your visitors ebooks, user manuals, menus, and more.

However, WordPress only searches the contents of its database by default, so it will only look at the title and description of your PDF files, and not their contents. As a result, your visitors may struggle to find the best PDF for their search query.

The good news is that you can use a custom search plugin to improve the default WordPress search experience. If your PDFs are unencrypted, then the right search plugin will index the contents and metadata of your PDFs and add them to the search results.

For step-by-step instructions, please see our guide on how to add PDF indexing and searching in WordPress.

Add a Search By Category Feature to WordPress

If you have multiple categories of content on your website, then you might want to let users restrict their search to a specific category. This can help visitors find the right content, faster.

An example of search by category on a WordPress website

For example, if you have an online store then it often makes sense to let customers search within a particular product category.

If you run a membership site, then you might use search by category to help visitors find other members, groups, forums, online courses, and other specific kinds of content. For more information, please see our guide on how to add search by category in WordPress.

Make a Smart WooCommerce Product Search

WooCommerce has its own built-in search, but it doesn’t look for matches in product attributes, reviews, or product descriptions. This omission can stop shoppers from finding products they want to buy on your online store, so you get fewer sales.

The built-in WooCommerce search feature

Luckily, there are some excellent WooCommerce plugins that can show more helpful search results, and fetch them faster. To learn more, please see our guide on how to make a smart WooCommerce product search.

To get even more sales, you may want to fine-tune the kind of products WooCommerce includes in its search results. For example, you might only show products that are on sale or come with free shipping.

To learn more, please see our guide on how to customize WooCommerce product search results page.

Create a Search Form for Custom Post Types

Custom post types allow you to go beyond posts and pages and create different content types for your website. Custom post types can have different custom fields and their own custom category structure.

For example, if you run a movie review website, then you would probably want to create a ‘movie reviews’ post type that has fields for the director, release date, and more.

At WPBeginner, we use custom post types for our Glossary section to keep it separate from our blog posts.

How to improve your WordPress search with searchable categories

If you use custom post types, then you may want to create a form that allows visitors to search only that content.

For example, we also have a form that only searches WPBeginner’s coupon codes.

Searching coupons and deals on the WPBeginner website

This can help visitors find the right content faster, even when you have lots of different content types. For step-by-step instructions, check out our guide on how to create advanced search forms in WordPress for custom post types.

You can also make custom fields searchable in WordPress, which is ideal if you’ve added extra metadata to your pages and posts.

Exclude Content From WordPress search

By default, the built-in WordPress search will include all posts and pages in its search results.

However, you may want to exclude certain pages and posts from the search results. For example, if you’re running a WordPress membership website or selling online courses, then you’ll typically want to exclude your premium content from public search results.

If you’re running an online store, then you may want to hide content like your account page, checkout page, and thank you page. To help you out, we’ve created a guide on how to exclude pages from the WordPress search results.

Do you want to exclude posts, authors, custom post types, categories, tags, or even custom taxonomies? Then you can take a look at our guide on how to exclude specific pages, authors, and more from WordPress search.

WordPress Search FAQs

In this guide, we’ve explored how the default WordPress search works and shared lots of tips on how to improve it.

However, you may still have some questions about this important feature. That said, here are some of the most frequently asked questions about WordPress search.

How Do I Improve WordPress Search?

The best way to improve the built-in WordPress search is by using SearchWP.

SearchWP is the best custom search plugin for WordPress and allows visitors to search any content on your site including documents, WooCommerce products, custom fields, tags, comments, and more.

It also lets you customize the WordPress search algorithm, so you can control exactly where the content appears in the search results.

For more information, please see our guide on how to improve WordPress search.

Does WordPress Search Include Tags?

By default, WordPress search doesn’t include tags. The easiest way to make tags searchable is by using a custom search plugin like SearchWP.

SearchWP also has a relevancy slider, so you can control exactly how much tags influence where an item appears in the search results.

How Do I Add Search to My WordPress Theme?

If your theme doesn’t have a built-in search form, then we recommend adding a search bar to the WordPress navigation menu.

Since the main navigation menu typically appears across your entire site, visitors will be able to search for pages, posts, products, and more, from any page of your website.

An example of a search bar, in a navigation menu

If you’re using a block-based theme such as ThemeIsle’s Hestia Pro or Twenty Twenty-Three, then you can add a search bar to your theme using the full-site editor (FSE).

To do this, go to Appearance » Editor in the WordPress dashboard.

Opening the WordPress full site editor (FSE)

By default, the editor will show your theme’s home template. If you want to add the search bar to a different template, then click on the small arrow icon in the toolbar.

Then, select ‘Browse all templates.’

How to browse all FSE templates in WordPress

You’ll now see all the templates that make up your WordPress theme. Simply find the template where you want to add the search bar, and then click on its title.

For example, if you wanted to add a search form in your WordPress posts then you’d select the ‘Single’ template.

How to add the search bar to a single template in WordPress

You will now see this template in the full-site editor.

To go ahead and add a search bar, click on the blue ‘+’ icon.

Adding widgets to a single template in WordPress

In the popup that appears, type in ‘Search’ to find the right block.

You can then drag the block to the location where you want to show the search bar.

Adding a search block to a block-enabled theme template

To customize the block title or placeholder text, simply type it into the search block where it says ‘search’ or ‘optional placeholder.’

When you’re happy with how the block looks, click on ‘Save’ to make the search bar live.

Publishing a block-enabled template with a search bar

How Do I Add Search to a WordPress Page or Post?

You can add a search bar to a specific page or post using the built-in Search block.

This is a good choice if you want to control exactly where the search bar appears on every page and post, or you only need to offer search on specific areas of your website.

How to improve the default WordPress search

To get started, simply open the page where you want to add a search form and then click on the + icon.

In the popup that appears, type ‘Search’ to find the right block. Once you click on the Search block, it will add the block to your page.

Adding the Search block to a WordPress page or post

By default, the block uses ‘Search’ for both its label and the button text.

This will be visible to visitors, so you may want to replace it with something more descriptive by typing into the text fields.

Customizing the WordPress search block

You can also add some placeholder text to the search bar. This text will disappear automatically when the visitor starts typing.

To add a placeholder, simply click on ‘Optional placeholder…’ and then start typing.

How to improve the WordPress search

When you’re happy with how the Search block looks, you can go ahead and either publish or update the post.

We hope this tutorial helped you learn how WordPress search works, and how to make it better. You may also want to learn how to make money online blogging with WordPress, or check out our list of the best email marketing services for small businesses.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How Does WordPress Search Work (+ Tips to Make It Better) first appeared on WPBeginner.

The Pros and Cons of Using a Free WooCommerce WordPress Theme

Picking a WooCommerce theme for WordPress can be tricky! There are a lot of factors to consider when choosing a theme, especially if you want to offer a seamless shopping experience for your customers. If you’re trying to keep costs down, there are free WooCommerce themes that work well if you’re willing to put in [...]

Read More...

The post The Pros and Cons of Using a Free WooCommerce WordPress Theme appeared first on Learn WordPress with WPLift.

Best Practices for Creating a Mobile-Friendly WooCommerce WordPress Theme

Creating a mobile-friendly WooCommerce WordPress theme can be tricky. There are a lot of factors to consider when it comes to mobile performance, from loading speed to plugins to image optimization. A WooCommerce theme must work well on mobile for obvious reasons; eCommerce shoppers will click away if a website could be more appealing to [...]

Read More...

The post Best Practices for Creating a Mobile-Friendly WooCommerce WordPress Theme appeared first on Learn WordPress with WPLift.