• Book
  • Download
  • Support
  • Web Viewer Layout

    In the <Style | Web Viewer Layout> menu, you can create your own web viewer layout.

    The <Web Viewer Layout> menu is only visible to a user with the “Create Style” role.

    0.1What is a Web Viewer Layout?

    A web viewer layout is the shape of your web viewer. Considering the characteristics of your company or organization, you can properly change the web viewer layout which is provided as default.

    Internally, users can use CSS(Cascading Style Sheet) to process the web viewer layout information but they don’t need to understand the structure of CSS.

    Among various web viewer components, you can set the styles of the following items.

    • Web Browser Title

    • Full Screen

    • 3 levels of Top Panel

    • Navigation Panel that shows the table of contents and the search results

    • Main Panel excluding the top panel and the navigation panel

    • Content Panel that is occupied by the content of your created document

    0.2Creating a Web Viewer Layout

    You can create your web viewer layout in the following order.

    1. Go to the <Style | Web Viewer Layout> menu.

    2. Click on the <Create Web Viewer Layout> link.

    3. Enter the basics in the input form and click on the <Save> button.

    Determine the basic shape of your web viewer according to the selected template.

    0.3Editing a Web Viewer Layout

    Once the content is changed, the <Save Now> button is activated. You must click on this button to save the changes that you have made.

    Full Screen

    Web Browser

    Set your web browser title.

    Background

    Set the background color and the background image.

    When you set the background image, you can specify the start location of the image and whether to repeat it.

    Top Panel

    The top panel is comprised of three panels and you can set each panel’s height, bottom border and background.

    Height

    You can set the panel height.

    If you want to hide a specific panel, then you have to set its height to “0”.
    Bottom Border

    You can set the border to distinguish it from other panels.

    Background

    You can set each panel’s background color and image.

    Top Objects

    In the top objects menu, you can configure logo, book title and tools.

    Generally speaking, the top objects are placed in the top panel. However, you do not need to limit its location to within the top panel.
    Logo

    You can set the logo image and location.

    Book Title, Tool

    You can set the fonts and the location.

    Navigation Panel

    You can set the style of the navigation panel that displays the table of contents and the search results.

    When you set the style, you can use different styles to the navigation panel(entire navigation panel), the navigation header and the navigation content.
    Background

    You can set each panel’s background color and image.

    Top Padding

    You can adjust the top padding and place different objects in the location.

    Move to Book Summary

    You can set the shape and location of the tool that helps you to move to the first page of your book.

    Search Tool

    You can set the style of the search tool that includes the search keyword input fields.

    Main Panel

    You can set the style of the main panel(areas in the web viewer excluding the top panel and the navigation panel).

    Background

    Set the background color and the background image.

    Size Adjustment Panel

    You can set the style of the line that separates the navigation panel from the main panel.

    Width

    You can set the width of the line.

    Background

    Set the background color and the background image.

    Content Panel

    You can set the style of the content panel that is occupied by the content of your document.

    Width

    You can set the width of the content panel.

    Background

    Set the background color and the background image.

    How helpful is this article

    Feedback recoreded. Thanks!
    Not At All HelpfulNot Very HelpfulSomewhat HelpfulVery HelpfulExtremely Helpful

    Please tell us why you didn’t find this answer helpful:

    Do you have any other feedback about this article?

    Count of comments [0]
    • Comment does not exist.