Simple FAQ page

#Overview

This guide shows how to create an FAQ model that lets you add pre-created Q&A pairs to form a list.

You'll create two models: one model to store the Q&A pairs, and a model that will let you add Q&A pairs through reference fields to form a list.

Simple FAQ page

This recipe is a great option if you prefer to work on Q&A pairs as individual content pieces that you can easily add to another model to create the FAQ list.

This mock image shows what a frontend using this setup could look like:

Mock image

#Prerequisites

• REQUIRED: You need to have a Hygraph account. If you don't have one, you can sign up here.
• REQUIRED: You need to have a Hygraph project. Look into the following section to learn more about your options.

#What you can do

Use this guide to create a Simple FAQ Page model. You have two options:

• OPTION 1: Create a project. This is the way to go if you want to follow the entire tutorial for learning purposes.
• OPTION 2: Use an existing project of yours. This is the way to go if you already have a project and want to add this model. In this case, you may need to adjust parts of the tutorial to your own project schema.

#Not in the mood to start building?

Clone the entire cookbook

This is the way to go if you're curious about how we built the FAQ recipes but don't want to follow the step-by-step creation process. This project contains the entire FAQ Cookbook so you can compare recipes or look into what instances they contain.

#Core concepts

In this guide, you'll work with different schema elements to create a Simple FAQ Page model. Let's look into them:

• Model: Your schema is the content structure of your project. You can define your schema by creating models, adding fields, reusable components, and sidebar widgets, integrating remote sources, and establishing relationships with other models.
• References: References are relations between two or more content entries in your project. With references, you can reuse content entries by connecting them. Once the relation is configured, you can also create related content directly from the content form.

#Step-by-step guide

This video follows the same step-by-step tutorial offered in this document.

#1. Create the FAQ list model

This model will let you create Q&A pairs as content entries.

To create the model, navigate to the Schema builder and click +Add next to Models. Use the following information:

Click Add Model to save.

Now that the model has been created, you can start adding fields to it.

We will add a Single line text field to use as question, and a Rich Text field for the answer.

Let's start with the question. Add a Single line text field from the right sidebar, and use the following information:

Click Add to save.

Next, you want include a rich text field for the answer, which will also allow some formatting. Add a Rich text field from the right sidebar, using the following information:

Click Add to save.

We chose to create the FAQ list as a model because in a use case like this, we want to create question & answer sets as content entries that can be easily referenced in other models later on. In the next step, we will create the Simple FAQ Page Model with a reference field that connects this model, which will allow editors to quickly set up FAQ landing pages using existing data.

#3. Create the FAQ page model

To create the FAQ Page model, navigate to the Schema builder and click +Add next to Models. Use the following information:

Click Add Model to save.

This model will contain only two fields: a Single line text field for the page title, and a Reference field to add Q&A pairs from the model you created in the previous step.

Let's start with the title. Add a Single line text field from the right sidebar, and use the following information:

Click Add to save.

This configuration ensures that all FAQ Page entries contain a unique title that will allow easy identification in the content form.

Next, you will create a reference field that will allow editors to add content entries from the model you created in the previous step.

Add a Reference field from the right sidebar, using the following information:

Click Add to save.

Your model is ready! This is how you build a Simple FAQ Page model that lets you easily add Q&A pairs through a reference field.

#Resulting content form

If you followed this tutorial, your resulting content form should look like this:

Resulting content form

Editors will be able to easily create FAQ pages by referencing Q&A pairs from the FAQ List model.

#Useful links

• References documentation