PDF Cover Page

TIP

The custom cover page is available from version 1.21.0.

Folge offers two kinds of cover pages for PDF exports:

• Simple
• Custom (using the Cover Page Editor)

Simple Cover Page

The Simple cover page is enabled by the default and can't be customized besides changing Guide Title and Description fonts and sizes in PDF Export Settings -> Fonts and colors:

This is how Simple Cover looks like:

If you require a more sophisticated cover page with images and additional elements, you can use the Custom Cover Page.

Custom Cover Page

TIP

The custom cover page is available only for personal and business licenses.

To enable the Custom Cover page, go to PDF Export Settings -> Design and toggle on the Custom Cover Page. Click the Open Cover Page Editor button afterward.

Cover Page Editor

Here is what the cover page editor looks like (the latest design might vary a bit ):

Cover Page Editor UI

1. Header Here, you can find the following buttons:

• Undo/Redo
• Close Editor: this button will discard all changes, but politely ask first if you want to
• Save template: save your current changes
• Preview: preview your cover page. If you made any changes, you may preview them even before saving.

2. Left Column

• Add Element: add new Text or Image elements to the canvas
• Layout, aka list of all elements. Each element can be moved up/down ( affects the order on Canvas), duplicated, and deleted.

3. Canvas

• Visual representation of your cover page. Each element can be selected, dragged, or resized. Double-click on the Text element will edit the content
• Zoom scale

4. Document properties

• At the moment of writing, it is only possible to define page background color

Text Element Properties

Once you click any text element, you will see the following properties. You can edit the content of the text element by double-clicking it directly on the canvas.

• Position and dimension: Left, Top, Width, Height. These are defined in percentage relative to the cover page size. You can directly edit these values to achieve a more precise position than by dragging.
• Font properties: Family, Weight, Size(px).
• Alignment properties: Text align - horizontal alignment, Verical alignment.
• Text Color
• Text fit. When this property is OFF, then the final text in the element will respect the boundaries of the element, but if it is too long, then it might get beyond width or height. ON means text will automatically reduce font size until it can fully fit into the dimensions of the element.

Image Element Properties

• Position and dimension: Left, Top, Width, Height. These are defined in percentage relative to the cover page size. You can directly edit these values to achieve a more precise position than by dragging.
• Upload/Delete Image
• Image fit: fill - The image is resized to fill the given dimension. If necessary, the image will be stretched or squished to fit. contain - The image keeps its aspect ratio but is resized to fit within the given dimension. cover - The image keeps its aspect ratio and fills the given dimension. The image will be clipped to fit
• Border: Define border around the image. If you don't want a border, set Width to 0

Cover Page Customization

In order to output the guide data on the cover page, you don't need to enter it directly into the text element. You can use the predefined placeholders that will be replaced with the corresponding content during generation.

Cover Page Placeholders

Cover Page Editor supports the following placeholders(case sensitive!):

• [[Guide_Title]] - will be replaced with the guide title
• [[Guide_Description]] - guide description.
• [[Guide_CreatedAt]] - guide creation date.
• [[Guide_UpdatedAt]] - guide last updated date.
• [[Date]] - current date.

Placeholders are very flexible and can be combined and used in one text element or standalone. Give them a try, and let me know at [email protected] what you think.