Copy Layout

To copy your layout to another size in any format, go to the Creative Properties Bar, on the left-hand side of the canvas in the Fluid Designer.

Layout

Layout consist of:

• Element order:
  • hierarchy of elements’ layers
  • parent reference (child/parent structure in the element list), for parent groups and child elements inside
• All settings of all elements (see: Element settings)

You can copy an entire layout, or an element order separately.

Copying your entire layout

• Select a size, which layout you want to copy to another size (e.g. 1920x1080)

• Remember a size or sizes you want the selected layout to be copied to.
• Another size can have no layout at all (sizes in formats that have no layout associated are greyed out), or a layout that you want to change.
• Another size can be in selected format or in another format
• E.g. we will copy the 1920x1080 layout to the 1800x180 size with no layout and to the 2400x400 size, which has a layout we want to change and also located in the different format.

• Click on the ‘Copy Layout’ icon on the left-hand side Creative Properties bar.

• From the “Copy Layout” screen, select a size or sizes you want the selected layout to be copied to. Either from the Current Format or Other.
• Click on “Copy layout”

As a result, our 1800x180 and 2400x400 sizes now have an identical to 1920x1080 layouts:

Copying element order only

One of the use cases is when your element order got messed up, so it’s no longer arranged correctly. For example, if some of the element layers got flip-flopped or accidentally deleted in a specific size.

If you don’t need to copy the entire layout, only an Element List structure, this is the way to go.

For example, let’s say a background element accidentally ended up on top of the list. Instead of being behind the logo and CTA button elements, it covers them, so they aren’t visible and clickable for the user.

You also want to group the Logo and CTA elements.

In this instance, your Element List has only gotten messed up in 1800x180 size design. It looks like this:

To fix is, all you have to do is copy the correct Element Order from a similar size. Say the 1920x1080 size design:

The process of fixing the element order is identical to copying a layout, except for the final step.

At the end of the process, click “Copy element order”.

As a result, the Element List in the 1800x180 size design is in the correct order, with the background image behind the logo and CTA elements:

To learn more about layouts, see: Format & Layout - Overview.