wordpress-on-azure-web-apps.md

Digital Marketing POC: Running WordPress on Azure

Table of Contents

• Abstract
• Learning objectives
• How to install WordPress on Azure Web Apps
• Configuring WordPress on Azure Web Apps
• Best Practices for running WordPress on Azure Web Apps
• Creating a sample Post
• Migrating WordPress Site
• WordPress site with MySQL db on IaaS VM
• Adding Custom Domain
• Adding TLS
• Additional Resources

Abstract

Your digital marketing solution allows your organization to engage with customers around the world with rich, personalized digital marketing experiences. Azure provides a scalable, secure, and easy-to-use environment to build your digital marketing sites using WordPress, quickly launch digital campaigns that automatically scale with customer demand, and analyze the effectiveness of those campaigns with data analytics.

Learning objectives

• Understanding the Azure App Service platform and installing/configuring WordPress on Web Apps
• Implementing various best practices to run WordPress on Azure
• Creating a sample WordPress post and publishing
• How to migrate your existing WordPress site from on-premises or colo to Azure
• Deploying a WordPress site with a MySQL database on Azure IaaS VMs
• Adding a custom domain to your WordPress site
• Adding TLS (SSL) to your WordPress Site

How to install WordPress on Azure Web Apps

• Navigate to the Azure Portal.

• Click on + New, type WordPress in the search area, press Enter.

• Select WordPress, click Create.

• Enter an App name (example: fasttrackdemo) for your WordPress site, it will validate to make sure the sub domain name is available under azurewebsites.net.

• Select your Subscription.

• For Resource Group click Create new for this demo (example:fasttrackdemo-test-rg).

• For Database Provider select Azure Database for MySQL for this demo.

• Select App Service Plan/Location, click Create New, enter:

  • App Service Plan: fasttrackdemo-asp
  • Location: West US
  • Pricing tier: S1 Standard

• Click OK.

  

• Select Database, enter:

  • Server name: fasttrackdemo-mysqldbserver
  • Server admin login name: your admin user name
  • Password: your strong password
  • Confirm password: your strong password
  • Version: 5.7 or latest version
  • Pricing Tier: General Purpose
    • Compute Generation: Gen 5
    • vCore: 2 vCores
    • Storage: 5 GB
    • Backup Retention Period: 7 Days
  • Database name: fasttrackdemomysqldb

• Click OK.

  

• Application Insights: Off

  

• Click Create

Configuring WordPress on Azure Web Apps

• Once the WordPress deployment has succeeded, from the left navigation bar in the portal, select App Services, then select fasttrackdemo web app, then click on the URL (e.g. http://fasttrackdemo.azurewebsites.net).

  

• This will take you to the initial configuration page (e.g. http://fasttrackdemo.azurewebsites.net/wp-admin/install.php).

• Select English (United States) and click Continue.

  

• In the Information needed page, enter:

  • Site Title: FastTrack Demo
  • Username: your user name
  • Password: your strong password
  • Your Email: your email address

• Click on Install WordPress.

  

• If all goes well you should see a Success! page.

  

• Click Login. Login with the Username and Password provided in the previous step.

• This will take you to Dashboard page.

  

• To change Themes, select Appearance then Themes. Select Twenty Sixteen then click Activate.

  

• Now visit the site, by selecting Visit Site option from top left corner. This will take you to your website (e.g. http://fasttrackdemo.azurewebsites.net/).

• Your WordPress site should look like this:

  

• Before we add any Posts & Pages, lets configure WordPress with some best practices.

Best Practices for running WordPress on Azure Web Apps

In this section, we will configure WordPress with few best practices.

Disable the ARR cookie

Azure Web Apps make great use of the Application Request Routing (ARR) IIS Extension to distribute connections between active instances. ARR helps keep track of users by giving them a special cookie (known as an affinity cookie) that allows Azure Websites to know upon subsequent requests which server instance handled previous requests by the same user. This way, we can be sure that once a client establishes a session with a specific server instance, she/he will keep talking to the same server as long as the session is active. This is of particular importance for session-sensitive applications (a.k.a. stateful application). Because WordPress is stateless by default and stores all the session information in the database, it does not require clients to connect to the same web server instance. Disabling the ARR cookie will improve performance when running a WordPress site on multiple instances. More info at Disable Session affinity cookie (ARR cookie) for Azure web apps.

To disable the ARR cookie:

• Login to the Azure portal.

• Go to App Services and select you fasttrackdemo web app.

• Select Application settings, find ARR Affinity and click Off.

  

• Click Save on the top.

Azure Blob storage for Media Content

If your WordPress site consists of a lot of video and image content, we recommend using blob storage to store all your media content. To learn how to create an Azure storage account, see How to create an Azure storage account. Once you have created the account, activate and configure Microsoft Azure Storage for WordPress plugin for your WordPress website.

• Make sure to Create a storage account and a blob container using Azure CLI first before proceeding to next step. Remark: when creating the container make sure you set the access level to Container so that users visiting the WordPress site can see the actual media content. Important: There is a known issue with Microsoft Azure Storage for WordPress plugin, when you create storage account using Portal, so its recommended that you provision Storage Account using CLI.

• Once the storage account is created, go to the WordPress site Dashboard page. For example: (http://fasttrackdemo.azurewebsites.net/wp-admin/)

• Click on Plugins, then Add New

• In the Search plugins, enter Microsoft Azure Storage for WordPress

• Click Install Now

  

• Once successfully installed, Click Activate

• From the WordPress Dashboard page, go to Settings, click Microsoft Azure, enter the following:

  • Store Account Name: your storage account name
  • Store Account Key: one of the storage access keys
  • Use Microsoft Azure Storage for default upload: check this box

  

• Click Save Changes

• After clicking save you should see the Default Storage Container setting being populated with the container you created when preparing the storage account.

• From now on if you upload any images, audio or video files to your WordPress site (part of your Posts or Pages), they will be uploaded to the Azure storage account automatically instead of being stored in the Web server. You can verify this once you upload an image, by going to your storage account and verify the container contents.

Configure Redis cache for WordPress to improve performance

You can use Microsoft Azure Redis Cache with a WordPress site to improve performance. Websites that receive massive amounts of user traffic (hundreds of thousands to millions of page views and unique visitors) will benefit from the use of a distributed caching solution such as Redis cache. To setup Redis cache and connect to the WordPress site

• Create Azure Redis cache from Azure portal

  

• After successfully creating Redis cache, note down the Host Name & Primary Access Key. We will use these values in the following step

  

• Install WordPress Redis Object Cache plugin

  • Go to the WordPress site Dashboard page
  • Click on Plugins, then Add New
  • In the Search plugins, enter Redis Object Cache
  • Click Install Now

  

• After installation, make sure to click Activate

• Connect to the Redis cache by updating the wp-config.php configuration file

  • To edit the wp-config.php file, go to the Web App Kudu console, by selecting Web App --> search Kudu --> Advanced Tools --> click Go

  

  • Select Debug console, then click CMD

  

  • In the CMD, navigate to D:\home\site\wwwroot folder
  • Edit wp-config.php

  

  • Add the following right before "That's all, stop editing! Happy blogging."

  /* Redis Cache */
  define('WP_REDIS_SCHEME', 'tls');
  define('WP_REDIS_HOST', '<your redis account name>.redis.cache.windows.net');
  define('WP_REDIS_PORT', '6380');
  define('WP_REDIS_DATABASE', '0');
  define('WP_REDIS_PASSWORD', '<your primary access key>');
  

  

  • Click Save on the top

• Verify the Redis Cache is connected

  • Go to the WordPress site Dashboard page
  • Click on Settings, then Redis
  • Click Enable Object Cache
  • Status should be: Connected

• Other Performance Best practices: There are only few best practices mentioned above to give you an idea on how to get started. You can find additional best practices using the following resources, keep in mind you may not need all the best practices, select best practices based on your need:

  • Use Azure CDN for WordPress site on Azure App

  • How to speed up your WordPress site on Azure App Service

Configure CDN for WordPress to improve performance

Azure CDN can increase the performance and stability of your WordPress blog by caching static content on edge servers closer to users. Please see the Azure CDN Overview for more details.

To configure CDN in WordPress, follow these steps:

1. Create an Azure CDN profile
2. Map a custom domain such as cdn.my-company-blog.com to your CDN profile
3. Install a CDN plugin
4. Configure your CDN plugin to use the custom CDN domain for cached content. Two popular plugins available in the WordPress plugin repository are WP Super Cache and CDN Enabler.

WP Super Cache Configuration:

CDN Enabler Configuration:

Creating a sample Post

To create a sample post, follow these steps:

• Go to the WordPress site Dashboard page

• Click on Posts, then Add New

• Enter a Title (Example: "FastTrack for Azure Demo post")

• In the Content field, enter your post details (Example: "Welcome to the FastTrack for Azure Demo post. One stop shop for Azure onboarding")

• Click on Add Media and upload any picture from your machine. Once the picture is uploaded, click on Insert into post.

• Finally click on Publish

  

• Your post can be viewed on your home page using a link similar to this: http://fasttrackdemo.azurewebsites.net/

  

• Now if you head over to the Storage Account in the Azure Portal, the image you uploaded as part of your post can be seen under Storage Account > Blobs > Container > Year folder > month

  

Migrating a WordPress Site

To migrate a WordPress site from your on-premises environment or from colo or from another Azure Web App, follow these steps:

There are two main steps involved in migration:

1. Copying the WordPress site content (wwwroot directory in the Azure Web App)
2. Importing the MySQL database

Copying WordPress site content

Simply zip your WordPress site content from on-premises. For example if your WordPress site is running on another Azure Web App, using Kudu > CMD console, download wwwroot directory as zip file.

• Next step: import the wwwroot directory in to the Azure Web App using the Kudu console. To do this simply drag your content zip file (example:wwwroot.zip) from your desktop folder on to the Kudu console Size column. This will extract the content in that directory.

  

Importing the MySQL database

• Now export your MySQL database. You can use tools like phpMyAdmin (web interface) or MySQL WorkBench. For example: phpMyAdmin is offered as an Azure Web App site Extension. It comes preinstalled if you created the WordPress site from the gallery as explained in the beginning, otherwise you can install it and use it to export your MySQL database.

  

• Next step: import your MySQL database. Again you can use tools like phpMyAdmin (web interface) or MySQL WorkBench. From phpMyAdmin, go to the Import tab, select the MySQL file you exported in the previous step and click Go.

  

• One last step, you may need to go to the wp_options table using the phpMyAdmin (web interface) or MySQL WorkBench, to replace the old site URL address with the new site URL address.

  

WordPress site with MySQL db on IaaS VM

Normally when you create a WordPress site using Azure Web Apps you are presented with an option to select an existing or create a Azure Database for MySQL. But what if you don’t want to use an existing instance or create a new one? What if you want to use a MySQL database instance deployed to an Azure VM.

The easiest approach is to create a WordPress site with Azure Web Apps and select an existing/create new Azure Database for MySQL database. Once the WordPress site is deployed, you can then change the database connection string via Web App > Application Settings > Connection string or edit the wp-config.php file to be the database you want (e.g. a MySQL instance on an Azure VM). Here are the steps to follow:

• Let the WordPress site be deployed, but do not complete the installation/configuration. In other words, once the site is deployed, browsing to the site’s URL should result in the standard WordPress default installation prompt.

  

There are two ways to update the database connection string:

1. Edit App Settings Connection string via the Azure Portal (Recommended approach)

   • Using Azure Portal, go to your Web App > Application Settings > Connection string
   • Click on (hidden for Security) and update the DefaultConnection string with MySQL on IaaS VM values.

2. Edit the wp-config.php file via Kudu (not recommended)

   • Open the Kudu console by going to http:[your-site-name].scm.azurewebsites.net (example: http://fasttrackdemo.scm.azurewebsites.net/)

   • In the CMD prompt, navigate to the D:\home\site\wwwroot directory

   • Edit wp-config.php

   • Change the following values: DB_NAME, DB_USER, DB_PASSWORD, DB_HOST with MySQL on IaaS VM values. Important: as you can see, by default these values are read from Web App's App Settings Connection String instead of being hard coded here. So it's recommended to update the App Settings Connection String instead.

Adding a Custom Domain

There are two main steps to add a custom domain to your WordPress site

1. Buy a custom domain from Azure and configure your web app or Use an existing domain to configure your web app
2. Update the WordPress site to resolve to the new domain

Updating the WordPress site to resolve to the new domain can be done in 2 ways:

1. Using WordPress dashboard. Update Settings > General > WordPress Address (URL) & Site Address (URL). This might be greyed out and may not allow you to update for multiple reasons (example: updating wp-config.php).

   

2. Update the database directly using the phpMyAdmin extension.

   • First install the phpMyAdmin extension if it's not yet installed, by going to WebApp > Extensions > Add phpMyAdmin

     

   • Once you install phpMyAdmin extension, browse to it. It should take you to the phpMyAdmin web interface (for example: https://fasttrackdemo.scm.azurewebsites.net/phpmyadmin/)

   • Expand your MySQL database from the left tree, open up the wp-options table and update two records (Column: option_value) where option_name = siteurl & home. This value should be your custom domain.

     .

Adding TLS

To add an SSL certificate binding to your WordPress site, follow these steps:

• Bind an existing custom SSL certificate to Azure Web Apps
• Buy and Configure an SSL Certificate for your Azure App Service
• HTTPS for WordPress

Additional Resources

• Running WordPress on App Services (Windows/Linux)
• Best Practices for WordPress Security on Azure
• Single Sign On with ADFS/Azure AD/Windows Plugin