Skip to main content
Place blocks side by side, for example a photo of your team next to a quiz, or a headline next to a form. By default, blocks stack one above the other. You do not pick a layout from a menu. You create columns by dragging a block next to another block. A page with a headline and text on the left and a quiz on the right, side by side in two columns Before you start, you need:
  • A funnel page that already has the blocks you want to place side by side. Add them first, because blocks you add from the “Content” tab go on the page, not inside a column. See Add and arrange blocks.

​
Important to note

  • Columns share the width equally. You cannot make one column wider than another.
  • A row holds up to 6 columns. On a computer, 3 columns fit side by side and extra columns wrap to a new line. On a tablet, 2 fit. On a phone, columns stack one above the other, in the order you see them, so every block stays readable.

​
Put blocks side by side

1

Select the block you want to move

Click the block on your canvas. A small toolbar appears at its right with the = icon (Drag to reorder).
2

Drag it to the edge of another block

  1. Click and hold the = icon.
  2. Drag toward the left or right edge of the block you want it next to. A blue line and a + Add column label appear at the edge where the new column will go.
  3. Let go. The two blocks now sit side by side, each in its own column.
A block being dragged to the right edge of a quiz, with a blue line and the plus Add column label showing where the new column will go
3

Add more columns

To add a third column, drag another block to the left or right edge of the row. To move a block into a column that already exists, drag its = icon onto that column. The column highlights when it is ready to receive the block. You can also drag a block out of a column to the main page.
4

Fine tune a column

Click a block inside the column, then click “Column” in the path at the top of the left panel to select the column itself. You can then change:
  • Top, Center or Bottom to line up the blocks inside the column when a neighbor column is taller.
  • Rounded or Square corners.
  • Gap between blocks, the space between blocks stacked in the column.
  • Color, to give the column its own background color.
The Column settings panel with the Container, Column path highlighted at the top and the alignment, corner, gap and color settings below
5

Check it on every screen and publish

Use the device button at the right side of the canvas to switch between Desktop, Tablet and Mobile. Then click “Publish Funnel” at the top right.
Keep side by side layouts simple. Two columns, such as an image and a short form, read well on every device. Test your page on Mobile, where the columns stack.

​
Understand the path at the top of the left panel

When you select a block inside a column, the left panel shows a path such as Container, Column, Quiz. Click any name to select that level.
  • Container is the whole row of columns.
  • Column is one column of the row.
  • The last name is the block itself, for example Quiz or Text.

​
Troubleshooting

Start the drag from the = icon on the selected block, then move slowly toward the left or right edge of another block. The blue line and label appear when you are close to the edge.
Columns in a row stretch to the tallest one. Select a shorter column and choose Top, Center or Bottom to line up its blocks.
Empty columns stay on the page as a dashed placeholder until you delete them. Click the empty column to select it and click the trash icon on its toolbar. Or drag a block into it.
A row holds up to 6 columns. Start a new row by adding your next block below the row.

​
What to do next

Find your target audience

Decide who your funnel is for and what to ask them.

Share your funnel

Get your funnel link and send people to it.
Need help? Email support@askfunnel.com.