how to easily create a page in sitecore
Post on 24-May-2015
6.176 Views
Preview:
DESCRIPTION
TRANSCRIPT
Creating a Page in Sitecore
Sitecore is a Content Management system that allows you to easily create content for your site. You
can create content pages with different layouts and various components depending on your site
needs.
Creating a page in Sitecore is a simple and fast process after you figure out the two main
components: page location and template.
Where will your page be located?
Before you create your page, you will need to know the basic structure, the main areas, and subpages
of your site. After you know these, select the best location for the page.
What template is your page going to have?
The template of a page tells you how the elements of the page are distributed. In Sitecore, depending
on your site, you can choose among several templates.
In Sitecore, each subsection of the page is considered a placeholder; be sure that you also know the
names of the placeholders in the template you choose.
Now you’re ready to begin!
This guide will show you how to create a page in Sitecore and add content to it, including text and
images. Additionally you can see how to submit pages if workflow is activated.
Finally once the page is created, I am also going to show how to add a component to the left column
of the page.
Want more?
You can watch a step-by-step guide on how
to create a page in Sitecore on
Oshyn’s YouTube Channel
1) To start, log into Sitecore.
2) Next, navigate to the Parent Page.
For example: Content> (Your Site’s Name)>Home> Parent page (Image 1).
3) Right click on the parent page and you will see a menu, click on “Insert” (Image 2).
4) You can choose the page template you want to insert from the list of templates that appear in the
menu. You can also click on “Insert from template” and look for the template you want to insert.
Image 1
Image 2
5) In this case, I am going to add a “Simple Content page”, so I will click on this template in the
menu.
6) Then, I am asked to insert a name for the new page (Image 3).
7) Once the page is created you will see a form in the right side. Now, you can start editing the
fields to personalize your page (Image 4).
8) Insert the page title.
Image 3
Image 4
Image 5
Image 6
9) Then you can select if the page will be included in Main Navigation, the Sitemap, and if it is going
to be indexed for search. To do this, click on the corresponding checkboxes (Image 5).
10) In this template, you can select the text that will appear in the Top Navigation menu and in the
Breadcrumb. Insert the names as needed (Image 6).
11) Now I am going to insert the content for the page. First, I’ll insert the heading (Image 7).
Image 7
12) For the body of the page, the field shows “Show Editor” link. If you click on it, an Editor will be
shown. This editor is very simple, it even has the same basic edit buttons as MS Office (Image 8).
13) Now, let’s add some text and add some formatting, like bold or italics font (Image 9).
Image 8
Image 9
14) If you know HTML, you have the option to click on the “<>HTML” button and edit the HTML code
(Image 10). To switch to the default editor mode, just click on “Design” button.
15) From this editor, you can insert images. Sitecore has a Media Library that provides native asset
management for texts, images, videos and other files.
16) Just click on the icon for “Insert media item”. You will see the folders in the Media Library.
Navigate to where the image you want is located (Image 11).
You can also upload new images by clicking on “Upload button”. Then click on “Browse” and
navigate to the image location in your computer.
Image 10
Image 11
17) Once you are done editing the content, click on the “Accept” button (Image 12).
18) Next, click on the “Save” button in the top menu (Image 13).
19) Now we are going to publish the page. To do this, click on the “Publish” menu in the top menu.
Image 12
Image 13
20) Click on Publish and select “Publish site”. Note that if you have a workflow activated, Sitecore will
warn that the item you want to save is in “Draft” state. Just click “Cancel” (Image 14).
21) You will see a warning at the top of the page form and in the navigation you will see an icon next
to your page (Image 15).
Click on the icon and then click on “Submit”. If you want, you can enter a comment and then click
“OK” (Image 16).
22) Now the Item is in “Awaiting Approval” status. If you have the privileges, you can approve the
item by clicking on the item and then clicking on “Approve”. You have the option to enter a
comment and then click “OK”.
23) Now, publish the page. Click on Publish in the top menu and select “Publish site”.
Image 14
Image 15
Image 16
Once in the menu, choose “Smart Publish” to publish differences between Source and Target
database. Click on “Publish” and the publishing process will start (Image 17).
24) After the process is complete, click on “Finish” (Image 18).
Image 17
Image 18
25) Now we will check our work. Go the site, refresh the site and navigate to the page you just
created.
You’ll notice that the text in the Breadcrumb at the top of the page and in the left navigation menu
have the title I inserted earlier. The header of the page is the text I inserted for Heading and last,
the body of the page contains the text and images I inserted (Image 19).
26) Be sure to check the title displayed in top navigation menu, it should contain the text inserted in
Sitecore (Image 20).
Image 19
Image 20
27) Some of your templates may have items in the right rail added by default. In this example it’s the
booking widget (Image 21).
Editors can add other modules to the left or right rail of pages with three columns. Let’s add a
Facebook component to the left rail.
28) Go back into Sitecore and select the page we just created in the navigation (Image 22)
Image 21
Image 22
29) In the top menu, click on Presentation>Details (Image 23).
30) Click on “Edit” to add a new control to the page.
31) Select “Controls”. You will see the list of controls already added to the page. Each control is
located in a placeholder. For this example the component “Booking widget” is located in the
“right-rail” placeholder (Image 24).
Image 23
Image 24
32) I will add the Facebook component to the left rail, so I just click on “Add”. This will show a “Select
rendering” menu. In this menu navigate to the component you want to add and click on it.
33) In Placeholder, insert the name of the placeholder. I’ll use “left-rail” (Image 25).
34) Now click on “Select”. You’ll see that the new control now appears in the list of controls of the
page. Click “OK”, save the page and publish (Image 26).
Image 25
Image 26
Image 27
35) To check your work, go to the page and refresh (Image 27). You will see the Facebook
component, added to the left rail of the page.
You have now seen how to create a page in Sitecore, add content – including text and images – as well as how to add extra components to the page.
top related