• Customizing the skin of your publications

FlippingBook Publisher comes with 24 predesigned skins, but there are lots of options available to customize the skin to your own taste. You can style your publications to match your corporate colors, the style of your website, or the look-and-feel of your PDF.

You can change the background, the panels, the color of the text and icons, and the colors of the pop-up windows. All these options can be found in the ‘Appearance’ section.

Background

Apart from your PDF itself, the background is arguably the most impactful visual element of your publication. You can customize this background by using either a solid background color or an image of your choice.

Solid color

If you want to use a solid color, then click on small thumbnail after Background image, and in the pop-up image choose the option ’Remove image’:

You can use the ‘Window background’ option to change the color. Click on the button with the three dots to select a color, or enter a color code directly in the text box: you can either use a hexadecimal code (e.g. #00FF00) or use the RGB color code, separated by semicolons (e.g. 10;230;241).

Tip: If you want to capture a color that is used in, for example, your PDF, then you can use the ‘eyedropper’, Just move outside of the ‘Pick a color’ window and the mouse pointer will change into a color picker. Just move the color picker to the area in your PDF whose color you want to use and click. The color of the pixel you clicked on will be selected as the color to be used.  

 

Background image

If you want to use an image, then click on small thumbnail after Background image, and in the pop-up menu that appears, choose the option ’Select image’.

Now browse to the image of your choice, select it and click on ‘Open’.

To specify how your background image is treated on different sized screens, you can change the option ’Background placement’:

  • Fit: this option resizes the image to fit completely on the screen, so every part of it will be visible. Since we keep the aspect ratio intact, this may mean that part of the screen remains uncovered. It will be filled using the color in ‘window background’
  • Tile: This option takes your image in its original size and puts it in the center of the page. If the image is larger than the available screen space, then parts are cut off. But if it is smaller, then the image will be repeated in a tiled pattern.
  • Fill is the 3rd setting. When you use this option, the image is resized so that the complete screen is filled with your image, while keeping its aspect ratio intact. This may mean that part of the image is cut off on some screens.

Windows

The window background color is not only used for your publication’s background (if you don’t use an image for that), but also in other publication windows, like the Table of Contents and the pop-up windows that appear when your users want to share or print your publication. So even if you use an image for your background then it is still worth checking if this setting matches your style.

You can also change the color of the icons in the bottom bar, and the text and buttons in the interface. By default, this color is determined automatically by FlippingBook Publisher. We choose a color that has a good contrast with your background while still matching its general hue. If you want to set this color manually, then first click on ‘Auto’ to disable it and then click on the color tile to select a color manually. If you are not happy with the result, then you can again click on ‘Auto’ to use our suggested color.

Panels

Finally, you can change the colors of the top and bottom panel in your publication, or you can set them to be transparent. Use the ‘Top Panel Transparency’ to switch between a solid color or a transparent top panel. If you choose ‘Transparent’ then an additional option appears to set the color of the text and buttons. This option is ONLY available when the panel is transparent. If you use a solid color, then it will always use the generic ‘Text and Buttons color’.

The ‘Bottom Panel Transparency’ does the same for the bottom panel.

Related

Was this article helpful?