Creating an EPiServer site in EPiServer CMS differs a lot from the procedure in previous versions. A number of steps have been taken to minimize the need for manual editing and administration. The following guide will take you through the process of creating a new EPiServer CMS 6 site from scratch using Visual Studio 2008.

Please Note! that íf you are creating a new EPiServer CMS 6 project on Windows Vista, Windows 7 or on a server computer running Windows Server 2008 R2, you will need to run Visual Studio 2008 as an Administrator - in order for it to work correctly.

 Creating Your Project

  1. Open Visual Studio (see requirements). Select File, New Project...

    Image of a newly created project in Visual Studio


  2. Expand the Visual C# section, select EPiServer and you should see the template package for EPiServer. Select a Name (do not include any special characters, spaces, comma, underscore or dots in the name).

    Image of options for creating a new project in Visual Studio.

    This name will also be the root namespace in the project. Click OK and a Visual Studio project will be created for you.





  3. If you click F5 at this point, the site should start in debug mode using the built-in ASP.NET engine in VS 2008, and shows the directory listing. The reason that you see the directory listings is that there is no default document in the site yet.

Creating a Masterpage

  1. Start off by adding a Masterpage to your project. Right click your project node and select Add, New Item...
  2. Choose the Visual C# root node in the Categories view and select the Masterpage template.
  3. Name your template (in this example we will name the Masterpage Masterpage.master) and click Add.

    Image of adding a Masterpage.

Creating a Default Page

  1. Let’s add the default document, a default.aspx to the root.
    Right click your project root node and select Add, New Item...

    Image of adding new item menu.

  2. Select the EPiServer category, and the Page Template file type. Name it default.aspx:

    Image of page template options in Visual Studio.

  3. EPiServer notices that you’re adding a template file and asks you if you want to add a page type for this template in the database:

    Image of registering a PageType choice dialog.

    Click No.

  4. Alter the first line in the markup (containing the page definitions) and add a MasterPage statement. Then add some code to print a text and the page ID as follows:
    CopyC#
    <asp:content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
        This is the start page. It has the id <%= CurrentPage.PageLink.ID.ToString() %> </asp:content>
    Make sure that you remove the comment line that instructs you on how to
    add a masterpage directive.

    If we open the code-behind file we will see that EPiServer has added the correct base class for the template page, in addition to some of the more common using statements for EPiServer templates.

    CopyC#
    using System;
    using System.Collections.Generic;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.HtmlControls;
    using EPiServer;
    using EPiServer.Core;
    using EPiServer.DataAbstraction;
    using EPiServer.Web.WebControls;
    
    namespace EPiServerDemo
    {
        public partial class Default : EPiServer.TemplatePage
        {
            protected void Page_Load(object sender, EventArgs e)
            {
            }
        }
    }


Creating Roles and Users

  1. Before we can create users and roles, we need to select the correct provider. In Visual Studio, Solution Explorer, click the ASP.NET Configuration button (Image of the button opening up ASP.NET configuration.) This will open the Web Site Administration Tool:

    Image of the webadmin interface.
    Click the Provider tab and click Select a different provider for each feature (advanced)
  2. On the next screen, select SqlServerMembershipProvider as Membership Provider and SqlServerRoleProvider as Role Provider.

    Image of the webadmin interface, choosing providers.
  3. The next step is to add a user to the system so we can log in and view our site in Edit and Admin mode.
    Click Security and choose Create or Manage Roles.

  4. Add the "WebAdmins" role:

    Image of the webadmin interface, adding a role.


  5. Click Security, Create User:

    Image of the webadmin interface, adding a user.

    In this example we are creating an "epiadmin" user and adding it to the WebAdmins role.

  6. Note that logging on to the EPiServer Web site with your Windows username and password will be possible - by default the Windows role and membership providers are enabled.
    The steps listed above describe how to configure the SqlServerMembershipProvider as the Membership Provider and SqlServerRoleProvider as Role provider. After completing these steps it will only be possible to log on to the EPiServer Web through the user created here.

    Multiplexing: The Multiplexing providers in EPiServer CMS 6 allows several role and membership providers to be chained together, thus attempting to authenticate and authorize users against different providers. This allows users from different sources to log in. The typical example is to enable the SqlServer and Windows membership and role providers, allowing both Windows users and users stored in a SqlServer database to log in to the site.

Viewing the Results

  1. Before you can browse to your newly added page you need to add the correct license file to your project. Right-click the project node and select Add, Existing Item.... Browse to the your license file and select it.

    The file should now be visible in your solution.

    Image of solution explorer showing a license.config present in the solution
  2. Now you can open the site again, and log in as epiadmin. To log in, enter your site address followed by "/util/login.aspx" and enter the user name and password.

  3. You should now see the simple start page we added earlier:

    Image of the new start page.

    Because the base class was set up correctly for us earlier, we have the right click menu available from the start but it still needs a minor modification to display properly.

  4. If you are logged in and right-click to access the EPiServer menu at this point, you will notice a glitch. The menu will expand upwards and disappear under the IE menus. This is because the body element is only one line high and EPiServer don't know which way to expand, by default the menu expands downward but since there is no room in that direction it gets expanded upwards instead.
    To fix this we need to add a style to the body element, setting its height to 100%.
  5. Add a new folder to your solution and name it "styles".
  6. Right-click your new folder and choose Add, New Item...
  7. From the Add New Item dialog, select the Visual C# node in the Categories selection and select Style Sheet in the Templates selection view.

    Image of Adding new style sheet dialog.
  8. Open your style sheet and add the following declaration:
    Copy 
    html, body
    {
            height:100%;
    }
  9. Open your masterpage and add the following line right at the end of the head declaration:
    CopyC#
    <link rel="stylesheet" href="styles/style.css" type="text/css" />
    You can now right-click your page in the browser and get access to the EPiServer menu.

    Image of the right click menu on your new page.

    Remember that you need to browse to your login page and make sure you are logged in to get access to the menu. to get access to the menu.
  10. Open Admin mode, click Set Access Rights
    Because we just added the WebAdmins role, it has no rights to the content on the site. To fix this, click the root, and add the WebAdmins group. Give it Administer rights, tick the Apply settings for sub pages checkbox and save. This will give our user administrative rights to all the pages.

  11. To alter the start page of the Web site change the value of the pageStartId attribute (in the Web Config file) to the page ID of the desired page.