6.2 Page settings
Page name
The name of the page as it appears in the navigation bar at the bottom of the form is set in the Page elements’ Settings – Short label. This can be a page number or a name. Avoid using long names if there are many pages in the form or if the form will be read on a mobile phone. Read more about the navigation bar in Using: 3.2 Navigation through the form.
Page color and icon
In the Page element’s Styling tab you can set properties of the page as it is shown in the navigation bar. Label color sets the color of the page name and icon, and Background color sets the background.
Page icon
In Styling – Icon you can select other icons than the default page icon. The first icon on page 1 in the icon selector is an empty one, allowing you to just use the page name, such as the page number, with no icon.
You can also paste in another Unicode icon or an emoji in the Search icon field. Make sure that this is displayed in the phones and tablets used by your users. This is a handy site for finding emojis and UNICODE characters and copying them to a form design: http://xahlee.info/comp/unicode_index.html.
Page numbers
Page numbers can be added to a title in a footer or header element. You can choose between counting the pages in the PDF report or the pages in the form design on the screen, in the app.
{%pageNo} – adds the page numbers on the PDF printout
{%pageNoTotal} – adds the total number of pages in the PDF
Example
{%pageNo} / {%pageNoTotal}
{%Page} – adds the page number in the form on the screen
{%PageTotal} – adds the total number of pages in the form on the screen.
Example of use:
{%Page} of {%PageTotal}
Page header
Add a Header element to the first page. If you don’t specify this, a default header will be added. The header of the first page will be inserted on all pages unless you specify new headers for the individual pages.
As default, headers are only shown on printed PDF pages, so you have to go to the Header element’s Properties tab PDF and select Show Header/Footer in Form View (not only PDF) to see the header on the on-screen form too.
Note: The Page Margins may have to be adjusted to make room for the header. These are set in the Print tab of the properties of the main Form element. Test the sizes of these to make sure the header appears the way you want it in the PDF report.
Page footer
Add a Footer element to the first page. If you don’t specify this, a default footer with the Zegeba logo will be added. The footer on the first page will be inserted on all pages unless you specify new footers for the individual pages further back.
As default, footers are only shown on printed PDF pages, so you have to go to the Footer element’s Properties tab PDF and select Show Header/Footer in Form View (not only PDF) to see the footer on the on-screen form too.
Note: The Page Margins may have to be adjusted to make room for the footer. These are set in the Print tab of the properties of the main Form element. Test the sizes of these to make sure the footer appears the way you want it in the PDF report.
Page orientation
Page orientation can be set on the entire form as well as for the individual page elements. Portrait is the default orientation.
To change page orientation:
- Select the Form element on top of the Elements section,
– or –
select an individual Page element in the form. - Go to the Print tab in Element Properties, and in the Page orientation field select either Portrait or Landscape.
Page size
Set page size as [width, height] or as A4, A5, A3, Letter etc. A4 is default page size.
To change the page size:
- Select the Form element on top of the Elements
- Go to the PDF tab in Element Properties, and in the Page size field specify [<width>, <height>] in cm.
Page size can only be set on the entire Form, not for individual pages.
Page margins
The page margins are set for the entire Form.
Use one of the following 3 formats:
- A single number – e.g. 20 – will set all margins equal to this number of pixels.
- [horizontal, vertical] – e.g. [20,40]. This means that the left and right margins are both set to 20, and the top and bottom margins are set to 40 pixels.
- [left, top, right, bottom] – e.g. [20, 10, 30, 30]. Use this to assign individual sizes to the 4-page margins.
Handy tips for printing
The Zegeba Designer does not have a specific Page Break element, but you can still control the pagination of the PDF report. Select an element, go to its Properties – PDF tab and check Page break after element on PDF or Page break before element on PDF.
Some elements such as grids, groups, accordions should not be divided on two separate printed pages. Click the option Do not separate to ensure that everything in an element is printed on the same page.
These settings can be changed with the Designer in Minor Edit mode. This means that if you are not happy with the pagination in the first PDF report from a capture you can leave the form Published, open Designer mode, add pagination codes such as the ones above for page breaks, save the form, view the capture in the Dashboard and make a new PDF report with better pagination.