Basic CMS Framework in C#

Raymund Macaalay

Rate me:

1.07/5 (12 votes)

7 Aug 2007CPOL1 min read

56K

1.3K

The basic foundation on how to build your own Content Management System.

Download source code - 185 KB

Introduction

This is to demonstrate how to create a simple Content Management System using three major components: Master Page, Default ASPX page, and a Web User Control.

Using the code

There are three major components that we need to tackle:

Master Page - which will hold our design
Default.aspx - which will call the Web User Controls
User Control (ASCX) - the module for the content

We start with the Master Page which is very, very simple. We don't even have to put any code-behind at this point.

ASP.NET

<%@ Master Language="C#" AutoEventWireup="true" 
           CodeFile="MasterPage.master.cs" Inherits="CMMforStarters.MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html>
   <head id="Head1" runat="server">
       <title>Master Page</title>
        <link href="Main.css" rel="Stylesheet" type="text/css" />
   </head>
   <body>
   <form id="Form1" runat="server">
   <asp:table id ="MainTbl"  width = "100%" cellpadding = "0" 
                cellspacing ="0" runat="server">
   <asp:tablerow>
        <asp:tablecell ColumnSpan = "3">
        <table id="HeaderContainerTbl"  border="0"  width = "100%" 
                      cellpadding = "0" cellspacing ="0"> 
            <tr>
                <td>
                    <table id="HeaderContainerInnerTbl" width="100%" 
                                height="100" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td width = "100%">
                              <img src="images/spacer.gif" width="1" height="1" alt="">
                            </td>
                        </tr>
                        <tr>
                            <td width = "100%">
                              <img src="images/spacer.gif" width="1" height="1" alt="">
                            </td>
                        </tr>
                        <tr>
                            <td bgcolor="99ccff" width = "100%">
                              <img src="images/spacer.gif" width="1" height="1" alt="">
                            </td>
                        </tr>
                    </table>   
                </td>
            </tr>
        </table>
   </asp:tablecell>
   </asp:tablerow>

   <asp:tablerow>
        <asp:tablecell VerticalAlign = "top" ColumnSpan = 3>
            <table id="TopContainerTbl"  border="0" width = "100%" 
                       cellpadding = "0" cellspacing ="0">
                <tr>
                    <td class="Normal"> 
                        <asp:contentplaceholder id="TopContainer" runat="Server">
                        </asp:contentplaceholder>   
                    </td>
                </tr>
            </table>          
        </asp:tablecell>
   </asp:tablerow>
   <asp:tablerow>
    
        <asp:tablecell VerticalAlign = "top">
            <table id="LeftContainerTbl"  border="0" width = "100%" 
                      cellpadding = "0" cellspacing ="0">
                <tr>
                    <td class="Normal"> 
                        <asp:contentplaceholder id="LeftContainer" runat="Server">
                        </asp:contentplaceholder>   
                    </td>
                </tr>
            </table>          
        </asp:tablecell>
   
        <asp:tablecell VerticalAlign = "top">
            <table id="CenterContainerTbl"  border="0"  width = "100%" 
                           cellpadding = "0" cellspacing ="0">
                <tr>
                    <td class="Normal">                                     
                        <asp:contentplaceholder id="CenterContainer" runat="Server">
                        </asp:contentplaceholder>                
                    </td>
                </tr>
            </table>
        </asp:tablecell>
    
        <asp:tablecell VerticalAlign = "top">
            <table id="RightContainerTbl"  border="0"  width = "100%" 
                           cellpadding = "0" cellspacing ="0">
                <tr>
                    <td> 
                        <asp:contentplaceholder id="RightContainer" runat="Server">
                        </asp:contentplaceholder>   
                    </td>
                </tr>
             </table>
        </asp:tablecell>          
        
    </asp:tablerow>
   <asp:tablerow>
        <asp:tablecell VerticalAlign = "top" ColumnSpan = 3>
            <table id="BottomContainerTbl"  border="0" width = "100%" 
                           cellpadding = "0" cellspacing ="0">
                <tr>
                    <td class="Normal"> 
                        <asp:contentplaceholder id="BottomContainer" runat="Server">
                        </asp:contentplaceholder>   
                    </td>
                </tr>
            </table>          
        </asp:tablecell>
   </asp:tablerow>
    <asp:TableRow>
        <asp:TableCell ColumnSpan = "3" >
         <table id="FooterTbl"  border="0"  width = "100%" 
                           cellpadding = "0" cellspacing ="0">
                <tr>
                    <td> 
                        <table id="FooterTblInner" width="100%" height="29" 
                                    border="0" cellpadding="0" cellspacing="0">
                            <tr>
                                <td bgcolor="99ccff" width = "100%">
                                  <img src="images/spacer.gif" width="1" height="1" alt="">
                                </td>
                            </tr>
                            <tr>
                                <td bgcolor="99ccff" width = "100%">
                                  <img src="images/spacer.gif" width="1" height="1" alt="">
                                </td>
                            </tr>

                        </table>
                        
                    </td>
                </tr>
             </table>
        </asp:TableCell>
    </asp:TableRow>
   </asp:table>
                
     
   </form>
   </body>
   </html>

The master page is like a normal HTML page with some of the design stuff that we need; just take note of <asp:contentplaceholder> since this is the part where we will render the controls for the CMS.

Next is default.aspx, which will render the control. Let's go to the ASPX part, which is a very plain simple code.

ASP.NET

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" 
  AutoEventWireup="true" CodeFile="Default.aspx.cs" 
  Inherits="CMMforStarters.ControlLoader" Title="Untitled Page" %>

<asp:content id="ContentTop" contentplaceholderid="TopContainer" runat="server">
    <asp:PlaceHolder ID="PlaceHolderTop" runat="server"></asp:PlaceHolder>
</asp:content>

<asp:content id="ContentLeft" contentplaceholderid="LeftContainer" runat="server">
    <asp:PlaceHolder ID="PlaceHolderLeft" runat="server"></asp:PlaceHolder>
</asp:content>

<asp:content id="ContentCenter" contentplaceholderid="CenterContainer" runat="server">
    <asp:PlaceHolder ID="PlaceHolderCenter" runat="server"></asp:PlaceHolder>
</asp:content>

<asp:content id="ContentRight" contentplaceholderid="RightContainer" runat="server">
    <asp:PlaceHolder ID="PlaceHolderRight" runat="server"></asp:PlaceHolder>
</asp:content>


<asp:content id="ContentBottom" contentplaceholderid="BottomContainer" runat="server">
    <asp:PlaceHolder ID="PlaceHolderBottom" runat="server"></asp:PlaceHolder>
</asp:content>

Just notice that it has the MasterPageFile="~/MasterPage.master" and that's how we reference the Master page to be utilized by default.aspx; other than that are <asp:PlaceHolder>s which we will be placing our controls in later on.

Next is default.aspx.cs:

SqlConnection conn = null;
SqlDataReader rdr = null;

/// Variable initialization
string sWhereCondition = "PortalID = 1 and PageID = " + iPageID.ToString();
string sOrderByExpression = "SortOrder";
try
{
conn = new SqlConnection(ConnStr);
conn.Open();

//Get the contents of the website from a SQL Database
SqlCommand cmd = new SqlCommand("SelectPageContentsDynamic", conn);

cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.Add(new SqlParameter("@WhereCondition", sWhereCondition));
cmd.Parameters.Add(new SqlParameter("@OrderByExpression", sOrderByExpression));

rdr = cmd.ExecuteReader();
while (rdr.Read())
{
    string ControlPath = 
       GetControlLocation(int.Parse(rdr["ControlID"].ToString()));

    UserControl ucControl = (UserControl)Page.LoadControl(ControlPath);
    Type ucType = ucControl.GetType();
    
    // Getting the property of the User Control and set its value
    PropertyInfo ucProperty_PropertyID = ucType.GetProperty("PropertyID");
    ucProperty_PropertyID.SetValue(ucControl, 
               int.Parse(rdr["ContentID"].ToString()), null);

    //Placing the Controls to their proper Placeholders    
    switch (rdr["ControlLocation"].ToString())
    {
        case "Top":
            PlaceHolderTop.Controls.Add(ucControl);
            break;
        case "Left":
            PlaceHolderLeft.Controls.Add(ucControl);
            break;
        case "Center":
            PlaceHolderCenter.Controls.Add(ucControl);
            break;
        case "Right":
            PlaceHolderRight.Controls.Add(ucControl);
            break;
        case "Bottom":
            PlaceHolderBottom.Controls.Add(ucControl);
            break;
    }
}
conn.Close();
conn.Dispose();

As you can see, we are rendering the controls dynamically and assigning property values along the way; you can do this by referencing to System.Reflection;. Last is a sample web User Control which, in this instance, renders HTML to a Literal control:

public partial class Controls_HTML : System.Web.UI.UserControl
{
    private int _PrimaryID = 0;

    public int PropertyID
    {
        get { return _PrimaryID; }
        set { _PrimaryID = value; }
    }

    string ConnStr = 
      System.Configuration.ConfigurationManager.AppSettings.Get("GlobalConn").ToString();

    protected void Page_Load(object sender, EventArgs e)
    {

        SqlConnection conn = null;
        SqlDataReader rdr = null;


        conn = new SqlConnection(ConnStr);
        conn.Open();

        SqlCommand cmd = new SqlCommand("SelectHTML", conn);

        cmd.CommandType = CommandType.StoredProcedure;
        cmd.Parameters.Add(new SqlParameter("@ID", _PrimaryID));

        rdr = cmd.ExecuteReader();
        while (rdr.Read())
        {
            HTMLLiteral.Text = rdr["HTMLContent"].ToString();
        }
        conn.Close();
        conn.Dispose();
    }
}

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Written By

Raymund Macaalay

Technical Lead

New Zealand

http://nz.linkedin.com/in/macaalay
http://macaalay.com/

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Basic CMS Framework in C#

Introduction

Using the code

License

Comments and Discussions