The favicon is a nifty little 16 pixel representation of your website, usually something recognizable, like your complete logo, or a portion of it. The unfortunate side of the favicon is that, in some browsers, it remains in it's usual form throughout a secure checkout process, instead of converting to a lock icon.

I drummed up a little trick this morning which will "fool" browsers into using your own lock icon while using the https protocol.

  • First, get yourself a favicon that looks like a lock, or any secure image of your choice. I generally visit IconFinder for this purpose.
  • Next, download your icon of choice as an .ico file. If that option is not available, you can use a Favicon generator, such as Dynamic Drive's favicon generator.
  • Rename your favicon to something like favicon_secure.ico, so as not to be confused with your standard favicon.
  • In your web servers configuration file, create a redirect for the secure portion of your website only. Using apache as an example:

    <VirtualHost xxx.xxx.xxx.xxx:443>
      ...
      RewriteEngine On
      RewriteRule ^/favicon.ico$    /favicon_secure.ico [L,R]
    </VirtualHost>

 

That's it!

Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *