Customizing the skin of your publications

Product: FlippingBook Publisher

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. So let's find out how to change the look of:

All this can be done in Settings tab > Appearance section on the left of the preview pane:

 

Background

Apart from your PDF itself, the background is arguably the most impactful visual element of your publication. You can customize it 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 the small thumbnail next to Background image, and in the dropdown menu 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. 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 the small thumbnail next to Background image, and in the dropdown menu 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?
drift chat