How to Upgrade a WordPress Website, the Proper Way.

One of the most common complaints we hear about WordPress users is that their site breaks after updating. The resulting downtime causes profit losses, and can sometimes go unnoticed for weeks or months. Did you know that downtimes and bugs are completely preventable?

This article is written for everyone, and targets anyone working with WordPress. Our method for upgrading WordPress is best with a large format UHD/4k screen, and can be adopted to add or remove steps based on needs. Specifically, we are often asked to provide additional bug testing to prevent problems.

The process is actually fairly easy. Though, there are numerous exceptions and configurations that can cause problems. We suggest a competent WordPress developer to perform the steps.

Proceed At Own Risk

Warning: Some steps are mandatory. Please back up before modifying production.

Failure to do so can result in data or system loss.

Perform all updates at your own risk.

Index

Requirements

It is important to have access to the WordPress site with an Admin account. Access to the site’s web hosting admin is also recommended. CDN admin access might also be necessary.

A staging site needs to be set up and accessible. It should be refreshed with the latest copy of production, and it should be functional.

Recommended Equipment

To do a proper upgrade, we recommend using a TV or large format monitor as your screen of 40 or more inches. Ultra-high definition 4k, is recommended because it makes each of the 4 sections approximately the same size as a high definition monitor.

How To Update the Proper Way (12-Steps)

Stop!

Staging must be updated with the Recent Version of Production!

Failure to backup might result in data loss.

1) Login to Staging

We provide a guide to logging into WordPress if you need it.

2) Update WordPress on Staging

Enter the WordPress Dashboard Update

Update Staging by entering into the dashboard. The link for the dashboard can be found on the top menu (if it’s shown) and under the sub menu website name. You can then find the updates by clicking on the submenu “Updates” found under “Dashboard” on the left. If it doesn’t exist, you may not need to update your site.

When in the Dashboard, Click the link found on the left named, “Plugins” or the sub menu item, “Installed Plugins”

Alternative: You may also amend “/wp-admin/update-core.php” to your staging website root path (ex. “https://staging.somedomain.com/wp-admin/update-core.php”) and enter it into the address bar of the browser. It should take you directly to the website.

Note: WordPress Installs in Directories need to adjust appropriately.

Update

Click the select all checkbox, selecting all the plugins. Then click the “Update Plugins” button. Wait until the service finishes. Do not close your browser or push refresh!

3) Clear Staging Website Cache

Clear WordPress cache. Many of these cache settings can be found on the top menu under caching plugins (example: “WP Rocket”)

You may also clear it in many hosting provides settings. CDNs might also need to be cleared, though many plugins and hosting providers can do this for you (if setup).

4) Clear Browser Cache

Clear your browser cache. We will be adding this in the upcoming months.

5) Test the Staging, Updated Website

Go through and test the staging site. Test any forms. Some forms, such as payment forms, may stop working unless you turn the testing on of that plugin. In numerous instances, this might not be necessary or may be moved to after the production site is updated.

6) Compare the Websites

For Windows Users: Click on your browser’s main bar, and drag the entire window to the side of the screen, causing the browser to fill half the monitor. Then repeat with a single tab of the browser to the other side of the screen. Resulting in two copies of the site being loaded on each half of the screen. One should be the updated staging website, while the other should be the live.

Go through each critical web page and note any changes to the site. Does anything change? You’ll need to debug the problems you find. Hire a software developer to fix problems you find.

Additionally, you may want to compare the mobile versions. Most browsers provide mobile simulations on desktop that can be repeated in both comparisons. Using a 4k, Large Format Screen (as shown in screenshot) is recommended.

Problems?

Check the Browser Zoom. They both should be the same, or one version might appear larger than the other side.

7) Turn on Server Downtime Notice (Optional)

You may want to use a server downtime plugin if reverting to this backup might cause data to be lost. For instance, social services and shopping services may want to do this to prevent an issue. Blogs usually can skip it.

8) Backup Live Website

Back up your production or live server before starting. Do not continue or skipping without this step. Use hosting service if you desire, or backup plugin.

9) Update Live Server

Follow the notes you made in step 2 and repeat the process the exact way, this time on the live site.

10) Turn off Server Downtime Notice (Optional)

In step 7, we may have turned on a downtime notice plugin or feature. Make sure to disable this.

11) Clear Live Servers Cache

Repeat the process for clearing cache on the live server as found in step 3 and deploy any changes to the code. This includes any settings changes made in response to bugs found in step 6.

12) Test Production

In most cases, this step can be minimal, but should ensure that the updates are taken, or the update steps are repeated. Additional testing can be performed on live of any services we didn’t test on staging.