Documentation
Request access

Build your first page

Create a practice page in the P1 editor, add a heading and a paragraph, and check that your work saved.

In this tutorial, you build a practice page in the P1 editor. You create the page, add a heading and a paragraph, edit their text, and check that the editor saved your work. You work in a practice Workstream, so nothing you do reaches your live site unless someone takes that Workstream live.

Before you begin

You need:

  • An Admin or Member role in your Business Account.

  • A practice Workstream named first-page-practice. Only an Admin can create a Workstream. If you're an Admin, create it; otherwise, ask an Admin to create it for you.

  • The Heading and Paragraph blocks on your site. These come from the P1 component library, a set of ready-made blocks your developer can add. New sites may not include them automatically. If you aren't sure your site has them, ask your developer before you start.

Open your Workstream

  1. 1

    Go to your site's address followed by /p1, such as https://www.example.com/p1, and sign in.

  2. 2

    In the header, open the Workstream switcher (1) and select first-page-practice.

    The P1 editor with the Workstream switcher open, showing 1 numbered area: 1 the Workstream switcher.

    The switcher shows first-page-practice. If it shows Live or another name, select first-page-practice before you continue.

Create the page

  1. 1

    In the header, select the page name, or Select a page if no page is open.

    The page navigator opens with a list of pages.

  2. 2

    Select + New page.

    A dialog opens with a Start from list.

  3. 3

    Select Blank page.

  4. 4

    In Page title, enter My first page.

    The URL slug, the end of the page's address, fills in as my-first-page.

  5. 5

    Select + Create page.

    The editor opens your new page with an empty canvas.

Add a heading

  1. 1

    In the left panel, select Blocks.

    The P1 editor's Blocks panel with the Typography category open, showing 2 numbered areas: 1 the Heading block, 2 the Paragraph block.

    The panel lists blocks by group. Heading (1) is under Content. If you don't see Heading, stop and ask your developer to add the component library's Heading and Paragraph (2) blocks.

  2. 2

    Drag Heading onto the canvas.

    The canvas shows a heading that reads "A heading to anchor the section".

  3. 3

    On the canvas, click the heading text. The Heading block has no text field in the right panel, so you edit its text on the canvas.

  4. 4

    Replace the text with Welcome to our spring sale.

    The heading reads "Welcome to our spring sale".

  5. 5

    In the right panel, change the heading level from H2 to H1. H1 is the page's main heading.

    The right panel shows H1.

If you drop a block in the wrong place or change the wrong text, select Undo in the toolbar.

Add a paragraph

  1. 1

    In the left panel's Blocks view, drag Paragraph onto the canvas, below your heading.

    A paragraph appears below the heading, starting with "This is a paragraph."

  2. 2

    On the canvas, click the paragraph text, and replace it with Everything in the store is 20% off this week.

    The paragraph reads "Everything in the store is 20% off this week."

Check your work

  1. 1

    In the left panel, select Outline.

    The P1 editor with the Outline view open beside the page, showing 2 numbered areas: 1 the Outline list, 2 the page on the canvas.

    The outline (1) lists Heading and then Paragraph, in the order they appear on the page (2).

  2. 2

    Wait at least 5 seconds after your last edit, then reload the page in your browser. The editor saves your changes on its own about 3 seconds after you stop editing. There's no Save button.

    The page still shows your heading and paragraph.

What you built

You built a page named "My first page" in a practice Workstream. You edited a heading and a paragraph on the canvas and set the heading level in the right panel. You also saw that the editor saves on its own and that the outline shows the page's structure.

Your page isn't on your live site. Don't select Go live or Go live: this page only in this Workstream: both send changes to Live, where visitors see them. When you're done practicing, ask an Admin to archive first-page-practice. To learn how your team takes real work live, see Workstreams.

Troubleshooting

The block list has no heading or paragraph block

Your site doesn't have the component library's Heading and Paragraph blocks yet. Ask your developer to add them, and share the P1 component library page.

Document already exists at this path

A page with the slug my-first-page already exists, often from an earlier try. Open that page from the page navigator and continue, or change the URL slug, such as my-first-page-2.

Your changes are missing after you reload

You might have reloaded before the editor saved, or edited in a different Workstream. Check that the switcher shows first-page-practice, open My first page from the page navigator, and make the change again. Wait at least 5 seconds before you reload.

Next steps