WebTemplate training materials - Lab 3 - Creation of WebTemplate for WCM site
This post is lab 3 from series of training materials for WebTemplate creation and maintenance. Please check the following posts for details and other exercises. Notice that you can download full package with all required lab material from link available in introduction post. This package contains all supplementary materials and labs in word format.
- WebTemplate training materials – Introduction to material
- WebTemplate training materials – Lab 1 - Creation of features and basic structures
- WebTemplate training materials – Lab 2 - Creation of custom navigation control and master pages
- WebTemplate training materials – Lab 3 - Creation of WebTemplate for WCM site
- WebTemplate training materials – Lab 4 - Upgrading existing sites with feature versioning
This particular post will concentrate on following functionalities.
- Creating WebTemplate for Event site
- Adding custom page layout which is used in WebTemplate to our solution
- Creating required features and associations to onet.xml files for the WebTemplate
Lab 03 – WebTemplates and Page Layouts
The project files for this lab are in the ‘C:\Student\Labs\03_WCM’folder
Lab Objective
Lab Overview: In this lab you will create actual WebTemplate and add custom page layout for it to be used automatically when site is created based on it.
Additional Resources
This lab includes the following additional resources:
Starter Files |
C:\Student\Labs\03_WCM\StarterFiles |
Files that can be used to help complete the labs. |
Source Code |
C:\Student\Labs\03_WCM\Solution |
Completed lab source code for the status after this lab |
Solution structure |
C:\Student\Labs\Contoso.Intranet\ |
Solution structure started in previous exercise. |
Getting Started
Notice that all code and xml elements which are meant to be copied are available as text in the Word documents. This means that if you need to copy any of those elements, it’s better to use Word document formats of these labs.
This Hands-On Lab contains a number of additional resources in fixed locations. By default, it is assumed that the base HOL directory is C:\Student and that the labs and additional resources are located under this directory.
The default working folder for this lab is ‘C:\Student\Labs\03_WCM’ .
Please notice that this exercise is assuming that you have environment with url https://intranet.contoso.com in your usage. If you use some alternative url, you’ll have to update scripts and use correct entries in exercises to make exercise to work properly.
Lab Setup Instructions
In the lab setup you will execute a PowerShell script that will create a new SharePoint site collection.
1. Start the Virtual Machine in Hyper-V.
2. Log on to the Virtual Machine as the local administrator with a user name of Contoso\Administrator and a password of pass@word1.
3. Open Windows Explorer and browse to the location C:\Student\Labs\Contoso.Intranet, in the folder double click Contoso.Intranet.sln to start the previously created solution structure.
- This step assumes that you have already created lab 1 & 2 based on the lab guidance’s, so that we can continue building up the customization package.
- Notice also that package contains full source code status after lab 2 in folder C:\StudentWebTemplate\Labs\02_UI\Solution\Contoso.Intranet - Lab 2 which you can copy as your starting point if you want to skip previous labs completely.
Exercise 1 – Creating Event Page Layout
In this exercise we’ll create page layout for the event content type, which was created earlier. This way content editors can easily create new events, which have nice editing experience for setting up metadata.
Task 1 – Adding page layout module
1. Expand the SPIs folder and Modules folders located in Contoso.Intranet project
2. Right click Modules and choose Add – New Item…
3. Choose Module and name it as EventPageLayout
4. Click Add
5. Select Sample.txt under the EventPageLayout module and delete it
6. Right click EventPageLayout and choose Add – Existing Item…
7. Browse to folder c:\Student\Labs\03_WCM\StarterFiles and choose ContosoEventPage.aspx
8. Click Add
9. Double click ContosoEventPage.aspx in the solution explorer and review its content
· This file defines the layout for individual event. Event fields have been associated to the page layout already
10. Double click Elements.xml file and update the content as in following code snipped
We are defining properties for the file to be uploaded. These are not SPFile or SPPageLayout properties, rather column values for the file, which will be available in document library. In this case we define few additional properties (Page Layout and PublishingAssociatedContentType) so that page layout is properly available for pages created in the portal. Notice also the Url attribute for the Module. This defines target of the file to be provisioned. Since we are provisioning page layout, we’ll need to set the target to _catalogs/masterpage. |
11. Expand SPIs and ContentTypes folder in Content.Intranet project
12. Open Elements.xml file located under Event content type
13. Copy the ID of the content type to clip board – we’ll need to update this to page layout module
14. Move back to Elements.xml file located under the EventPageLayout module
15. Locate [ContentTypeId] string in the value of the PublishingAssociatedContentType property
16. Replace the tag with the just copied content type id of the event content type like in the following snipped - Since we’ll need to associate page layout to content type, we’ll need to ensure that the IDs will match. Notice that we’ll need to leave the hash and other chars in place.
- Note. Don’t directly copy identifier as below, since value depends on your environment
17. Save changes
18. Expand Features node in the project structure and open up WebPublishingBinding feature in designer mode
19. Remove all other SPIs from this feature than the PublishingBinding, ifthere’sany other SPI’s
20. Open up SiteMainResources feature and ensure that all other SPIs except the PublishingBinding SPI is associated to it
21. Save changes
Task 2 – Testing page layout in the portal
1. Right click Contoso.Intranet project and choose Deploy
2. Ensure that deployment was successful from the output window
3. Open up Internet Explorer and move to address https://intranet.contoso.com · Depending on the master page currently defined on the portal, you might run into minor issues after deployment. If you’re unable to access the front page, perform following steps
- Move to address https://intranet.contoso.com/\_layouts/settings.aspx
- Click Master Page under Look and Feel
- Choose v4.master for both of the master page types
- Click OK
- Move back to Visual Studio and redeploy you’re customizations
- Move back to https://intranet.contoso.com
4. Move to Site Settings from Site Actions menu
5. Click Master Pages and page layouts under the Galleries selection to ensure that Event page layout was successfully deployed – ContosoEventPage.aspx in the gallery
6. Move back to Site Settings
7. Click Page Layouts and site templates under the Look and Feel section
8. Under the New Page Default Settings, select Event Page layout to be the default page for new pages
9. Click OK
10. Select New Page from the Site Actions menu
11. Set name as MyExampleEvent - Note. If you’re currently using the custom Contoso master page, it has minor issues with the popup rendering due missing popup style definitions. Don’t mind those.
12. Click Create
13. Notice the Event related fields on the page layout, like Event Location and Event Date · Now we have successfully deployed also our page layout to site collection
Exercise 2 – Creating WebTemplate
In this exercise we’ll create new farm scoped web template, which will be used to create Event site for Contoso Intranet. We’ll use some previously created xml files to make the exercise easier. Web
Task 1 – Creating SPI for the Event WebTemplate
In this task we’ll create SPI for the web template and define the new site creation instruction, which we can use in following steps to create event sites.
1. Move to Visual Studio side
2. Expand SPIs folder and create new sub folder called WebTemplates
3. Right click WebTemplates folder and choose Add – New Item…
4. Choose Empty Element and name it was EventWebTemplate
5. Right click EventWebTemplate SPI and choose add existing Item
6. Browse to c:\Student\Labs\03_WCM\StarterFiles and select onet.xml file
7. Click Add
8. Activate onet.xml file in Solution Explorer and review the Property window. Notice that currently Deployment Type is NoDeployment – Update the property as ElementFile
9. Double click onet.xml file and review its content · Notice that there’s already definition to use the Contoso master as chrome master (ChromeMasterUrl property) in one of the features and there’s also default page layout definition also in place (DefaultPageLayout property).
If you’re familiar with Site Definitions from the 2007 version, this should seem familiar as well. Key difference is between site definitions and web template is the flexibility of the web templates in sense of customization updates and technically web templates don’t support definition of modules in the onet.xml. We can however provision modules for the site using associated features. This is done in the following task. Check more concerning differences and usage models from my previous blog post. |
10. Open Elements.xml file under the EventWebTemplate
11. Update the content as in the following snipped
- Notice that since our WebTemplate is publishing template, we will use out of the box publishing template as the base template for future upgradability purposes (helps to movement to o15)
12. We’ll need to still modify the provisioning model of the WebTemplate. Right the Features node in the Contoso.Intranet project and choose Add Feature
13. Rename just created feature as FarmEventWebTemplate · In this case we deploy our Web Template to be available farm wide. You can also deploy WebTemplates using site collection scoped feature.
14. Open up feature designer (if not open, double click just created feature) and set initial properties as follows
- Title – Contoso.Intranet Farm Event Web Template
- Description – Deploys new event web template to be available in farm
- Scope - Farm
15. Associate EventWebTemplate to feature
16. Open up WebPublishingBinding feature and ensure that EventWebTemplate SPI is not associated to it or to SiteMainResources feature
17. Save changes
Task 2 – Creating default feature and welcome page for the web template
In this task we’ll create default feature for the Event web template, which is responsible of deploying the default.aspx page for the site.
1. Right click Features node and choose Add Feature
2. Rename feature as WebEventWebTemplateDefault
3. Set properties of the feature as following
- Title – Contoso.Intranet Web Event Web Template Default resources
- Description – Default provisioner for the Event web template
- Scope – Web
4. Expand the SPIs and Modules folders
5. Right click Modules and choose Add – New Item…
6. Select module SPI type and name it as EventWebTemplateDefaults
7. Delete Sample.txt under the EventWebTemplateDefaults module
8. Right click EventWebTemplateDefaults and choose Add – Existing Item…
9. Browse to c:\Student\Labs\03_WCM\StarterFiles and choose default.aspx and event1.aspx
10. Click Add
11. Open Elements.xml file located under the EventWebTemplateDefaults and update the xml as in the following snipped
12. Open WebEventWebTemplateDefault feature, set Is Hidden to True and copy the Feature Id from the properties window to clip board
13. Ensure that EventWebTemplateDefaults is listed in the Items in the Feature section and add also PulishingBinding SPI to the feature. IMPORTANT – Ensure that binding SPI is above the EventWebTemplateDefaults like in below picture. You might have to do some re-associations in the designer to achieve this.
14. Open onet.xml file located under the EventWebTemplate SPI
15. Locate following string from the onet.xml file: <!-- Default page module reference -->
16. Place Feature reference just underneath the marker as in the following snipped. Note that feature ID in your case is different, since it’s randomly created during feature creation · This will ensure that feature is automatically activated when the web template is used for site creation
Task 3 – Add feature receiver to define initial settings for provisioned site
In this task we will stamp the site with custom property bag entry for traceability purposes using object model. You can then use this information in future to ensure that particular site has been created using specific WebTemplate.
Notice also that since we updated Web scoped feature to be hidden, you can use that as your versioning feature…. Those sites which has that feature enabled, are created using specific template and therefore you can version WebTemplate using this feature with feature upgrading definitions.
1. Right click WebEventWebTemplateDefault feature and choose Add feature receiver…
2. Remove all other methods, but replace FeatureActivated method as follows · Notice that we store the Name attribute value of the WebTemplate to property bag
3. Save changes
Task 4 – Deploy and test the structures
In this task we’ll create default feature for the Event web template, which is responsible of deploying the default.aspx page for the site.
1. Right click Contoso.Intranet project and choose properties
2. Move to SharePoint tab
3. Update Active Deployment Configuration as No Activation and uncheck also the Auto-retract after debugging to make future debugging experience little bit faster
4. Save all changes
5. Right click Contoso.Intranet and choose Deploy
6. Ensure that deployment was successful from the Output window
7. Move to internet explorer and to address https://intranet.contoso.com
8. Move to Site Settings page from the Site Actions menu
9. Move to Site Collection features under the Site Collection administration
10. Activate Contoso.Intranet Site Main Resources feature
11. Move back to Site Settings page
12. Click Page Layouts and site Templates under the Look and Feel
13. Add Events Site as one of the available site types
14. Click OK
15. Move back to front page of the site collection
16. Choose New Site from the Site Actions menu
17. Choose Events Site and define the properties as follows
- Title - Events
- Url - Events
18. Click Create - Creation of the site will take a while
19. Click Example Event from the left menu
20. Notice how we provisioned example template for event, with initial settings for Location and Title
21. Switch page to Edit mode
22. Notice how you can use specific controls to edit the event information
23. Save changes of the page
24. Choose New Page from Site Actions menu and ensure that default settings for the page layout were successfully applied so that our custom page layout is used by default
If you find any issues on the lab, please add comments below, so that we are able to fix them as fast as possible. You can also suggest any enhancements for the lab, but due other on-going projects, I can’t promise to have time to include them. Thanks for your comments and feedback advance.
- Vesku
Comments
- Anonymous
September 11, 2013
The comment has been removed