Link within background-logo.png

Please post all questions relating to Help & Manual 6 here!

Moderators: Alexander Halser, Tim Green

Post Reply
User avatar
Anne-Marie Mylar
Posts: 9
Joined: Tue Jun 16, 2015 5:29 pm

Link within background-logo.png

Unread post by Anne-Marie Mylar »

Hi,
I am using the template Integrated IFrames with Header - green. I modified it slightly by changing the png and pdf colors. I would like to add an hyperlink to the background-logo.png but I do not know how to access the html file that would give me the ability to do that. I did not find it within index.html
Please guide, thanks.
User avatar
Tim Green
Site Admin
Posts: 23189
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: Link within background-logo.png

Unread post by Tim Green »

Hi Anne-Marie,

You need to edit the HTML templates in the skin. Open the .hmskin file in Help & Manual, then in the Project Explorer on the left navigate down to Configuration > Publishing Options > WebHelp. The main .index.html page is generated by the Layout template in that section.

IMPORTANT WARNING: DON'T SWITCH TO SIMPLE MODE!!
Don't switch back to simple layout mode tab in skins with edited source code! Doing this will replace your edited version with the default template and delete your changes. You will be warned if you try to do this, and this is a warning you should take seriously. This is particularly important when editing pre-designed skins, as switching to simple mode there will delete all the custom code and make the skin unusable.
I would like to add an hyperlink to the background-logo.png
You can't add a link to this logo image directly because it is a background image for a DIV container (#hmheadbox). You can't add links to background images or to container elements like DIVs. You will need to add another element to the #hmheaderbox DIV that you can add a link to. How you do this is up to you. For example, you could insert another image with a link. If you don't want this to be visible you can use an invisible GIF (make a 1 x 1 pixel transparent GIF for this), then define its size as you wish, position it over the place you want to have clickable and attach a link to it, like this:

Code: Select all

<a href="http://www.whatever.com/"><img src="transparent.gif" width="150" height="100" border="0" /></a>
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Post Reply