SXA Page Design Creation : Tutorial 7

Till the previous post, we are done with Implementation of Partial Design required for our site, now will add the partial designs to Page Design.

But before implmentation, let's discuss Page Design

What is Page Design?

"Page design is used to group partial designs, it's kind of layout - where we add multiple partial designs and apply this page design to the page."

Flow:

In descending order, the list of components is used to create the partial design and the list of partial designs are used to create page design.

• Page Design

• List of Partial Designs

• Partial Design

• List of Components

When to use?

"When we wanted to reuse the list of components together so we add them in partial design, and when we need to reuse more than one partial designs together then will add them in Page design."

Now let's start the creation of Page Design for our site, so first create page design as defaultPageDesign by going at path "/Sitecore/content/demosite1/mydemosite/Presentation/Page Designs"

and add partial design as PartialHeader and PartialFooter to the Page Design, now save and come to the Home page and select page design to this page.

and apply this change to the Home Page

 now open it as preview mode

Now I wanted to apply this page design changes on all the pages as default, for that let's look into Home's Standard Value

and if you see page design changes is getting applied from Page template's standard value

so here I'm applying page design changes to the Page template's standard value

Now, this changes are applied to all the existing pages and new page when we will create in future.


Till now we are done with page design creation and their usage.

In the next post, will add rendering components to the pages as per our need in the body (main) section...