# Building pages using Page Builder

First it is good to know that:&#x20;

* Each **Page** contains **Sections.**
* Each **Section** contains **Elements**.
* An **Element** contains components.

### 1. Pages <a href="#id-1-pages" id="id-1-pages"></a>

To start building your page, you can choose between 2 ways:

* Start with sections.
* Start with templates.

![](/files/-LmlI8KFqlGP1l0JhEh5)

\
To add or delete pages to your project, you can open **Pages manger** from left bar

![](/files/-LmlIByssBkwUvhSzHSC)

### 2. Sections <a href="#id-2-sections" id="id-2-sections"></a>

Pages in PixFort builder are composed of sections, you can create any order you want with these sections, and each section has its own settings (background, padding...), you can access to it by clicking on the **Settings icon** in the dark box on the left of each section.

![](/files/-LmlIEoGlJvkzkciLCjM)

### 3. Elements <a href="#id-3-elements" id="id-3-elements"></a>

Sections in PixFort builder are composed of elements. These elements contain all different components in your page (title, text, image, form, video...), and the element could contain more than one component (i.e. icon + title + text).

![](/files/-LmlIH-bUVDK2hmfLP_c)

The pages in PixFort builder are based on Bootstrap grid-system (12 columns), that means each element in the page has a specific size based on its columns, this size can be changed by adding or removing columns from the elements **(click on - or + icon in element's bar)**.\
\
The image below shows you the same element with different sizes (columns)

![](/files/-LmlIJuJV9fw1yH-p_Dg)

From the **Blue bar** of each element you can:

* Change element's position by continuous-clicking on **Move icon** (first icon).
* Change element's size **( - or + icons)**.
* Access to **element's settings** (background, animation, padding...etc).
* **Duplicate** element.
* **Delete** element.

To edit the components of an element:

* **Text:** just click on the text and start writing.
* **Image:** right-click.
* **Button:** right-click.
* **Font icon:** right-click.
* Special components like **forms**, **videos**.. can be edited via element's blue bar.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.pixfort.com/using-pixfort-builder/building-pages-using-page-builder.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
