In this lesson, you will attach the components built in lesson 4.1 to the Product, Landing page, and Navigation models. After this lesson, the schema is structurally complete.

#Product

The Product model receives two component fields: Product Variant and Related Products as basic component fields. Both are basic because each field always contains a single, fixed component type — there is no editorial choice about which component fills the field.

1. In the Schema editor, open the Product model.

2. From the right sidebar, add a Basic component field with the following information, and click Add to save:

   Field	Input
   Display Name	Product Variant
   API ID	ProductVariant
   Select component	Product Variant

3. Add a second Basic component field with the following information, and click Add to save:

   Field	Input
   Display Name	Related Products
   API ID	RelatedProduct
   Description	Add related products
   Select component	Related Products

Your Product model should now look like this:

Finished Product model with fields

#Landing page

The Landing page model receives a modular component field called Stripes. It is modular because editors need to choose which component fills each section, either a Call to Action or a Product Grid. Allowing multiple values means editors can add as many sections as needed, in any order.

1. In the Schema editor, open the Landing page model.

2. From the right sidebar, add a Modular component field with the following information, and click Add to save:

   Field	Input
   Display Name	Stripes
   API ID	stripes
   Description	Sections
   Allow multiple values	Select checkbox
   Select allowed components	Call to Action, Product Grid

Your Landing page model should now look like this:

Finished Landing Page model with fields

#Navigation

The Navigation model was left incomplete in lesson 1.2. It has a Nav ID field but no way to hold navigation links. The Link component built in lesson 4.1 is what completes it.

1. In the Schema editor, open the Navigation model.

2. From the right sidebar, add a Basic component field with the following information, and click Add to save:

   Field	Input
   Display Name	Nav Link
   API ID	navLink
   Description	Navigation links
   Allow multiple values	Select checkbox
   Select component	Link

The Allow multiple values setting is what enables the navigation to hold multiple links. Each link added in the content editor is a separate instance of the Link component.

Your Navigation model should now look like this:

Finished Navigation model

Every model has the fields, references, and component fields it needs.

#What's next

Lesson 5 - Remote Sources

Or, go to the Tutorial overview for the full lesson list.