Deploy a WordPress website using Azure App Services

Reading Time: 7 minutes

Azure App Service, part of the Microsoft Azure Cloud platform is a fully managed service for building, deploying, and scaling your web apps. More details on this service can be located at Azure App Service

In this blog post I will go through the process of creating an Azure App Service plan and a MySQL database to host a demo WordPress site.

  1. Login to the Azure Portal
  2. Search and select App Services using the search box

3. Click + Create

4. Select you subscription from the drop down if you have more than one

5. Create a resource group and click OK

6. Select a unique name for your website domain. A green tick will be displayed if the name is available.

7. Using the run time stack drop down, select PHP 7.4 (Latest version at the time of writing this post)

8. For the the purpose of this demo, I have selected region UK South, and Linux for the Operating System.

9. Create a new service plan and click ok

10. Click change size

11. Review the available tiers. For the purpose of this demo, I have selected the dev/test version. Note that the test/dev version does not include a custom domain or SSL but you can always upgrade plans later. Click Apply,

12. Click Review + Create. Review the details and click Create

13. Deployment complete. Click Go to Resource and review the various options.

14. WordPress requires a MySQL database so let’s create a database. Using the search field, search MySQL and select Azure Database for MySQL servers

15. Click + Create

16. For the purpose of this demo, I have selected Single Server, but you’ll notice Flexible server was in preview at the time of writing this post.

17. Resource Group: I have selected the resource group I created earlier

18. Input a server name, select region and workload type as required

19. Click configure server and explore the various server sizes on offer. For the purpose of this demo, I have selected the cheapest one available. Don’t forget to delete your resources if you’re lab’ing 🙂

20. High Availability (Zone redundant HA) is not available with the tier i have selected.

Availability Zone: You can optionally specify an availability zone in which you deploy your database server to co-locate with your application

HA: provides enhanced availability for your mission critical workloads by deploying a standby server in a different availability zone within the same region as your primary server

As this is a demo, i won’t be configuring HA

21. Select MySQL version and input a database username and password. Click ‘Next: Networking

22. Click + Add current client IP address to add your public IP address to the firewall. Connections from the IP addresses configured in the Firewall rules section below will have access to this server. By default, no public IP addresses are allowed.

23. Click Review + Create. Review the information and click Create. That’s the MySQL Database deployed. We will need to hook the app service plan to the database later.

24. Return to the app service plan we created earlier, click the app service plan.

25. Whilst the MySQL database server is deploying in the background, we’ll connect to our app service via SSH and download WordPress. From the left blade, under Development Tools, select SSH

26. Click Go

27. Type:

cd site/wwwroot/ (enter)

28. We’ll now download the latest WordPress version from WordPress

Type: wget -c http://wordpress.org/latest.tar.gz (Press enter)

29. Type ls to check if the zip file is visible

30. We’ll now unzip the folder
Type: tar -xzvf latest.tar.gz

31. The above process has unzipped a folder name WordPress. We must move all files from inside the WordPress folder to wwwroot

Type: mv wordpress/* /home/site/wwwroot/

32. We can now delete the WordPress folder and the zip file

rm -rf wordpress/
rm -r latest.tar.gz

33. Next, we’ll connect to our MySQL database using the a free application MySQL WorkBench. You can download the tool from https://dev.mysql.com/downloads/workbench/

35. Install the MySQL WorkBench app. If not already installed you’ll be prompted to install C+ + 2019 Redistribute Package before you’re able to install MySQL WorkBench. https://visualstudio.microsoft.com/downloads/#microsoft-visual-c-redistributable-for-visual-studio-2019

36. Now that MySQL WorkBench has been installed, we can connect to MySQL in Azure. Click the plus icon to add a connection

37. Enter your MySQL details

– connection name: select a name of your choice
– hostname
– username
– Password

You can obtain the hostname and username from the Azure portal, search Azure Database for MySQL server, click your server name and copy the server name and username from the overview tab. If you did not make a note of your password, use the reset password option.

38. After inputting the details, test connection. We have a successful connection. Click ok and ok again.

39. Open your connection located under MySQL connections which will launch MySQL editor

40. Click Schemas

41. Right click sys and click create schema (This is required to allow WordPress to communicate with MySQL)

42. Input a name, copy the name to a notepad file as you’ll require it shortly. Click Apply

click apply again and finish

43. Return to your web app in the Azure Portal, click overview from the left blade, and then click browse.

44. WordPress has been detected and the install wizard launches. Select your preferred language.

45. Click Let’s Go

46. Input your MySQL details. The database name is the schema name you just created. The username and hostname (servername) can be obtained from your MySQL database on the Azure portal.

47. Click Submit

48. Success, click ‘run the installation’

49. Input site details and continue. Avoid using username of admin as this is the default for WordPress.

Done, you can now configure your WordPress site

Migrate WordPress posts to new domain

Reading Time: < 1 minuteYou have migrated your WordPress site to a new domain but want all posts to be redirected to the same post on the new domain. So if someone accesses myoldsite.com/blog/sample-post you would like them redirected to mynewsite.com/blog/sample-post

Simple:

On your old domain, locate your .htaccess file using a FTP program such as filezilla

Add the below to the file and save

Replace the domain names as required:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP_HOST} ^olddomain\.com$ [OR]
RewriteCond %{HTTP_HOST} ^www\.olddomain\.com$
RewriteRule (.*)$ http://www.newdomain.com/$1 [R=301,L]
</IfModule>


For example:

If your old domain is myoldsite.com

and new site is mynewsite.com, the code should look like:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP_HOST} ^myoldsite\.com$ [OR]
RewriteCond %{HTTP_HOST} ^www\.myoldsite\.com$
RewriteRule (.*)$ http://www.mynewsite/$1 [R=301,L]
</IfModule>

 

Redirect all WordPress posts to new domain

Reading Time: < 1 minuteYou have migrated your WordPress site including all posts/database to a new domain and would like all URL’s redirecting to the new domain. This can be useful if a visitor locates one of your posts via a search engine and redirects to the same post on the new domain, rather than the homepage of the new site.

For example, when you visit the old post: http://oldsite.com/12/1/30/a-blog-post

You would like visitors redirected to the corresponding post at the new domain: http://newsite.com/12/1/30/a-blog-post

One of the ways you could do this is to amend the .htaccess file on your old wordpress site.

Take a backup of the old site and database

Remove all content from your old .htaccess file and replace with the below:

RewriteEngine on

RedirectMatch 301 /(.*) http://www.newdomain.com$1

All traffic including blog posts should redirect to the correct place on the new website.

If your new blog is not located on the root of the new doamin, for example, it’s now located on newdomain.com/blog, add /blog to the end so it reads http://www.newdomain.com/blog$

Blogroll links homepage only

Reading Time: < 1 minuteIf you want to setup your wordpress site so blogroll links appear on the homepage only, here’s how.

1) Login to your Word press blog admin area
2) Click Appearance
3) Click Editor
4) Click Sidebar located on the right
5) Locate the below code or similar

<?php get_links(‘-1’, ‘<li>’, ‘</li>’, ”, FALSE, ‘id’, FALSE,
FALSE, -1, FALSE); ?>

6) Replace with the below code:

<?php if(is_home()){ get_links_list(); } ?>

Done