Adobe Digital Publishing Suite - Manual (Page 101)

Web Content overlays
Auto Play
Transparent Background
Allow User Interaction
Scale Content To Fit
The Web Content overlay lets you display a web page within a view area. Users can see the web page content in the view area without having to
display a separate in-app browser. You can specify a web URL or a local HTML file. Note the following issues:
If you specify a local HTML file, make sure that the .html file and associated files and folders appear in the same folder. When the article
content is created, all the files in the same folder as the .html file are uploaded, so limit that HTML folder to only the necessary assets. For
example, if you add the .html file to Documents folder, all files and subfolders in the Documents are uploaded.
For any URL that gets redirected to a mobile URL automatically, specify the mobile URL (such as http://mobile.twitter.com/), not the original
URL (such as http://twitter.com).
If you specify an HTML animation for a Web Content overlay, set the overlay to Auto Play with a minimal delay (such as 0.125 seconds) to
ensure that the animation plays properly. Setting a delay prevents the overlay from auto-play when the page is preloaded into memory.
In InDesign CS6 or later, you can use the Insert HTML command to insert the embed code of a YouTube clip. For best results, edit the
YouTube embed code to include "scr=https://www.youtube.com" instead of "src=//www.youtube.com." Set the overlay to Auto Play, and add
a poster image in front of the overlay.
To create a Web Content overlay:
1. Do one of the following:
Using the Rectangle tool or Rectangle Frame tool, drag to create the frame that displays the web content.
Place an image that acts as a poster for the web content.
2. Select the frame, and select Web Content in the Folio Overlays panel.
3. Do one of the following:
To specify a URL, type or paste the URL in the Assets field. Type the entire URL, including “http://.”
To use local HTML files, click the folder icon and specify the local HTML file. The HTML file (such as index.html) should appear in a
folder that includes any images or scripts used in the HTML file.
4. Specify any of the following options:
Select this option to load the web page when the page is loaded on the mobile device. You can also specify the number of
seconds to delay. If your target HTML is an animation that plays, specify a minimal delay.
If this option is selected, the transparent background in a web page is preserved. Users can see through the
transparency to view the DPS content in the background. If this option is deselected, the web content background is used.
If this option is selected, users can interact with the web page. For example, they can tap a hyperlink to jump to a
different web page.
If this option is selected, the web page is scaled to fit within the size specified in the overlay file. If this option is not
selected, the web page is displayed at the same size it would appear in the device’s browser, and the HTML page can be cropped.
98