The average eCommerce website earns around $330,000 per month by the end of its first year, but one mistake during an update or plugin installation can cost you your piece of the eCommerce pie. Thankfully, you can avoid that if you test your WordPress and WooCommerce plugins in staging.
This article explains the process of creating a staging website to test your WordPress and WooCommerce plugins so you can avoid costly mistakes. It will cover:
- What staging is
- Why you should test WordPress and WooCommerce Plugins in staging
- How to properly test WordPress and WooCommerce Plugins
- The Tools You Need When Testing Your WordPress and WooCommerce Plugins
- Checklist for Testing WordPress and WooCommerce Plugins and Updates
- The Role of Automated Scripts in WordPress and WooCommerce Plugin Updates and Installations
What is staging?
In WordPress, staging refers to an offline clone you design of your WordPress site to test. It’s an excellent tool for testing your website and plugins without affecting what your website visitors see.
The offline clone serves as your testing site and a backup site. The timing of the backup and cloning is dependent upon the size of a website, but plugins offer a simple solution. In only seconds, you can create a clone of your website, so you can perform updates and install WooCommerce plugins effortlessly.
Why should I test WordPress and WooCommerce Plugins in staging?
Staging is essential when you update your website because it can prevent your website from:
- Becoming unavailable
- Working on some devices and not others (i.e., working on Apple devices but not Android or working on laptops but not on tablets).
- Losing accessibility of essential pages (like the checkout page, product reviews, or contact forms)
- Losing accessibility of the mobile menu
- Losing the site’s footer
- Displaying the horrifying “White Screen of Death” (WSOD)- a phenomenon that involves your website only showing a blank white screen.
There are many ways that launching updates to your website could go wrong, and if you have a high volume of traffic and don’t know the site isn’t functioning correctly, you could lose tons of sales! Launching updates is one task that could drive you crazy if you don’t approach it with a plan in mind.
To avoid all the hassle, test your updates and plugins before publishing them. You’ll enjoy many benefits by testing, including:
- A smoothly running website
- A fast and secure website
- Your website visitors’ trust.
How to Properly Test WordPress and WooCommerce Plugins
Website development is a long-term game. Throughout the life of your website, you’ll likely launch several new updates and plugins, which can become monotonous. Some might even say it’s annoying, but you can avoid the annoying monotony by using the right tools and a checklist of all the steps you should take before and after an update.
*Please remember not to update your WordPress site on a Friday. You’ll avoid tons of potential chaos and problems for the weekend.
The Tools You Need When Testing Your WordPress and WooCommerce Plugins:
- Full-page Screenshot Tools: Use a full-page screenshot tool before and after installing the plugin or update.
- Staging Site: This is your cloned website.
- Automated Script Testing: Automated script testing tools automatically test multiple scripts throughout your website after your update or plugin is installed to ensure everything works the way it should.
- Screenshot Comparison Tools: Screenshot comparison tools allow you to compare the before and after screenshots you take so you can spot any inconsistencies.
3 Screenshot Tools to Simplify Your Work
Browserstack’s screenshot tool makes it easy to generate screenshots with the click of a button. All you need is to select the device types and browsers (up to 25) you want to check your URLs on to use the tool. The tool does the rest.
TestingBot’s screenshot tool allows you to choose from over 3,200 combinations of browsers and devices to test. The tool offers screenshot comparison, beta and dev builds, and a native debugging tool.
CrossBrowserTesting’s screenshot tool allows you to take screenshots using the web app or their API. When using the API, you can take multiple screenshots at one time across your URLs.
Checklist for Testing WordPress and WooCommerce Plugins and Updates
1. List any of your premium plugins and themes that aren’t updated automatically.
2. Visit the site where you bought your plugins and themes and look for the most current version of the item.
3. List the URLs you’ll test after updating. You’ll want to include your custom post-type templates, WordPress templates, and your website’s primary pages (like your contact page, homepage, product pages, category pages, and checkout page).
4. List scenarios for testing. For instance, a user might log in, go to the products page, then the checkout page. You’ll want to test any scenarios relevant to your website.
5. Create a list of test scripts for testing the scenarios.
On your staging site
1. Duplicate your whole website to a staging environment while ensuring that MySQL and PHP are the same on both websites. Depending upon your hosting provider, you might have one-click staging creation. A few hosting providers that offer one-click staging creation are WPEngine, SiteGround, and GetFlyWheel.
2. Ensure the staging site matches the original website. You can do this with a glance around the site.
3. Take screenshots of all your URLs using the full-page screenshot tool. Ensure you get screenshots of all systems, such as Chrome, Firefox, Safari, Edge, Android, and iPhone. There are some tools to simplify this process.
4. Update the following:
- Theme and Plugin files
- WordPress core files
- Any items that don’t update automatically.
5. Take screenshots of the updated staging website. Once again, take screenshots from all URLs and systems.
6. Use your screenshot comparison tool to compare the before screenshots from step 3 and the after screenshots from step 5.
7. Run the test scripts you listed before. Ensure your forms, checkout, and other vital pieces of your website are operating smoothly.
On your live site
1. Perform a backup of the live site.
2. Create screenshots of all the URLs.
3. Update the live site.
4. Look to see if everything is updated in the backend. Click refresh to see if the update failed for anything on the site.
5. Clear your live site’s cache.
6. Create your screenshots.
7. Compare your screenshots from step two to the ones from step six.
8. Run the test scripts you listed earlier.
9. Check your website with a quick visual check.
10. Pat yourself on the back!
The Role of Automated Scripts in WordPress and WooCommerce Plugin Updates and Installations
Automated scripts make testing your WordPress website simple, but there are other options. The first is to check manually. The other is to hire a developer.
Creating a testing script can be time-consuming, but it’s a pretty straightforward process to reuse the script once it’s made. Here are the advantages of testing scripts over manual testing:
- Testing scripts eliminate human error.
- They save you time in two ways:
- When running long scripts, you can let the script handle the checking while focusing on what the scripts can’t do.
- You can test up to 2 devices and 4 browsers at one time.
The key takeaway is that testing your WordPress and WooCommerce plugins in staging can save you from a catastrophe. The process is relatively straightforward, and, armed with this checklist, you’ve got everything you need to have a successful update.
Whether it’s providing you with the necessary steps to bulk-install your plugins or performing WordPress or WooCommerce maintenance, we’re committed to helping you thrive in eCommerce. If you would like us to manage your WordPress so you can focus on the core aspects of your business, contact us today, and we’ll be glad to help!