Do you want to learn how to fix WordPress bugs like a pro ? Do you want to know how I personally go about fixing WordPress errors with confidence during my professional services? If so, this article is for you!

I've been offering my services for a while on the freelancing platform ComeUp (formerly 5euros). I decided to write to you today to share with you my little experience I had on ComeUp on fixing bugs on WordPress sites.

This article will take the form of a tutorial, in which I'll tell you a little about how I've managed, time after time, to effectively resolve the bugs or problems encountered by my customers' websites.

I hope it will be both instructive and motivating to know that nothing is impossible when it comes to dealing with bugs on WordPress websites.

Come on, let's gooo 🚀

 First of all, make a Backup of the website to be maintained

Yes, the very first thing you need to do before correcting anything is make a backup of the site with bugs, or make sure it already exists on the host where the customer's site is stored.

This will enable you to keep a copy of the site (files and database) safe in case something goes wrong.

This is crucial, because in trying to fix the bug, you can either create more bugs or break the site completely. Should this happen, simply restore the backup and the site will return to its original state.

#1. Change the color and font of elements on a WordPress site

One day, a customer contacts me to let me know that certain elements of his website have a color and font that don't match the site's general graphic charter.

In fact, the elements in question are the buttons and texts on the pages generated automatically by Woocommerce.

So I had to find a quick and efficient way to change the color and font of these elements to match the site's overall graphic identity.

Resourceful as I am, I went straight to the WordPress extension library and installed the plugin Simple Custom CSS and JSwhich will allow me to inject custom CSS into the site.

Then, using the Google Chrome browser, I inspected the problematic elements (right-click and Inspect). This allowed me to retrieve the CSS classes for these elements.

Now that I have the CSS classes, I simply added custom CSS code in the previously installed extension. The CSS properties I used were color (to change the color) and font-family (to change the font).

To give my CSS rules priority, I added the keyword !important at the end of each rule.

PS : Note that to add custom CSS you can also use the plugin Code Snippets which I mentioned in the article on how to add custom code to WordPress.

Example:

.classCSS {
   color: green !important;
   font-family: 'Roboto', sans-serif !important;
}

That's how I was able to correct the bugs. Satisfied customer. Positive feedback ✅

#2. Divi does not take into account modifications made to the site

As you already know, Divi is one of the most popular themes in the WordPress universe. It's one of my favorites... Its page builder and ready-to-use templates give me an incredible productivity boost when creating a site.

One day, a customer contacts me to let me know that he's in the process of customizing his site made with Diviand he's just encountered a problem he doesn't understand at all...

I ask him to explain the problem in question... He tells me that he's been making changes to the site for some time, but that these changes are not taken into account when he saves and views the site in normal view. The modifications are only taken into account in the page builder of Divi.

On reflection, I tell him that it's certainly a cache problem. He says no no, I've already tried everything... Empty the browser cache, update Divi, open the site in a private tab, etc... But to no avail.

To solve the problem quickly and efficiently, you know what I did? Quite simply, I emptied the CSS cache that Divi automatically generates 😀

To do this, simply go to Divi settings and clear the cache... Theme options > Creator > Advanced > Clear.

This is how I corrected the bug in question. Satisfied customer. Positive feedback ✅

#3. Woocommerce Cart Page does not display anything

A customer contacts me to let me know about the bug his ecommerce site is experiencing... When the Shopping Cart page is accessed and there are no products in the cart, the page displays absolutely nothing, not even a small message.

Instead of a blank page, the customer would like to see a small message like " Your basket is empty ".

To fix this bug quickly and efficiently, I had to install the plugin Code Snippetswhich allowed me to add some custom PHP code.

To do this, I created a new snippet from the plugin and added the code below as content:

<?php

    if ( WC()->cart->get_cart_contents_count() == 0 ) {

        echo '<div>Votre panier est vide 🙁<div>';

    }

?>

Basically, the code above checks if the cart is empty, then displays the message "Your cart is empty 🙁"

For my code to be executed, I retrieved the shortcode generated by the plugin and placed it in the Shopping Cart page.

Problem solved. Satisfied customer. Positive feedback ✅

#4. Sidebar shopping cart

I'm sitting quietly at home, trying to enjoy the sweetness of life... Then a client contacts me about my WordPress bug-fixing service.

His concern? He owns an e-commerce site and has just visited the e-commerce sites of his competitors. They have an attractive feature that he'd like to have on his own site too.

The functionality in question is a basket displayed as an opening and closing sidebarwhich appears on the right-hand side of the screen. It can be opened by clicking on a small basket icon, which remains frozen on the page in the bottom right-hand corner. It also opens automatically each time a new product is added to the basket.

To satisfy his request, I went to the WordPress plugins directory to install the plugin CartPopsI then configured and customized it according to the customer's preferences.

Problem solved, functionality successfully added. Satisfied customer. Positive feedback ✅

#5. 3-Fold Payment System

Here we go again... I receive a notification ComeUp letting me know that I've just received a new message.

This is a customer who wants to add a new feature to her Woocommerce store. The feature in question is 3-installment payment system.

For those who don't know, the Payment in 3 instalments (or Partial Payment) consists in spreading the payment of purchases over 3 instalments. These payments are automatically deducted from the customer's credit card until the full amount of the order has been paid.

To satisfy his request, I subscribed to the services of Molliewhich is an online service that facilitates online payments for businesses.

They have an option called Klarna Pay Later "Click here to activate payment in 3 instalments.

To connect Mollie to Woocommerce, I simply used their official plugin Mollie Payments for WooCommerce.

Please note that there are other services that allow you to integrate 3-installment payment... Notably Alma and Partial.ly.

Problem solved, functionality successfully added. Satisfied customer. Positive feedback ✅

To conclude...

WordPress is a CMS made with programming languages HTML, CSS, JavaScript and PHP. As soon as a tool is made of a programming language, it is succeptible to errors or bugs.

Fortunately, there's no such thing as a bug without a solution... Throughout this article, we've seen the bugs my clients' sites have encountered and how I've managed to overcome them.

Thank you for taking the time to read this little tutorial on my experience in WordPress bug fixes on ComeUp. 🙏

I hope you enjoyed it and found it useful. Don't hesitate to give me your feedback on this tutorial, and also share with me in comments any WordPress bugs you've had to solve.

It will be a delight for me to read you 😁