Walkthrough: Create a page

Version: 9.0

This topic describes how to create a simple page in SPEAK. The result is a basic "Hello world" page, but the procedures described here are the foundations for creating any SPEAK page or application.

Note

You need to install Sitecore Rocks for Visual Studio to create pages in SPEAK.

Remember that SPEAK is in the core database.

You should not create a new SPEAK page by copying an existing page. It can work for very simple pages, but for more advanced pages, it is difficult to identify all the configuration settings that you need to update.

The walkthrough outlines how to:

  • Create a definition item

  • Set up the layout for a page

  • View the page in a browser

The walkthrough shows you how to use a branch template. This is the quickest way to create definition items.

Create a definition item

Follow these steps in Sitecore Rocks:

  1. Select the item that you want to be the parent item of the new definition item:

  2. Right-click the parent item and click Add, New Item in the menu (or use the

    ctrl-A

    keyboard shortcut)

  3. In the Add New Item dialog, select one of the page template branches in the /sitecore/client/Business Component LIbarary/Templates/Branches/Applications folder:

  4. Enter a name for your new item, and click OK.

Your item is created and opened:

You have now created a page from a branch template. The next task is to add components to the layout of this page.

Set up the layout for a page

In Sitecore Rocks, follow these steps to add components to the layout:

  1. In the Sitecore Explorer, locate the relevant definition item.

  2. Right-click the item and click Task, Design Layout from the menu (or use the

    Ctrl-U

    keyboard shortcut).

  3. In the layout of the definition item, click Add Rendering.

    Because you have started from a branch template, there are a number of components already in the layout. The layout contains everything a functional SPEAK page needs.

  4. In the Select Rendering dialog, select Text, and then click

    The Text rendering is now in your layout with the name Text1.

  5. Double-click the Text1 rendering in your layout, and in the property sheet for the rendering, enter "Hello world" in the Text property.

  6. In the property sheet, click Close and save everything.

You now have a SPEAK page that displays the text "Hello world."

View the page in a browser

To preview the page in a browser:

  1. Open the web site in a browser.

  2. Right-click the definition item in the Sitecore Explorer in Sitecore Rocks, and click Clipboard, Copy Item Path:

  3. Paste the content of the clipboard into the address field of the browser.

    The updated page is displayed in your browser.

Do you have some feedback for us?

If you have suggestions for improving this article,