If the item Advanced Edit is selected in the Add Element PopUp Menu, this special window opens.

The default values ​​for the layout design and the margins can be changed here.
The margins also determine the boundaries that apply to the Layout area. The larger the margins, the smaller the layout area, i.e. the space available for the elements (images, videos, links) on a page.

In using these controls and buttons, the selected element (image, video, link) can be easily positioned and scaled.

Layout definition

With the “Layout Designer” you can easily define the basic layout. Each gray “bubble” corresponds to a possible position.
A maximum of 8 (width) * 6 (height) images can be positioned on one page via the layout (maximum 4 * 6 on a single page).
The number of layout positions (indicated a yellowish area with white/green “bubbles”) can be increased in clicking the corresponding grey “bubble”.

Example:
Clicking the 4th bubble from the left and 4th bubble from top expands the currently defined layout from 2 * 3 to 4 * 4.
The new layout now offers posiitons for up to 16 images on one page.

The images of course become pretty small then. Such kind of layout could be used for a thumbnail overview.

If you click on a light bubble, that is, on a position within the active area, the actual element is located at that position on the page.
By clicking on the next arrow, the element moves to the next layout position. This way a quick test of possible positions is possible.

If the size of the layout should be reduced, a click on any light bubble within the active layout together with a press of the SHIFT key will achieve that: The selected bubble will become the new bottom/right corner of the reduced layout.

If all this sounds confusing: Give it a try; it’s easy.
All you have to do is clicking a bubble a few times with and without holding down the Shift key, and you’ll soon see what happens ;-)

Centering

These buttons support in quickly centering an elemnt. In order from left to right:
Horizontally centered, vertically centered and set to the center of the page

Positioning

These controls allow positioning the current element.
The area available for positioning and scaling the elements is limited by “margins” (see below).
The elements lock on grid points. The spacing of these grid points is determined by the “snap” value.

Available Controls:

  • sliders (the bars with the two “bubble” handles above the input fields
    • horizontal
      The left handle of the first slider moves an element horizontally from left / right.
      The right handle changes the width of the element. The height changes at the same time so that the aspect ratio of the element is unchanged.
    • vertical
      The left handle of the second slider moves the element up(down.
      The right handle changes the height of an element. The width changes accordingly so that the aspect ratio of the element isn’t modified.
  • Input Fields
    Position and size can also be entered as pixel or percentage values.

The Snap value is used to set the distance of the grid points the element snaps to when position or size change.
This facilitates the alignment of the elements.

The “Full Page” button scales the element to fit the full page size; similar to a Page Image. In such case the “margins” will not be considered and the aspect ratio will change!

Margins (restricted areas)

Margins are areas an element cannot use. Elements only can use the space of a page within these limits. The size of the marginscan be set independently for the left and right side and the upper and lower side of the area.

The symbols indicate on which side the values ​​are applied.
Values can be entered as pixel value or as a percentage value. The percentage value is relative to the page width and height.

The “WIthin Margins” button scales the element so that it fits and consumes all the area between the margins.

Revision: 6
Last modified: 2019/03/26

Feedback

Was this helpful?

Yes No
You indicated this topic was not helpful to you ...
Could you please leave a comment telling us why? Thank you!
Thanks for your feedback.

Post your comment on this topic.

Post Comment