# How to create a FAQs page with PageFly?

### Overview

A [FAQ (Frequently Asked Questions) page](https://help.pagefly.io/manual/how-to-create-faqs-pagefly-page/) is an essential part of any website. It helps answer common questions your customers might have, saving them time and providing them with immediate assistance.

An effective FAQ page can improve customer satisfaction, reduce support requests, and build trust with your audience. In this guide, we'll walk you through the steps to create a professional and functional FAQ page using PageFly.

### Requirements

Before you start creating your FAQ page with PageFly, make sure you have the following prepared:

* List of Frequently Asked Questions: Prepare common questions and answers organized into categories if needed.
* PageFly Installed on Shopify: Ensure the PageFly app is installed and set up on your Shopify store.
* Content and Images: Prepare any additional content and images you might need for your FAQ page, such as product images, icons, or graphics to enhance the visual appeal.

### Gen 2 Editor - How To Create A FAQ Page With PageFly?

{% hint style="warning" %}
**Important Note**: Gen 2 Layout will be available exclusively for Pay-as-you-go pricing model ([slot plans](https://help.pagefly.io/manual/pricing-plans/)).
{% endhint %}

#### Step 1: Create A Regular Page

1. In the PageFly dashboard, select the **Pages** tab.
2. Click on the "**Create blank page**" button on the right side of the screen, then select "**Regular**"
3. Select "**Legacy Editor**"![](/files/9KlGAXZ78tQsGv2wOBMX)

Alternatively, you can click on the **Create from a template** button to use PageFly templates for your FAQ page.

![](/files/on7ZfkII3dgNy4HO7J9O)

#### Step 2: Build Your FAQ Page

**1. Add A Heading**

Start by adding a heading:

* Navigate to the left menu, select **Elements**, go to the **PageFly** tab, and drag the **Heading** element to the canvas.

![](/files/AWS5leutZ6aCaTOCIb5l)

* Navigate to the **General** tab and enter the heading in the heading text box.
* Move to the **Styling** tab to adjust the heading's size, color, font, spacing, etc.

![](/files/P11wrqAKIz7QsOkvt63X)

For more information, check out the [Styling tab](https://help.pagefly.io/manual/elements-style-settings/) here.

**2. Add A Paragraph**

Next, add a paragraph to your FAQ page. This can be a short introduction for your FAQ page:

* Select the **Paragraph element** from the left menu and drag it to the canvas.

![](/files/Da2jEjGclwWNJySlIVx6)

* Navigate to the **General** tab and enter your content in the Paragraph text box.
* Move to the **Styling** tab to adjust the heading's size, color, font, spacing, etc. You can also set the background color or add a background image (optional).

![](/files/FOtOkX2sIWGpTV2sqnjN)

For more information, check out the [Styling tab](https://help.pagefly.io/manual/elements-style-settings/) here.

**3. Organize Your FAQs**

For organizing your FAQs, consider the Accordion and Tab elements.

**3.1 Using Accordion Element**

Use this element to create collapsible content.

* Navigate to the left menu, select **Elements**, go to the **PageFly** tab, and select the **Accordion** element and drag its variant to the canvas.

![](/files/skVAnK73J1Eaw0RcOl3v)

* Clicking on the **Accordion** item and navigate to the **General** tab > enter your question in the Header text.

![](/files/W8ocuedgkde7RrwvCNS7)

* Add the answer by dragging the **Paragraph element** to the **Accordion** item.

![](/files/OBIvHft7OWk61zMaVSLA)

* Navigate to the **General** tab to type the answer into the Paragraph text box.

![](/files/rNta2Y9c4izE4rUZhLgb)

Below is an example of an FAQ section using the Accordion element:

![](/files/jBiaEJDTc1AkJGN86ulk)

**3.2 Using Tab Element**

Use this element to categorize questions, such as "**Shipping**" or "**Sizing & Fit**".

* Navigate to the left menu > select **Elements** > go to the **PageFly** tab > select the **Tab** element and drag its variant to the canvas.

![](/files/a13orNqJiKJCSE7Asn3B)

* Name your question categories by clicking on the Tab and navigating to the **General** tab > enter the category name in the **Header text** box.

![](/files/G173ryOQ8DwpoN6V5PhJ)

* Add the questions and answers for each category using the **Heading** and **Paragraph** element. Select them in the **PageFly** tab from the left menu and then drag and drop them to the **Tab** element.

![](/files/X3kUKcE8ajHQIv7Rpc1n)

* Navigate to the **General tab** of **Heading** and **Paragraph** elements to add questions and answers.

![](/files/Z3WikCdeChGv5QHla7Iu)

Below is an example of an FAQ section using the Tab element:

![](/files/UQGcLrqSeB2nqIJNym3V)

To save time, you can also use the FAQ section from PageFly's premade sections:

* On the left menu, go to **Page content** > hit the **Add section** button.
* Click **Template** > select "**FAQs**" in the Category dropdown menu > hit the **Select** button.

![](/files/itBzKPHccjFLoljvfAmn)

* Customize the content in this section with your prepared FAQs.

![](/files/eZxHTsTeCkHS1vl6PbSd)

#### Step 3: Save And Publish The Page

* After completing your page, click on the **Save** button to save your page.
* Click the **Publish** button to publish it.

![](/files/FFZyM0okx4E9BtKyPxzX)

* Check the live view by clicking the **Live view** button.

![](/files/BZoXqjKjF9wrhuJUPjci)

#### Step 4: Add FAQ Page To Your Shopify Store's Menu

Now your FAQ page is ready, let's add it to your Shopify Store's menu so your customer can access it:

1. Go to your Shopify dashboard > navigate to **Online Store** > Click on **Navigation**.
2. Decide where you want customers to access the FAQ page (Footer, Main Menu, Quick Links). In the following example, we choose Footer.

![](/files/rbNepCk4rFY8SG6Et6JM)

3. Click **Add menu item**.
4. Enter the name (FAQs) and select the FAQ page you created.
5. Hit the **Add** button and then click **Save menu** to save your change.

![](/files/nM3giZMwtTda0BBIJSMG)

### Legacy Editor - How To Create A FAQ Page With PageFly?

{% embed url="<https://www.youtube.com/watch?v=aUmbTCCe56I>" %}

#### Step 1: Create A Regular Page

1. In the PageFly dashboard, select the **Pages** tab.
2. Click on the "**Create blank page**" button on the right side of the screen, then select "**Regular**"
3. Select "**Legacy Editor**"

<figure><img src="/files/PhgUBwJfwqlcrstG8v2F" alt=""><figcaption></figcaption></figure>

Alternatively, you can click on the **Create from a template** button to use PageFly templates for your FAQ page.

#### Step 2: Build Your FAQ Page

**1. Add A Heading**

Start by adding a heading:

* Navigate to the left menu, select **Elements**, go to the **PageFly** tab, and drag the **Heading element** to the canvas.

![](/files/Oj7q5Ztz7nDUq2AgV3wg)

* Navigate to the **General** tab and enter the heading in the heading text box.
* Move to the **Styling** tab to adjust the heading's size, color, font, spacing, etc.

![](/files/2slnMv8kJiLs0yn4fiIL)

* Set the background color or upload a background image (optional):
* Set the background color: Select the section covering the heading > navigate to the **Styling** tab > scroll down to **Background** color > choose your desired background color.

![](/files/gW4EajfJOSBukMI7QiBG)

* **Add a background image**: Select the section covering the heading > navigate to the **Styling** tab. Scroll down to **Background image** > Choose your desired image from the **Image Manager** or **upload one from your device**.

![](/files/Xsrsf7Qvp8KbFYGCkgXM)

For more information, check out the [Styling tab](https://help.pagefly.io/manual/elements-style-settings/) here.

**2. Add A Paragraph**

Next, add a paragraph to your FAQ page. This can be a short introduction for your FAQ page:

* Select the **Paragraph element** from the left menu and drag it to the canvas.

![](/files/qB6NBx8jp6MdCLxSLbVM)

* Navigate to the **General** tab and enter your content in the Paragraph text box.
* Move to the **Styling** tab to adjust the heading's size, color, font, spacing, etc. You can also set the background color or add a background image (optional).

![](/files/kKjeRn5aas9ulJF7EH1G)

For more information, check out the [Styling tab](https://help.pagefly.io/manual/elements-style-settings/) here.

**3. Organize Your FAQs**

For organizing your FAQs, consider the Accordion and Tab elements.

**3.1 Using Accordion Element**

Use this element to create collapsible content.

* Navigate to the left menu, select **Elements**, go to the **PageFly** tab, and select the **Accordion element** and drag its variant to the canvas.

![](/files/9VIGZz6yCAxVVy5TUOeL)

* Clicking on the **Accordion** item and navigate to the **General** tab > enter your question in the Header text.

![](/files/bAxywdXoHWV2XjZkPrlC)

* Add the answer by dragging the **Paragraph element** to the **Accordion** item.

![](/files/nU95nDAPz4jfxf56w49b)

* Navigate to the **General** tab to type the answer into the Paragraph text box.

![](/files/tHr1XzSrmqM856uC0PxR)

Below is an example of an FAQ section using the Accordion element:

![](/files/5Zyq31GPONyG6fbwrPMs)

**3.2 Using Tab Element**

Use this element to categorize questions, such as "**Shipping**" or "**Sizing & Fit**".

* Navigate to the left menu > select **Elements** > go to the **PageFly** tab > select the **Tab** element and drag its variant to the canvas.

![](/files/HVzam1rzZY9ESOjJDgxE)

* Name your question categories by clicking on the Tab and navigating to the **General** tab > enter the category name in the **Header text** box.

![](/files/VotgcJgTOnkjqgb4Yu8P)

* Add the questions and answers for each category using the **Heading** and **Paragraph** element. Select them in the **PageFly** tab from the left menu and then drag and drop them to the **Tab** element.

![](/files/aNWqlnzAArrOaQGvr3Ub)

* Navigate to the **General tab** of Heading and Paragraph elements to add questions and answers.

![](/files/Ibxg83W48J6fLdHrAwKe)

Below is an example of an FAQ section using the Tab element:

![](/files/bRckwdKUSpQX4Yc6x6cq)

To save time, you can also use the FAQ section from PageFly's premade sections:

* On the left menu, go to **Page content** > hit the **Add section** button.
* Click **Template** > select "**FAQs**" in the Category dropdown menu > hit the **Select** button.

![](/files/JWJlg0rduYpLPpCTqel9)

* Customize the content in this section with your prepared FAQs.

![](/files/QEzNUwGhBERL5IyU1Oww)

#### Step 3: Save And Publish The Page

* After completing your page, click on the **Save** button to save your page.
* Click the **Publish** button to publish it.

![](/files/C6dn8vRrVWP1m67CwZHN)

* Check the live view by clicking the **Live view** button.

![](/files/W87ELL7LK2HXHgVlZwA8)

#### Step 4: Add FAQ Page To Your Shopify Store's Menu

Now your FAQ page is ready, let's add it to your Shopify Store's menu so your customer can access it:

1. Go to your Shopify dashboard > navigate to **Online Store** > Click on **Navigation**.
2. Decide where you want customers to access the FAQ page (Footer, Main Menu, Quick Links). In the following example, we choose Footer.

![](/files/rbNepCk4rFY8SG6Et6JM)

3. Click **Add menu item**.
4. Enter the name (FAQs) and select the FAQ page you created.
5. Hit the **Add** button and then click **Save menu** to save your change.

![](/files/nM3giZMwtTda0BBIJSMG)

### Use Cases

* **Customer Support**: An FAQ page helps answer common questions, reducing the number of support tickets and emails. Customers can find answers quickly, leading to higher satisfaction.
* **Product Information**: It provides detailed information about products, such as specifications, usage instructions, and troubleshooting tips, helping customers make informed purchasing decisions.
* **Shipping and Returns**: FAQs about shipping policies, delivery times, and return processes give customers clarity on what to expect, reducing confusion and potential disputes.
* **Company Policies**: An FAQ page can outline company policies, such as privacy, security, and terms of service, ensuring transparency and building trust with customers.

### Tips And Best Practices

* **Write Clear, Concise Answers**: Craft straightforward, easy-to-understand answers, avoiding jargon.
* **Optimize for Mobile**: Ensure your FAQ page is optimized for seamless viewing on mobile devices.
* **Include Relevant Visuals**: Add supporting images, graphics, or videos to illustrate concepts.
* **Link to Other Resources**: Include links to related pages like returns, shipping, and contact info.

### Frequently Asked Questions

**1. Can I customize the design of my FAQ page?**

Yes, PageFly allows you to fully customize the design of your FAQ page, including fonts, colors, and layout, to match your brand's style.

**2. What should be included in a FAQ page?**

A FAQ page should include common questions and answers about your products or services, shipping and returns policies, company information, and any other relevant details that customers frequently inquire about.

**3. How do I ensure my FAQ page is easy to navigate?**

Use elements like Accordions and Tabs to organize questions into categories. This helps visitors find the information they need quickly and efficiently.

**4. What is the difference between section and flex section (Gen 2)?**

Sections allow users to design page layout in row-column container structure and can be added both in PageFly Sections and PageFly pages. Flex sections, on the other hand, don't have row-column structure. It allows adding elements directly on PageFly pages and more flexible customized layout by Flex blocks.

### Version Update

In addition to the traditional page building mechanism (row, column), PageFly 4.23.0 adds Gen 2 Editor, a more flexible and efficient technology that allows creation of complex and highly customizable layouts, which comes with an intuitive and user-friendly interface.

### Additional Resources

* [How To Use PageFly | Get started in 5 mins](https://help.pagefly.io/manual/get-started-in-5-mins/)
* [Page Editor – Page Canvas | Contains All elements of your Page](https://help.pagefly.io/manual/page-editor-page-canvas/)


---

# 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.pagefly.io/pages-and-sections-creation/pages/how-to-create-faqs-pagefly-page.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.
