Some CSS not loading over HTTPS/SSL

[vincebodie]

See our site here:
http://fusionwellnesspt.com/

Notice the social icons in the upper right, and the footer content including site stats.

Now look at the site over SSL:
https://fusionwellnesspt.com/

Checking it in Firebug over standard http, the CSS file 'plugins/system/social_presence/social_presence.css' loads fine, but it does not load over https.

Any ideas?

[Per Yngve Berg]

Is it loaded over https or it still http?

[vincebodie]

Is it loaded over https or it still http?

By "it" I assume you mean the CSS file? I assume that when a page loads over https, all resources try to load over https as well, and that particular file cannot load for some reason. Am I wrong?

[Per Yngve Berg]

Not if it is hard-coded with http

[vincebodie]

Not if it is hard-coded with http

And just how might this happen?

[Bernard T]

You have mixed HTTP and HTTPS content, take care to properly enforce HTTPS links on HTTPS version of your website. That's why "social_presence.css" and two other CSS'es are being blocked by browsers.
Also, think about switching to HTTPS-Only

MOD: Not a security issue, moving to a more appropriate subforum

[vincebodie]

I am agree with Bernard T.

I'm glad you agree with Bernard, but nobody has explained how HTTP and HTTPS content is getting mixed up in the first place. Are you saying there are HTTP links hard coded into some files, and when those files are loaded over HTTPS, the links fail because they cannot load over HTTPS? How does this happen?

[Per Yngve Berg]

Code: Select all

<link rel="stylesheet" href="http://fusionwellnesspt.com/plugins/system/social_presence/social_presence.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="/media/plg_jchoptimize/assets/gz/30/0/d446e74454dddd9ece05ee3346ecbe72.css"/>

The first link fails because it's absolute and contains http://
The second is OK because it's relative.

[vincebodie]

Code: Select all

<link rel="stylesheet" href="http://fusionwellnesspt.com/plugins/system/social_presence/social_presence.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="/media/plg_jchoptimize/assets/gz/30/0/d446e74454dddd9ece05ee3346ecbe72.css"/>

The first link fails because it's absolute and contains http://
The second is OK because it's relative.

OK, that makes sense. So I suppose I need to find out why the social presence extension creates absolute links? How are links to style sheets created anyhow?

[Per Yngve Berg]

There are several methods.

1) Put the links in the head section of the template's index.php

2) Use the Joomla api call:

Code: Select all

$doc             = JFactory::getDocument();
$doc->addStyleSheet($this->baseurl . '/templates/' . $this->template . '/css/template.css');

This example is from the Protstar Template. $this->baseurl will change and always be correct.
The extensions is also using "addStyleSheet()"

[vincebodie]

There are several methods.

1) Put the links in the head section of the template's index.php

2) Use the Joomla api call:

Code: Select all

$doc             = JFactory::getDocument();
$doc->addStyleSheet($this->baseurl . '/templates/' . $this->template . '/css/template.css');

This example is from the Protstar Template. $this->baseurl will change and always be correct.
The extensions is also using "addStyleSheet()"

OK, I can certainly do this, but the question remains did the absolute links get there because of a poorly written extension? ('Social presence' in this case.) Because if so, I need to contact them about this, and I need to know what to look for in the future if other extensions act the same way.