Footer not displayed in Webhelp output with webhelp.footer.file

carlisaac · Post by **carlisaac** » Thu Feb 11, 2016 1:40 pm

I'm fairly new to customizing DITA transforms, so apologies in advance for such a basic question but I'm tearing my hair out trying to get a logo to display in the footer of my Webhelp output. I'm using oXygen 15.2 with DITA OT 1.7. I have a well-formed XHTML file that consists only of an image:

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>Company Logo</title>

    </head>

    <body>

            <img src="logo.jpg" alt="Logo goes here"/>

        </div>

    </body>

</html>

I have edited the Webhelp transformation scenario and set the path of the webhelp.footer.file parameter to point to the above file. When I run the transform, however, I only see the "alt" text and not the actual logo. I've spent hours reading through the documentation and searching the Web, but I can't find a solution anywhere.

Could anybody please tell me what I might be doing wrong here?

Thanks!

Post by **bogdan_cercelaru** » Thu Feb 11, 2016 5:58 pm

Hello,

Your logo image does not appear because it doesn't exists where the browser expects it to be. Your HTML fragment will be added in every topic file and the topics will be in various folders. The img element uses a relative path to the "logo.jpg" image but the image is not there.
If you will publish your WebHelp to a web server, than you can manually copy your image to a location on your server and refer it using the absolute path. Supposing that your logo is located into "image" folder in the root directory of the website, your footer file will be:

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>Company Logo</title>

    </head>

    <body>

            <img src="/image/logo.jpg" alt="Logo goes here"/>

        </div>

    </body>

</html>

Another way to have your image correctly displayed in the footer is to use a base64 image for your logo. You can encode the actual logo and than your footer file will look like:

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>Company Logo</title>

    </head>

    <body>

            <img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Logo goes here - red dot example" />

        </div>

    </body>

</html>

Regards,
Bogdan

carlisaac · Post by **carlisaac** » Thu Feb 11, 2016 6:51 pm

Thanks Bogdan! I tried replacing the relative path with an absolute one but when I ran the transform again, nothing was displayed in the footer at all (not even the alt text). Your suggestion about the base64 encoding worked for me though

Footer not displayed in Webhelp output with webhelp.footer.file

Footer not displayed in Webhelp output with webhelp.footer.file

Re: Footer not displayed in Webhelp output with webhelp.footer.file

Re: Footer not displayed in Webhelp output with webhelp.footer.file