Wordpress get_template_directory_uri() behind load balancer

Question

I have a Wordpress website running on an AWS EC2 instance. This is served through an AWS Elastic Load Balancer, which has HTTPS enabled with a certificate I got from Amazon.

The intention is to serve both an http and an https version of the website. Loading the http version works fine.

When I load the https version however, I'm getting mixed content errors because get_template_directory_uri() always returns http links. The way the load balancer works is the TLS terminates at the LB, and it communicates with the actual EC2 instance over port 80. therefore, there is no HTTPS on the instance itself.

A lot of this is beyond my skill to heal. I know just enough to have figured out what the problem seems to be, but I'm really not sure what the right way to fix it is.

Assuming I still want to serve both http and https versions of the page (there is no ecommerce or auth on the page -- it's just informational), how should I go about fixing this?

FYI, the EC2 instance is running on an Amazon ABI, which is basically RHEL.

Answer 1

So first off, you will find it difficult to run both an http and https WordPress version off the same database data because WordPress saves a lot of links as absolute links (ie with the http(s)://mydomain.com part) and a lot of plugins just don't bother adapting to the current protocol either.

Your best bet is going to be doing redirects through your htaccess file to redirect all http traffic to https.

That being said, one way you could do what you asked for is through a filter used by get_template_directory_uri:

add_filter('template_directory_uri', 'smart_template_directory_uri', 10, 3);
function smart_template_directory_uri($template_dir_uri, $template, $theme_root_uri) {
    return preg_replace('/^https?\:/i', '//', $template_dir_uri); // replace "http://" or "https://" by "//", which browsers will automatically set to the current page's protocol
}

Hope this helps!