How to build the structure of your site: move sections, configure layouts and change the order of elements

Table of contents:

To change the order of your sections, simply switch to the section menu in the left panel and drag your section to change the order.

To change the element order in a section or move the element between sections, simply click on the target element and drag it to the desired location.

For a better overview, go to the section in which you want to change the order of elements. Simply move the mouse over the target section and a control panel will be displayed. Click on the burger button to view the section list. Here you can change element order, by simply dragging it.

In Onepage, every section can be displayed in a variety of layouts to suit your content flow and visual style. While the Columns layout is the go‑to for classic arrangements, Grid, Masonry, Bento Grid and Timeline each offer distinct ways to present items with more dynamic positioning or chronological context. Choosing the right layout helps guide your visitor’s eye exactly where you want it.

Please hover over the required section to display the control panel, and click on the most right icon (symbol with 3 vertical lines).

Here you can switch between available section layout types

Let us review each layout type separately.

Traditional columns, where you choose how many columns you have. You can add multiple columns, but for that, make sure to activate the pro mode.

Best for evenly‑spaced content like feature lists, product showcases or any section where you want strict alignment.

A traditional grid, which arranges your section into a fixed table of rows and columns. You simply choose the number of columns and rows (for example, 3 columns × 2 rows creates 6 equal containers) and then drop any content—text, images, buttons—into each cell. This ensures a uniform, predictable structure where every item aligns perfectly across the section.

Containers are arranged in vertical “stacks” but can have variable heights, filling gaps much like bricks in a wall. Ideal for image galleries or card layouts where content lengths vary and you want a compact, Pinterest‑style look.

The system automatically packs items to optimize space, so shorter items slide up to fill gaps below taller ones. You can adjust the amount of columns manually.

A curated grid where you can assign specific “block” sizes (e.g. 1×1, 2×1, 2×2) to an individual container, similar to a bento lunchbox compartment.

You choose which block size a certain container can occupy, giving you control over prominence and balance within the grid. Great for highlighting certain pieces (like a featured article or product) by making them larger, while still keeping a neat overall grid.

Content items are plotted along a vertical line in chronological order, often with date labels or markers. Perfect for company histories, project roadmaps or any story‑driven content where the sequence and dates matter.

You can alternate the timeline alignment (left, right or centred):

Timelines allow including any element, such as headings, icons or images at each point, and segment by year, month or custom milestones.

💡Do you have any feedback concerning this article? Please let us know through our live chat or at support@onepage.io, so we may keep it up to date. Thank you! 🙂