Creating the page URL for the landing page

In this lesson, you use the Commerce Composer tool to create a page. One of the key advantages of the Commerce Composer tool is that you can create a new page for your store whenever you want, without involving IT.

About this task

To create a page, you provide a name, a keyword to use in the URL, and optionally, some SEO metadata. Think of a page as just a URL, with no content. Later on in this tutorial, you can create a layout for the page so that the page has content.

To learn more about the concept of pages in the Commerce Composer tool, read the following topic:

To create the page URL for the landing page:

Procedure

  1. Open Management Center.
  2. From the Management Center Tools menu, click Commerce Composer.
  3. If you are prompted to select a store, select the Aurora starter store that you published to do this tutorial.
  4. Create a folder in which to store your new landing page:
    1. In the explorer view, right-click the Content Pages folder, and then click New Content Page Folder.

      New content page folder menu item
    2. In the Name field, type Landing Pages.
    3. Click Save and then click Close.
    4. In the explorer view, expand the Content Pages folder to display your new Landing Pages folder:

      Landing pages folder
      By creating subfolders under the main Content Pages folder, you can organize your content pages so that they are easy to find.
  5. Create your landing page:
    1. In the explorer view, right-click the new Landing Pages folder, and then click New Content Page.
    2. Complete the fields for your page:
      Page name The page name is an administrative name that identifies the page in the Commerce Composer. This name is not displayed on the storefront.

      Type the following name:

      Women Summer Designers Page

      URL keyword For every new page, you must specify a unique keyword to use in the page URL.

      Type the following URL keyword:

      women-summer-designer-fashions

      As a result, this is the page URL:

      http://hostname/webapp/wcs/stores/servlet/en/aurora/women-summer-designer-fashions

      Tip: To see the URL, click Save. The URL is displayed beneath the URL keyword field.
      Page title The page title is a unique descriptive name for the page that is displayed in the browser title bar. In the page HTML, this content is inserted in the <title> tag.

      Type the following page title:

      Designer Fashions for Women | Aurora

      Meta description The meta description is a short description of the page to help search engines and your customers understand the page content. Some search engines display the meta description in the search results. In the page HTML, this content is inserted in the meta description tag.

      Type the following meta description:

      Designer fashions for women are on sale at Aurora. Shop the latest trends in dresses, handbags, shoes, skirts, and accessories. Free shipping all this month.

      Meta keyword Meta keywords describe the contents of the page. Some Internet search engines use these keywords to determine whether your page satisfies a search query.

      Type the following meta keywords:

      women, designer, fashion, summer, Gusso, Valenti, Hermitage, Versatil, dresses, handbags, pants, shoes, hats, sunglasses

  6. Click Save and Preview.
    • A URL is created for the page in your store that uses the URL keyword and SEO data that you entered.
    • Store preview opens directly to your new page.

    Store preview that is showing default layout
    Notice that the page has a header and footer, but no content. This result is because the new page does not have a layout that is assigned to it yet. When you create a new content page, the page automatically uses the default layout for all content pages.

    For the Aurora starter store, the default layout has just one empty e-Marketing Spot in a single column for content. In this tutorial, you will leave the default layout empty, and then create and assign a layout that is based on a more complex, multi-column template.

  7. At the top of the store preview window, click Show Layout Information.

    The Page and Layout Information window opens. When you view a page in store preview, you can open this window to find out whether the default layout or an assigned layout is applied to the page. In this case, the default layout is applied:


    Page and Layout Information window
  8. Close the Page and Layout Information window.
  9. Close the store preview window.
  10. Optional: Review the SEO metadata in the page HTML:
    1. In the properties view for the new page, under the URL keyword field, copy the URL.

      Page and Layout Information window
    2. To close the properties view for the page, click Close.
    3. Open a new browser window, paste the URL into the address field, and then press Enter.
      The store page is displayed in the browser window.
    4. In the browser title bar, notice that the page title matches your entry in the page title field, Designer Fashions for Women | Aurora.
    5. Right-click anywhere in the page content, and then click View Page Source or View Source.
    6. To open the find field, type Ctrl + F.
    7. To locate the metadata that you provided for your page, in the find field, type Designer.
      Your search highlights the following snippet of code in the page HTML, which contains the page title, and the meta description and keywords that you provided:
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>Designer Fashions for Women | Aurora</title>
      <meta name="description" content="Designer fashions for women are on sale at Aurora. 
      Shop the latest trends in dresses, handbags, shoes, skirts, and accessories. 
      Free shipping all this month."/>
      <meta name="keyword" content="women, designer, fashion, summer, Gusso, Valenti, Hermitage, 
      Versatil, dresses, handbags, pants, shoes, hats, sunglasses"/>
      <meta name="pageName" content="Women Summer Designers Page"/>

      Search engines use this metadata to locate and describe your page.

    8. Close both browser windows that display your page source and your page.

Results

In this lesson:
  • You created a page and added SEO metadata to the page.
  • You previewed the empty page in store preview and used the Page and Layout Information window to confirm that the default layout is applied to the page.
  • You viewed the SEO metadata in the page source.

In the next lesson, you will begin creating the layout for the landing page.