Adding Logos

A last set of images used by the generic stylesheet are logos. Logos are given as <file> entries in the section, identified by the id attribute. Two logos can be given by the following IDs:

firstLogo

The file given will be placed above the navigation (navigation left) or to the left of the navigation (navigation at the top)

secondLogo

The file given will be placed below the navigation (navigation left) or to the right of the navigation (navigation at the top)

Usually you will want to just copy your existing images into the output similar to this:

  <?xml version="1.0" encoding="UTF-8"?>
  <website baseURL="http://my.domain.org" sourceDir="content" targetDir="output">
    <structure>
    	<!-- sections go here -->
    	<directory sourceDir="images" targetDir="images">
    	  <file sourceFile="logo.png" targetFile="logo.png" 
    	                 type="copy" id="firstLogo"/>
    	  <file sourceFile="pic.png" targetFile="pic.png"
    	                 type="copy" id="secondLogo"/>
    	</directory>
    </structure>
    <layout>
      <!-- other declarations -->
      <documentStyle type="copy">
        <copy/>
      </documentStyle>
      <!-- other declarations -->
    </layout>
  </website>

The directory is optional, but this way you can put the images in a subdirectory. You can put the files anywhere you want, as long as they have the proper id attribute.

You can render SVG to PNG or JPEG, too: replace the <copy/> with <svg/> and the input will be interpreted as SVG code, the output format will be determined by the extension of the output file name (".png" or ".jpg" / ".jpeg").