How to Have Parallel WordPress on EC2 and Static Website on the Same Domain

We’re going to use subdomains!

Example: This site.

My main domain is robolab.io

I have a subdomain of that domain, and it’s labs.robolab.io

Notice how the first one is a WordPress site, which runs on an AWS EC2 instance, and the other is a static website hosted on AWS S3. This is useful so you don’t need a 2nd domain or external website to host your files– it can all live on the same domain. Also, you bought your domain for a reason, right? It’d be nice to use it.

WordPress on EC2

I’m not gonna walk you through this– there’s a oneclick install of WordPress to EC2 (thanks to “Bitnami” or whatever) and it’s pretty self explanatory. Some related articles to using Bitnami EC2 Oneclick install: Removing that Annoying Bitnami Logo.

You should have your domains on AWS Route 53. Bonus points for registering your domain through there, since it’ll set up all your hosted zones for you if you do. Less work!

Assuming you’re at the point where you have example.com, your WordPress site, all ready to go, think of a subdomain name you want to use. For this example we’ll use: subdomain.example.com.

Go to AWS S3, and create a bucket named (with your own website and subdomain, of course): subdomain.example.com. 

Go to the Properties tab of this bucket, and go to Static Website Hosting. Choose “Use this bucket to host a website.” Note that you can also just host a regular old root domain website here, such as example.com, and it’s pretty much the same steps. But this writeup is about parallel EC2 and S3 on the same domain.

Set up your index document, something like index.html or whatever you want. The error page is good to have but not required. Then press save.

Now, head over to Route 53.

Click on your hosted zone for example.com. If you don’t have that, get yourself to the point of having a working website set up on Route 53 and come back to this point.

Press Create Record Set. For Name, make it match the bucket you made. Type is A. Alias is Yes. Click the Alias Target field and wait for it to populate. You should see, after 10 seconds or so, subdomain.example.com show up. If you don’t, you did something wrong. Scroll down to the “Not working?” section of this article and try those things real quick and see if it works.

If you clicked that, press Save Record Set. Now, if you go to your subdomain.example.com, if you set it up right, it should take you to your index.html that you specified in the S3 bucket.

PLEASE NOTE: Trying www.subdomain.example.com will not work yet. You need to do a tiny bit more to get it to work when you type in www in front of the URL. Refer to this post to get that working.

That should be it.

Make sure you have some stuff in your bucket so you can see if it’s working. Here’s what mine looks like right now:

Notice that labs.robolab.io goes to my index.html (since we set it up that way!) and labs.robolab.io/hax goes to whatever’s in that /hax folder.

Not working?

Try setting a bucket policy.

Go to your s3 bucket and in the Permissions tab, copy and paste the following code AFTER replacing the “Resource” url below. See subdomain.example.com ? Switch that out with YOUR bucket name.

{
 "Version": "2012-10-17",
 "Statement": [
 {
 "Sid": "AddPerm",
 "Effect": "Allow",
 "Principal": "*",
 "Action": "s3:GetObject",
 "Resource": "arn:aws:s3:::subdomain.example.com/*"
 }
 ]
}

Be careful not to mess up anything about the syntax. Quotes, brackets, characters, and spacing all matters.

You sure you’re not trying WWW?

Type your subdomain.example.com without the www in the beginning. You need to handle this a little bit differently which is outlined in this post.