WooCommerce Tag Archives - Page 3 of 15

How to Increase Conversion Rate By Adding WooCommerce Side Cart Plugin

March 4, 2020 By John Leave a Comment

Did you know that you can increase conversion rates by adding the WooCommerce Side Cart plugin to your website?

Improving the customer journey in your WooCommerce is a great way of boosting your conversion rate and this simple plugin gets the job done by adding an intuitive site-wide cart icon to your WooCommerce store. When you click on the icon, it brings up a view of your cart. When checking the cart contents, your customers don’t need to leave the page they are on which makes for great user experience.

Our Own Experience

We tested the plugin on GardenWare among others, but here’s how it looks on GardenWare. You can tweak the look to fit your brand with some custom CSS. You can adjust the position of the cart icon depending on your needs. You can also remove items or add quantity without refreshing the page.

Increase Conversion Rate By Adding WooCommerce Cart to Your Sidebar - GardenWare

Increasing Conversion Rate

After installing the plugin on Gardenware, we took the data after 3 months.

To account for seasonal data, we compared the data with the same months of the previous year, and we get an increase in conversion rate of almost 10%.

It is important to note that improving the customer journey and user experience leads to more conversions. From our user testing, the plugin does help improve user experience by a great deal.

How to Install and Set Up WooCommerce Side Cart

To get more conversions by using the WooCommerce Side Cart, you have to first install the WooCommerce Cart plugin. You can download the plugin here or search for it from the plugin repository.

We recommend testing this first on a development site to make sure the plugin does not conflict with any other plugin you are using. It’s a good idea to extensively test your product purchase process to make sure there are no issues.

After installing and activating the plugin, click Woo Side Cart from your WordPress Dashboard to see the plugin settings. You can tweak the settings based on your needs.

WooCommerce Side Cart Plugin General Settings

WooCommerce Side Cart Plugin Other Settings

You can also tweak the CSS to make sure the sidebar cart colors and style fit your branding strategy.

Should you need assistance with setting up and customizing the plugin, we can help. Or if you have any questions, you can let us know in the comments.

How to Check if a Theme is Suitable for WooCommerce

April 15, 2016 By John 1 Comment

Some website owners might think that a good theme just needs to look good. Well, that’s not wrong but it’s also not entirely correct. You need to know how to check if a theme is a good theme for your WooCommerce store. Here’s a checklist to help you decide if a WordPress theme is good for your WooCommerce Store.

Theme Ratings and Reviews

Product ratings and reviews are solid indicators of quality. These reviews come from WordPress users who have actually used the theme themselves. Note that even good themes can get a few bad reviews so take them with a grain of salt. However, if the number of bad reviews is unusually high, then it is something to be wary of.

Update Frequency and Support

Update frequency is a good sign of a solid WordPress theme. It shows that the developers are continuously making it better by addressing bugs and other security threats. Similarly, check if the developer is active in public forums. This is a good sign that you will get answers if you are ever met a problem.

Demo Site

Having a demo site is not optional anymore. The demo site is not just where you see how the theme looks like. It is a place where you can perform some crucial tests on it. If your theme doesn’t have a demo site, it could just be outdated or at worst it’s hiding malicious stuff.

Responsiveness

Make sure your theme is responsive. That means it adjusts to fit different screen sizes of mobile devices. More and more traffic is now being generated from mobile devices so a theme that looks good on a mobile device will help make your WooCommerce site more competitive. In fact Google favors websites that work well across all devices. The easiest way to check for mobile responsiveness is Google’s mobile friendly test. Grab the URL of the demo site of your theme and paste it in there to check if the theme is mobile friendly.

Site Speed and Theme Bloat

You have only a few seconds to capture the attention of your e-commerce site’s visitors. Having a slow site doesn’t help. Even if your site looks good, none of that will matter if it is slow. Google hates slow websites and these slow websites are being penalized in rankings.

Themes become slow when they are loaded with unnecessary features. Be careful when the theme offers a lot of functionality that normally shouldn’t be in a theme like the ability to create sliders or change fonts, colors, and other add-ons like shortcodes, additional widgets, and content builders. The add-ons will make it hard for you to switch themes in the future. You may think you are getting good value for your money but its effects on site speed will only hurt your WooCommerce site and your SEO rankings.

Do note that other factors also affect site speed. You can read more about it in this blog post.

Cross Browser Compatibility

Your users will be using different browsers. You may not see any errors on your side but there might be something broken when someone else uses a different browser to view your site. Make sure your website looks the same across different browsers.

SEO-Friendly Markup

HTML isn’t so strict on errors so it will render your content as long as it isn’t something fatal. But when it comes to SEO the HTML markup is crucial. Proper HTML markup will help boost your SEO. You can easily check if your theme HTML code is valid using Markup Validation Service by W3C. Pop the theme demo site’s URL to check for errors in the HTML markup.

Plugin Readiness

A good well-coded theme is lightweight and can support a wide range of popular plugins. For your e-commerce site, you need to make sure that your theme supports WooCommerce. You will often see this in the list of theme features. During development, make sure not to bloat your site with unnecessary plugins. Install only plugins that you need and will actually use.

Page Templates

Another good indication of a good quality theme is the availability of page templates. These templates are fetched when a certain query is performed. Make sure your theme has it all.

home.php: the homepage template
single.php: the template for single posts
page.php: the template for pages
category.php: the template for category indexes
author.php: the template used when someone queries on the author
date.php: the template used when someone searches for posts on a certain date
archive.php: this template is used when either category.php, author.php ordate.php isn’t there
search.php: used when someone searches on your blog
404.php: the template used when WordPress can’t find the URL on your site

Design

Simplicity is the epitome of great design. Select a proper theme that matches the nature of your e-commerce store and will appeal to your target market. If you are planning for a content rich website, go for a more formal look with good typography for enhanced readability. If you are selling products for kids, you can be more playful with the design. Spend some time researching for a theme that addresses your needs. Consider the aspects mentioned above and decide if this is the theme for you.

Theme Developers

Here’s a bonus. A good indication of a quality theme is the reputation of the developers who made the theme. Perform a background check on the people behind the theme. Are they helpful in the WordPress community? Do they have a good reputation? Do they respond in forums regarding questions on their creations? If you answered yes to all of these, then you’re dealing with a good developer/s and odds are their themes are great.

Our Recommended Themes

Storefront

Storefront is an intuitive, lightweight, and flexible theme offering deep integration with WooCommerce. The main goal in developing Storefront is to provide a rock-solid foundation for your WooCommerce store, avoiding extra bloat and unnecessary features. It is built by the same people behind WooCommerce so the standards are as high as WooCommerce itself. To learn more about Storefront, you can check out our review.

Genesis Themes

The Genesis framework is known for its core code and is considered one of if not the best WordPress framework available. It is very flexible because of how well the core code is built. Anything can be customized around the core code using child themes. It is SEO optimized and compatible with WooCommerce.

Was this post helpful in choosing a theme for your WooCommerce store? Do you have any other tips that you’d like to share? Let us know in the comments.

How to Add a Custom Note on WooCommerce Checkout

July 1, 2018 By John 8 Comments

There are times when WooCommerce store owners need to add a custom note on checkout. This can be done by adding some custom code to your site. Read on below to learn how to add a custom note on WooCommerce checkout.

What Situations Would I Need to add a Custom Note on Checkout?

There are several situations when you’ll want to add a custom note on checkout such as:

If you are having checkout problems and you want to inform your customers of a workaround to the problem
If you want to let your customers know about a coupon code that they can use on checkout
If you want to remind your customers about an ongoing promotion so they can add more items to the cart

Adding the Custom Note on WooCommerce Checkout

To add the custom note on WooCommerce checkout. You will need to edit your child theme’s functions.php file.

A word of caution before proceeding. The functions.php file is a sensitive file and editing it can cause your site to do down and even lock you out from the WordPress Dashboard. We recommend letting your developer do this. You can also edit the file using an FTP client so you can easily revert any changes in case you mess something up. If you have no developer and need help getting this done, you can contact the Wooassist team to help you out.

To get started, click on Appearance > Editor.

Next, choose the active theme. Make sure you are using a child theme. Click “Select”. If you are using Storefront theme and don’t have a child theme, check out this guide.

Find the “functions.php” and click to open it.

Copy the code below and paste it on the bottom part of the file as shown in the image. Edit the “Add custom note here” text with the custom text that you want to add.

/** Custom Note on Checkout - By WooAssist  **/

add_action('woocommerce_review_order_before_payment','wooassist_custom_note');

function wooassist_custom_note() {

echo 'Add custom note here'; //You put your own note here between the  

}

That’s a done deal but you may want add some styling to your custom note it will look professional. Add this CSS code by clicking the Customize link on your WordPress admin bar. Then click on Additional CSS.

You can then copy and paste the CSS code below and hit publish to save.

.custom-note {

display: block;

margin-bottom: 10%;

color: #c12a2a;

background: #f5f5f5;

padding: 5%;

}

Note that you may need to tweak the values in the code depending on your theme.

You can now see the styled custom note section on your WooCommerce store’s checkout.

Did that work for you? If you have any questions, let us know in the comments.

Design Tweaks on WooCommerce

January 29, 2015 By John Leave a Comment

Your online business using WooCommerce is all set. Each important element is in place and accounted for. Your website is done. You get regular traffic. You got your marketing strategies in place. You have a blog and you are active in social media. You think you’ve got it all covered, but then a few things start to bug you.

Optimize Web Design

You realize the design needs few tweaks and you come up with a few ideas that should be able to increase sales. What you have to do right now is optimize your design for better conversion rates. This is called conversion rate optimization.

A few design tweaks on your website will help increase your conversion rates. It may involve adjusting or repositioning some visual and design elements. Color, images, cues and their placement on your landing or checkout pages, are all part of optimizing your web design – see here design tweaks.

Keep Your Design Simple

Your website needs to look good, but not necessarily flashy. Simplicity in your design can go a long way towards increasing conversions.

It is understandable that you’d like to fill your pages with a lot of useful features and elements. However, it could also be a hindrance. Visitors would usually turn away from complicated designs. Keep it simple and understandable.

In changing the colors on your website, take the context into consideration. Make use of call-to-actions (CTA), and place them in a favourable manner to make your visitors take action. The design of your website should encourage visitors to want to browse more. Essentially, they should immediately see what they’re looking for.

Use the right amount of white space. It can definitely put emphasis on where it is needed. It is a simple and effective way of making sure that important elements of your site are easy to locate. This post enumerates user interface tweaks can you make, to improve your conversion rates.

Know Your Audience

An important part of adjusting your site’s design is learning about your potential customers. Understand who they are what their personalities are like. That way, you could adjust your design elements to fit in with them.

You can read more about customer personas in these articles:

New MailChimp User Persona Research

Web Design Tips that Increase Conversions

Having a clear idea of your current users can help you better empathize with them. Combining these tips will not only get people to visit your site, but also encourage visitors to take the next step.

A few design tweaks on your WooCommerce store can set you up for better conversions which will in turn lead to better sales for your business.

6 Things That Slow Down Your WooCommerce Site and What You Can Do To Fix It

April 8, 2016 By John Leave a Comment

If you see that your WooCommerce site visitors are leaving your site not long after they get in, you might want to check if your site is loading fast enough. Slow page loading is one of the primary reasons people leave websites. Studies have shown that a 1-second delay in page response can result in a 7% reduction in conversions. Even Google admitted they hate slow-loading sites and penalize the ranking of slow websites. In this article, we will get into the factors that cause your site to slow down and how you can fix them.

Unoptimized Images

It is critical for WooCommerce sites to have optimized images, specifically product images. The sheer number of product images and alternate images can significantly affect a WooCommerce site’s page speed. You might want to aim for a file size not larger than 100kb. But this is just a rule of thumb. Full-width images are of course an exception. Also always try to use appropriate sizes. For optimum speed, the images should not exceed the size of the placeholder. Lastly, try to adjust the quality of the image. It doesn’t mean you compromise image quality. There are ways to reduce image file size without affecting image quality. You can optimize the image by adjusting some settings and removing some color palettes that are not observable by the naked eye.

We suggest a plugin called WPSmush.it. This is a plugin that automatically optimizes the image as you upload your images through the WordPress Media Library. Still, it is important that you optimize your images before uploading them. Learn more about pre-upload adjustments in our post about image optimizations.

Serving Content without Caching

Content caching is basically preprocessing the files and storing them as static content instead of asking the server for the contents upon each client’s request. The static content can be stored either from an intermediary nearby server (server-side caching) or from the client’s web browser (client-side caching). This practice reduces page load time significantly because it reduces server load and the content is served from a closer location. Caching can improve your website speed by up to 300%. If you are looking for a caching plugin, we can recommend WP Super Cache.

Having Too Many Plugins Installed

Page size is not the only thing that has a direct impact on your page load time. The total number of HTTP requests is a major factor as well. Every image, JavaScript file, CSS file, and jQuery file adds up to more HTTP requests.

This is why having too many plugins installed on your WooCommerce site is not advisable. The same goes for having a theme with a lot of bundled plugins. Plugins can have their own stylesheets and scripts and these add to total the number of requests. Of course, it depends on the plugin. Some plugins have efficient code, but others can have issues with poorly coded PHP scripts. A poorly coded plugin needs a longer server processing time before it completes a calculation. That’s why it is important to only use plugins that you really need. Avoid plugins with too many features that you don’t really need.

Not Minifying Scripts and Stylesheets

Even if you already uninstalled unused plugins, chances are you will still have a couple of individual stylesheets and scripts queued for request. Minifying is a technique made to handle this issue. What it does is combine stylesheets and scripts. So instead of 5-7 stylesheets and 9-12 scripts, you will end with a single file for each type. After combining, it will further compress the files and serve them with gzip compression. This technique reduces the number of requests and page size significantly. Don’t worry about the technicalities of minifying though. W3 Total Cache has Minify together with the caching service.

Plenty of Externally Hosted Content

Another culprit in slowing down a site is having externally hosted content. They can look harmless at first but without moderation, your site will get bogged down by these contents. Your site will only be as fast as your external host server. It is not limited to external videos, audio, and images. External content can also be stylesheets and scripts. One common culprit is the overuse of Google Fonts, so as much as possible try to only use at most 2 font families from Google fonts.

Server Load

Server overload is a common problem, especially for site owners that use shared servers. Shared servers don’t cost that much but they have their limits. Most of these servers can’t handle huge amounts of traffic. One solution is to invest in a pricier dedicated server. Another one is to use a Content Delivery Network (CDN) service. CDN is a system of distributed servers. Basically, you can apply to use a CDN service and they will store your cached site in their server systems across the globe. You can use the W3 Total Cache plugin to easily set up a CDN for your WooCommerce store.

Conclusion

It is important to invest in speed optimization to maintain a good user experience across your WooCommerce store and if you want to keep your SEO rankings. To test your WooCommerce store’s speed, you can use Pingdom’s site speed test or Google’s page speed tool. If your site takes more than 2 seconds to load, you have to make some adjustments. Hopefully, the pointers above will help you achieve an acceptable page load speed.

Was this article helpful? Do you know of any tips to help improve a WooCommerce store’s page load speed? Let us know in the comments.