Customizing Logo for HTML5 Output

[dberman]

I'd like to customize the logo in the top-left corner of an HTML5 Output, so users clicking on it are redirected to a Website. Ideas?

[wclass]

I don't know how to add a link to the logo, but I can create my own buttons for the toolbar - see the help file page at:
http://webhelp.madcapsoftware.com/flare ... Output.htm

Briefly, the steps are:

• select the HTML 5 skin and open the Toolbar tab.
• add some custom buttons - give them a name
• go to the Styles tab and look for your new buttons under the "Toolbar Button" entry.
• Add a background image to your button (ie, your logo)
• Make sure the Position settings have the right width and height
• add some javascript to the Event entry, like: "window.open("http://www.madcapsoftware.com"); "

What would be nice is if the place where you change the logo in the header also let you add an onclick event at the same time.

[dberman]

Followed your instructions, yet when viewing the skin preview- the image I selected was not loaded and the JavaScript I inserted didn't work: "window.open("http://www.madcapsoftware.com"); ", all I got was an empty icon frame, adjacent to the other default icons(print, expand).

[NorthEast]

Followed your instructions, yet when viewing the skin preview- the image I selected was not loaded and the JavaScript I inserted didn't work: "window.open("http://www.madcapsoftware.com"); ", all I got was an empty icon frame, adjacent to the other default icons(print, expand).

That javascript will work - note that you don't include the outer quotes; i.e. just:

Code: Select all

window.open("http://www.madcapsoftware.com");

I've not had issues with any images I've tried - perhaps try a different one, just in case the issue is with one particular image.

[dberman]

Thanks!

[cayennep]

I'd also like to customize the logo - you'd expect that clicking on it would take you to the top level, which I've set up at help.companyname.com with a container for all the pages inside

Having a toolbar button to get you there is a lot less happy, but sounds like nobody has done this

If I get any help from support, will post here, thx

[chunkee]

I have created a custom button for a home page link. It works fine.

location.href='#welcome.htm';

welcome is the home page of the help content. IN the toolbar button section of the Styles tab in the HTML5 skin editor.

JC

[cayennep]

I was asking about customizing the link that the button goes to - madcap has said this is not possible

[sfoley]

I was asking about customizing the link that the button goes to - madcap has said this is not possible

It's not possible from inside Flare. You'll have to manually change the output files. In Default.htm, look for this code:

Code: Select all

<a href="Default.htm"><h1 class="logo"></h1></a>

You can change Default.htm to any valid URL.

However, you will have to do this each time you build. There are ways around that: other posters on the forums have created scripts to perform post-build fixes. If all of the content you create from Flare will use the same link, you can also modify the default WebHelp files (create backup copies first!) so that all of your builds include the fix. (Note that "all of the content" means anything using that output type, in any project, until you change things back.)

[cayennep]

ok, that's cool, thanks!

however, what do you mean 'modify the default webhelp files' - modify where/how?

I do want all the projects/outputs to link to the top level of help.company.com, so if there's a way to do that it would be great.

thanks
Cayenne

[sfoley]

however, what do you mean 'modify the default webhelp files' - modify where/how?

The default files are used as templates for each output type. You can change the default files to avoid post-build fixes, but you don't get any additional flexibility: it's all or nothing. If you need flexibility, search the forums for post-build scripts (I don't use those, so I can't help you there.)

HTML5:
C:\Program Files (x86)\MadCap Software\MadCap Flare V8\Flare.app\Resources\WebHelp2\Desktop

WebHelp:
C:\Program Files (x86)\MadCap Software\MadCap Flare V8\Flare.app\Resources\WebHelp\Desktop

Back up these files before you change anything. Editing these files is not supported by MadCap, and you do this entirely at your own risk.

I also recommend that you make very detailed notes about what you change and why, because if you upgrade to a new Flare version, you'll need to make the same changes all over again.

[cayennep]

Thanks so much! I'll have a look

Will heed your advice re backing up and no support and having to redo with updates, but all I intend to do is change the link for the logo to help.company.com, and it will be for all html5/webhelp outputs so should be no problem.

Cayenne

[cayennep]

k, this doesn't seem to work - I modified that default.htm file in the Flare.app.... folder but the output still links to its own index page for each project.

I used help.company.com in the Flare.app default.htm file, still goes to relative index.html for the project/output

and then tried that url, as well as help.company.com/index.html in the index.html file of the output - Flare tries to go to a relative link, within the output. Why? I have a url that works and don't understand why it doesn't use that.

so any more tips what I might do differently much appreciated, thx

[LTinker68]

Just to get the obvious out of the way... Did you include http:// in the URL?

Also, when you say the project output shows the old URL, did you 1) do a forced refresh of the browser to make sure it's not loading the old page from cache, and 2) did you look at the source code in the output to make sure the URL wasn't there?

[cayennep]

so I've got it to work by modifying the index.html file after publish, in the output, but it's still not working via modifying the default.htm - tried both with and without the index.html appended

at least I have a way to do it, don't have that many projects and this is fine for now (course I still wonder what's gone wrong & how to fix it, and you probably do too cos that's what we do)

thanks so much!

[sfoley]

so I've got it to work by modifying the index.html file after publish, in the output, but it's still not working via modifying the default.htm - tried both with and without the index.html appended

This might be one of the things that Flare will always overwrite during build time; in that case, you'll need a post-build script. However, one last thing I'd check is whether you have a default topic set in your target. If you do, try removing that setting and see if Flare still overwrites the link.