Create pages for your website

Overview

In addition to customizing the sample OSLO pages, you might want to add new pages either at the top level or child pages to existing Oslo pages. You might also want to remove the OSLO pages that you don't want for your site. The following tutorial shows you how to add new pages with existing page types and layouts, create additional layouts for existing page types how to remove the OSLO sample pages.

Before you begin

To get started, you need:

• Your Acoustic Content trial or standard edition. To get a free trial version or to upgrade to standard, go to Acoustic Content.
• Install a Node environment with a recent stable version greater than Node >= 8.
• Access to the site application code. To access the code download Acoustic Content Sites single page application. For more information about working with the source files, see wch-site-application/README.md.
• For more information about setting up your development environment, see Setting up your development environment. For more information about developing sites with Content, see Acoustic Content Sites Customization Programming Model.

Create new pages and child pages with existing page types and layouts

Complete the following steps to add a new top-level page.

1. In the Content UI, go to Sites > Site manager, click New page.
2. Select a Page type. For example, select the Standard page and click Next.
3. Provide a Page name, a Page title, a Page description, and select a layout.
4. Click Create. A draft page is created and added to the navigation.
5. To add content to the page, from the site manager for the page that you created click the Page actions menu > Edit content.
6. Click Find to add content that is already available and published in the Acoustic Content.

📘

Note:

You can also create and add new content by clicking Compose and by selecting a content type and adding content to the elements in the content type. For the content to render in the preview, the content-type must be mapped to a layout.

Complete the following steps to add a child page.

1. For a top-level page where you want to add the child page, open the Actions menu > Create child page.
2. Select a Page type. For example, the Standard page type and click Next.
3. Provide a page name, select a layout, and click Create.
4. A draft child page is created. Add content and publish the page.

You can control what pages show in the navigation. You can hide pages from the site navigation but can still access the page on the site. For more information, see Creating and editing pages.

Before you publish the page, you can also set up a review for the page and its content.

📘

Note:

If any of the content that you added is in the draft state, you will be prompted to Publish the content along with the page.

Remove existing Oslo pages

To remove the samples Oslo pages that you don't want, from the Content UI, for the page you want to remove open the Actions menu > Remove page. The page and its child pages are deleted.

📘

Note:

The remove page option from the Actions menu does not remove the Design article pages.

To remove all the Design article pages, complete the following steps.

1. Open the Primary navigation menu, and go to Developer > Content types > Dynamic list. Click the Settings tab on the form and then click the element Content to include. Clear the This element is required field in the Basic tab.
2. Go to Developer > Content types > List and edit the settings for the element List items. Clear the This element is required field in the Basic tab.
3. Go to Content > All content > Selected articles and create a draft and remove all references from the list and publish the changed item.
4. Now you can remove all the pages from the Oslo sample site from the Site composer.

Change the default home page

When you access the sample website, the home page is opened by default. When you customize the sample site and edit the home page or delete it, you might not want your site to open to that page by default. You can change the default page by completing the following steps:

1. Go to your local development environment, open the src/app/app.module.ts in a text editor.
2. Find the pageRoutes constant. For example,

const pageRoutes: Routes = [
{path: '', redirectTo: '/home', pathMatch: 'full'},
{path: '**', component: PageComponent}
];

3. Set the redirectTo value to the new page path value. For example, replace home with the new page path value in the example code.
   To find the path value of a page, in Content UI open Site Manager > Page actions menu > Edit page settings.

📘

Note:

You must include the "/" in the value.