A skin in RoboHelp helps you alter and customize the look and feel of your Help system before publishing it. You can customize a skin by changing colors, buttons, fonts, icons, logos, and background of your output. Whether it is Responsive Html5 or WebHelp that you want to publish, RoboHelp provides several predefined skins in the Skins panel of the publishing window. You can apply one of these predefined skins as it is or edit it to achieve the preferred output layout.
In the Skins panel, against the skin you want to customize, choose Options () > Edit.
RoboHelp opens the skin editor as a tab. The skin editor comprises a live skin preview on the left and the Skin Components panel on the right side.
In a Responsive HTML5 skin, a toolbar above the skin editor allows you to do the following:
- Desktop icon (Default layout) Displays your content in the desktop view.
- Phone icon Displays your content in the phone view.
- Tablet icon Displays your content in the tablet view.
- Toggle highlight icon Toggles the highlighting of skin components in the skin editor.
The skin components and its settings vary according to the type of Responsive HTML5 skin view (desktop, phone, or tablet) you select.
In the Skin Components panel, click a skin component on the left to set your preferences for the component.
On clicking a skin component, RoboHelp displays its current settings and highlights the component in the output preview tab. For example, clicking Filter displays its current settings and highlights the Filter icon and area in the output preview tab.
In the Open dialog box, navigate to the skin (.skz or .slz file) you want to import, and then click Open.
The selected skin is added to the Skins panel and placed in alphabetical order of skin names.
If you import a .slz file, which is a RoboHelp Classic file, it is upgraded automatically. For more information, see Upgrade a skin.