Posted in by Tudipat 06:06Comments Off on Moving WordPress site to HTTPS
Moving WordPress site to HTTPS
Tudip
24 June 2016
You have this site which was working fine on http://example.com and next, you moved it to https://example.com and the UI is all messed up. And you have to fix it. How do you do that?
Problem:
First, the reason behind it. When you moved it to https, there are few CSS/JS files that are still coming from the URL that is http://example.com and hence browser is blocking them. You can not have anything coming from HTTP on an HTTPS site without asking user.
Solution:
In order to fix it, follow these steps:
CDN/CSS URL paths have hardcoded HTTP
Check your theme files. If you are using CDN or even your site URLs to include JS/CSS, you would have to change them to HTTP/HTTPS depending upon what is the current protocol. Here is a simple PHP code snippet that would tell you if you are on HTTP or HTTPS.
If you are including JS files from the theme itself, use the syntax below as get_template_directory_uri() function takes care of switching between HTTP or HTTPS.
Almost all the plugins include their own JS/CSS files. Most of the time they work fine but those plugins are written by developers like you and me. There might be some oversight in their JS/CSS inclusions too. The most common one is this call:
get_options('site_url')
The above call does NOT take care of switching between HTTP and HTTPs. Replace this line with:
site_url();
Other places
The above steps should fix the UI but user might still get a warning about HTTP content being served over HTTPS. Make sure that you check all the img srcs tags and change them with the proper protocol.
All content provided on this blog is for informational purposes only. Tudip Technologies provides no endorsement and makes no representations as to accuracy, reliability, completeness, suitability or validity of any information or content on, distributed through or linked, downloaded or accessed from this site. Tudip Technologies will not be liable for any errors, omissions, or delays in this information or any losses, injuries, or damages arising from its display or use of the information on this site. All information is provided on an as-is basis without any obligation to make improvements or to correct errors or omissions. This site may contain links to other websites. Tudip Technologies makes no guarantees or promises regarding these websites and does not necessarily endorse or approve of their content. You may not modify any part of the blog. The inclusion of any part of this blog in another work, whether in printed or electronic or other form, or inclusion of any part of the blog in another website by linking, framing or otherwise without the express permission of Tudip Technologies is prohibited. This site may not be used for any illegal or illicit purpose and Tudip Technologies reserves the right, at its sole discretion and without notice of any kind, to remove anything posted to this site. By using this site, you hereby acknowledge that any reliance upon any materials shall be at your sole risk.