You can use a variety of approaches to add branding to your HTML5 content using InDesign and in5.


This article covers a few ways to customize the branding of your digital project.


The Viewer Display Bar

The Viewer Display appears as a toolbar at the bottom of the output. You can customize the color and add a logo.



Add branding via the Viewer Display in the Viewer Display section of the Export HTML5 with in5 dialog (in5 > Export HTML5 with in5...) 

  • Indicate the color that you would like to use for the Viewer Display bar as the Frame Color from one of your document's swatches.
  • Add your logo by clicking on the Browse... button to navigate to it in Display Logo to have it appear  in the lower left of your output.
  • Enter your own customized message for the Loading text to display.



Here's a zoomed-in view of the logo in the bottom-left corner.


Adding a Background Image

You can add a background image that includes your logo in the Backgrounds section of the Export HTML5 with in5 dialog via the Backgrounds section of the Export HTML5 with in5 dialog by clicking on the Browse... button under Background Image and navigate to the image you'd like to use.


Here's an image that has multiple logos. Note: You can also attach a single logo and use the Repeat Background Image options to get a similar effect.


Embed the Project in Another Document to Add Branding to the Outer Edges

Use the Web Content interactive widget (in5 > Interactive Widgets > Web Content) to embed your content —which could be a flipbook, scrolling site, or other type of document where the background could be a video or other static content for your branding.


Note the animated stars around the outside.


Here's a video that shows how to set it up:



With InDesign and in5, you can create a wide variety of interactive HTML5 content that includes creative ways to incorporate branding.