CODEWITHSUNDEEP
wordpress.htaccesshttpsslhttps
Radek
Radek

Reputation: 1189

Load CSS and JS over HTTPS in Wordpress

One of my websites is in Wordpress. I setup SSL on the site. I would like the entire site be loaded via HTTP except 1 page lets call it PAYMENTS.

How can I achieve in Wordpress when I click in the menu PAYMENTS it loads it over HTTPS and also load all CSS and JS over HTTPS. Because when I did manually in the url: https://www.example.com/payments/ it loads without any CSS and JS because its all blocked due its loaded over HTTP in the source.

Also want to achieve that if I click in the menu any other item and it goes back to HTTP.

Upvotes: 2

Views: 10242

Answers (2)

Dave Ross
Dave Ross

Reputation: 3491

You can get WordPress to use Protocol-Agonstic paths for CSS & JavaScript by adding this to your theme's functions.php:

add_filter('script_loader_src', 'agnostic_script_loader_src', 20,2);
function agnostic_script_loader_src($src, $handle) {
    return preg_replace('/^(http|https):/', '', $src);
}

add_filter('style_loader_src', 'agnostic_style_loader_src', 20,2);
function agnostic_style_loader_src($src, $handle) {
    return preg_replace('/^(http|https):/', '', $src);
}

Note this won't be respected by plugins like Better WordPress Minify that change how scripts & styles are included in the page, and this technique won't work with IE6 (which shouldn't be a concern these days anyway).

Upvotes: 8

Calvin deClaisse-Walford
Calvin deClaisse-Walford

Reputation: 591

Use agnostic paths to your CSS and JS, e.g. // instead of http:// when you are calling them. Also, a great plugin called WordPress HTTPS can do the one-page-only https for you:

Upvotes: 0

Related Questions