Making a WordPress Theme: #5

There’s one more thing I want to go over in this series of blogs and that’s the process I took to take the WordPress theme I made on my local server and put it on my live server, right over at www.jonniegrieve.co.uk.

Managing WordPress files

The first thing I want to do is quickly define the root URL of the WordPress installation. Since this will be different to localhost, this domain is the changing aspect of the permalinks around the website. All URLS, all plugins, all images, all of the files will point to my domain rather than localhost.

define('WP_HOME','http://www.jonniegrieve.co.uk');
define('WP_SITEURL', 'http://www.jonniegrieve.co.uk');

So to make WordPress recognise this change the above code will be placed in the config.php file of WordPress. Unfortunately this on its own would not automatically rewrite the hyperlinks and make them work out of the box. There’s another step to take before this will work, but I’ll discuss that later in the blog.

First I’ll upload the WordPress files to my server via FTP.  It’ll go in the root folder of my installation. I’ve made sure to clear any other individual files from the root folder to avoid any clashes or conflicted files getting in the way of the transfer.

Next I need to create a backup of the database by storing it in a text file.  I do this by going into the phpmyadmin of my local host, selecting the database (I named mine jgdm_db) and exporting it into an SQL file.

Now, the database exists as an SQL file with queries that when imported to a database environment create  and manage the database in its current state.

I then go into phpymyadmin for my cPanel, and check that the database I just created is listed.   Once there, I need to import the database from the file I just created.

wordpress-migrate-2.png

If I was to log onto the website at this point, I’d see nothing but a blank screen, if I go to the admin area, I’d get a database connection error.

This is because currently no database for my WordPress installation exists. I just have to set one up on my web hosting account.  I go into “mySql Databases” in my hosting accounts cPanel and Create the database. Since my web host automatically adds a prefix to the name I create, the database will be called jonniegr_jgdm_db.

This can be a tricky part because when I’ve done imports in the past, they have seldom gone smoothly. On this occasion however, I was able to successfully import the data and create a copy of the database on the host server.  One thing I had to do was change the database name in the SQL file to match.

wordpress-migrate

Next, I create a new username and password for SQL and add this user to the database I just created.

I am then able to login to the WordPress Admin area with the same details I used on localhost as these details are stored in the same database,   And…  great. I am now inside the WordPress Admin area.

wordpress-migrate-3

I am able to click and edit posts and pages, access my menu, see that my theme is still installed and in place.  Great!

But, when I click on the link to visit the site.  Nothing appears on the front end.  This means it’s time to update the SITE URL on the admin area and start updating permalinks on back end so links start working properly.

First I’ll add the site_url and wp_home link to the config.php file, the snippet that I shared at the beginning of this post. This will tell WordPress that the website exists in a new location and once uploaded, should be reflected in the general settings of the admin area.

Better search and replace Plugin

Now in order to change the links across the database I’d have to go through each individual entry and change the domain from localhost to jonniegrieve.co.uk.  I don’t think so. I’ll let a plugin do that for me instead.

Once installed and activated, Better Search and Replace will look for a given string and replace it with another, just like using Find and Replace in your text editor.  It finds matches in rows of data and performs the change like below.

In the example only 2 tables needed to be changed.

Table
Found Rows
Updated
wp_postmeta
4
4
wp_posts
27
27

Oh No! The Dreaded WSOD

So that should have been that. But no. Something terrible happened. Not only was I still getting a blank screen on the live server but also on the localhost.  The live server being blank I could possibly understand but I just don’t know what I could have done with the server that could have caused this issue. And because I didn’t know, I couldn’t fix it.  But I still had the files from the installation and access to the admin areas for both but no display on the front end.

I had experienced the dreaded White Screen of Death (WSOD) which is like the blue screen you may have experienced on your computer, only much worse because you get no kind of error message reported at all.  Why this happened, I’m not exactly sure but my guess is a corrupt file in the database in my localhost caused it. A corrupt database which of course I then went on to migrate to my live server.  So after plenty of head scratching, lots of thinking and lots of cursing of bad luck I simply went back to the drawing board.

Starting again was much easier than I anticipated.  I knew there was no problem with the theme I set up, nor with my plugins, which is a common cause of WordPress white screens, so it was simply a case of downloading a fresh copy of WordPress, adding my theme and plugins into it, which had my functions ready made.  I was able to get into the back end of my existing install and copy the content from one admin area to the other.

So… having gone through the entire migration process again and carefully going through it step by step, my new local installation is showing up correctly as well as the life install.  Making sure the navigation links worked as a simple case of making sure the permalink setting was correct in the admin area.

Sources:
https://wordpress.org/support/topic/help-my-website-is-blank-all-disappeared

http://www.webdevdoor.com/wordpress/moving-wordpress-localhost-live-server

https://wordpress.org/support/topic/blank-on-front-end-on-both-localhost-and-website?replies=3  WordPress Support

http://www.wpsitecare.com/wordpress-white-screen-of-death/  – How to Fix The WordPress White Screen of Death

Conclusion

And that’s it. That is the process of creating a basic WordPress theme and migrating it to a live server from localhost. As I said before there’s a lot more to WordPress development than I have touched on in this series of blogs.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s