How to add a Favicon

I looked, searched, and Googled but still no clear instructions found. Any ideas anyone?

Hi R082,

If you want to add a favicon to your AxShare site, you’ll need to use the Plugins feature. But first! You’ll need to host your favicon on a hosting site. If you haven’t found one yet, I just tested this with IconJ and it gave good results.

Once that’s done, the hosting site will give you the favicon external link code to put into the <head> of your site. Copy and paste that code into the AxShare plugin area, like this:

The last step is selecting which pages you want the favicon to show up in, and you should be good to go!

if hosting your image is a problem (e.g. prototype offline) you can also encode yout icon base64 and add it directly.
if you dont want to use a plugin you can append the line of html via javascript:

javascript:void($(‘head’).append(’<link href=“data:image/x-icon;base64,AAABAAEAEBAAAAAAAABoBQAAFgAAACgAAAAQAAAAIAAAAAEACAAAAAAAAAEAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP//AAD8fwAA/H8AAPxjAAD/4wAA/+MAAMY/AADGPwAAxjEAAP/xAAD/8QAA4x8AAOMfAADjHwAA//8AAP//AAA=” rel=“icon” type=“image/x-icon”>’))

Hey all – thanks for the suggestions. One thing I am noticing is that if I visit the root axshare link, the blue cloud still shows. If I visit the html page directly, my custom favicon shows.

Is there any way to show this favicon on the root axshare link?

Hi w00t,

It sounds like you’re seeing that the favicon only shows after closing the HTML Sidebar, is that correct? If so, this is expected behavior. To clarify, when the HTML Sidebar is either open or minimized, the prototype isn’t loaded in the browser window’s main frame. Rather, it’s loaded into an inline frame to the right of the Sidebar, which is why the favicon plugin doesn’t kick in until the Sidebar is closed. Thus, to get the favicon to show, you’ll need to close the HTML Sidebar completely so that the prototype loads into the browser window’s main frame.

Hopefully this helps!

Hi, followed the all stepts in Axure 8 and it still didnt worked :confused:
any idea?
Many Thanks

Hey all,

If you happen to be following along from home, Vered wrote in to the support desk and we were able to get their prototype’s favicon up and running with the sidebar closed. As Jane mentioned, the sidebar needs to be fully closed in order for the favicon to display in the browser. If that doesn’t seem to do the trick for anyone else who may be experiencing this issue, please shoot us an email at <support@axure.com> so we can take a closer look!

Unfortunately the IconJ favicon hosting solution doesn’t work - it doesn’t use https so browsers block the favicon because its not secure. Also, the Base64 method doesn’t work on IE.

I found the most reliable solution that worked on IE, Edge, and Chrome was to host a png (not an ico) on a 3rd party https image site using the Axure plugin approach. Hope that helps someone!

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.