Magento 1.7 – Secure/Unsecure Image Link – Link Securely for Secure Pages Only

httpsmagento-1.7mediassl

I have installed an SSL certificate on my site but have found that when using this image source address:

<img src="{{media url='wysiwyg/infortis/ultimo/menu/featured2.jpg'}}"

I receive an error saying that not all page content is secure.

When I change to:

<img src="https://mywebsite.com/media/wysiwyg/infortis/ultimo/menu/featured2.jpg"

Then everything works fine.

The problem is that I do not wish to deliver this image via HTTPS for nonsecure pages as I believe this may cause pages to load slower.

How can I link to the image in a way that will use Magento's secure/unsecure system correctly?

Best Answer

Your first attempt (with the {{media}} tag) is correct and should work.

In the admin go to System > Configuration > Web > Secure and make sure the following are set:

  • Base Link URL - {{secure_base_url}}
  • Base Skin URL - {{secure_base_url}}skin/
  • Base Media URL - {{secure_base_url}}media/
  • Base Javascript URL - {{secure_base_url}}js/

This way all the paths generated will follow the protocol given in "Base URL". If a page is secure everything on it will also be served secure.


Alternatively, just leave out the protocol and colon in URLs and the browser will choose the right one automatically. AFAIK this works with all browsers even when linking to external sites.

<img src="//mywebsite.com/media/wysiwyg/infortis/ultimo/menu/featured2.jpg" />

If you need to force either a secure or unsecure URL directly then there is the "config" tag instead. This should end with a forward slash because the config value should also end with a slash. Write your path immediately after this.

{{config path="web/secure/base_media_url"}}wysiwyg/infortis/ultimo/menu/featured2.jpg

If you have upgraded to Magento 1.9.2.2 or applied the latest patch then you need to whitelist the paths you use in {{config}} directives. To do so, enter them in system > permissions > variable permissions.