PageFly - 5 essential tips

608 views Clus 5

In this article, you will learn about 5 essential tips to get started with PageFly pagebuilder the quickest and easiest way.

Tip 1 – Sections are the largest design units in a page. They structure a page vertically.

Below, we have a:

  • Section – red color
  • Row – purple color
  • Column – green color

Tip 2 – Columns structure content horizontally.

Rows structure a section vertically, while Columns structure content horizontally.

?Content should be placed in columns only.

?Always start off by dragging out a Layout element to create structure, then add more content inside.

Tip 3 – Use margins & paddings to create space between elements.

While margins push other elements further away, paddings push the content inside the element further in.

Structure of web element

?Use percentage unit (%) instead of pixel (px) to keep it responsive.

?Be very careful when using margins and paddings cause you may lose track of them. Use sparingly only when needed.

? Read how-to.

Tip 4 – Edit a chosen element with the Inspector.

All elements can be edited in terms of generic settings, styles and advanced effects.

You can edit an element with 3 tabs in the Inspector:

  • General: Set generic style for the element to apply on all devices.
  • Styling: Edit text, background and other styles on all or custom devices.
  • Advanced: Add animation and custom invisibility effect for the element.

Tip 5 – Preview page across screen sizes.

All PageFly designs are responsive by default. But it’s a best practice to toggle between screen sizes to make sure things are looking good ?

?You can build custom design for each screen size using Device Switcher and Styling tab.

?Read how-to

?Once you set a fixed dimension for an element on All device, the dimension will apply on all other devices. So always check other screen sizes before publishing.

Was this helpful?