Home ยป How To Guides | Technology

How To Create Custom Web Pages In BlogEngine.NET With BE Master Page

  12. Sep 2011 by Soan

How To Create Custom Web Pages In BlogEngine.NET With BE Master Page Creating your custom pages is a common requirment if you are integrating BlogEngine.net with your existing website. Also, to maintain the same look and feel as provided by BlogEngine theme, you need to use the master pages as defined in BlogEngine theme.

Let us see how we can achieve this functionality.

  1. Create your custom web page (*.aspx) anywhere on your site. It can be in the root(~/) or inside any other folder.
    Normally, when you create a new aspx page, two files are added in visual studio i.e. yourFile.aspx and yourFile.aspx.cs..

    The yourFile.aspx.cs. is the code file. It is inherited from System.Web.UI.Page by default. We need to change this inheritance to make this page work with BlogEngine.net. So, change this line class reference to BlogEngine.Core.Web.Control.BlogBasePage

    OLD code:

    public partial class yourFile: System.Web.UI.Page 
    { 
       protected void Page_Load(object sender, EventArgs e) 
       { 
       } 
    }


    BlogBasePage is a class defined by BlogEngine.Net and loads the theme settings on load automatically.

    The NEW code in yourFile.aspx.cs should like this:

    public partial class yourFile: BlogEngine.Core.Web.Controls.BlogBasePage 
    { 
       protected void Page_Load(object sender, EventArgs e) 
       {
       } 
    } 
    


  2. Now on the aspx page, place all your markup code inside asp:content control whose ContentPlaceHolderID maps to the Id of contentPlaceHolder on the master page of your site. BlogEngine.NET uses the content ID cphBody to show the content inside main frame.

    <asp:content id="MyFile" ContentPlaceholderID="cphBody" runat="Server">
       <p>My own page in BlogEngine.Net which uses BE theme</p>
    </asp:Content>

    Note that all your content that you want to show on this custom page show appear inside the above content block.
    Also, the MasterPageFile attribute in your .aspx file's page directive should be REMOVED as you will be using the master page file of BlogEngine theme. It should look something like this:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="~/yourFile.aspx.cs" Inherits="yourFile" %>

Thats it. Now if run this page, you would be able to see it working as if it was an article written in BlogEngine.NET blog.


Example

Here is an example custom page creation with above code. I have created a custom page which is painted with the BlogEngine theme. The highlighted portion (marked with red) is what is available for modification if you use the content placeholder with ID "cphbody".

Custom page inside BE

Would you like to share this article?

QR Code for this page Scan this QR code to open this
article in any mobile browser
or share with friends.


For more helpful articles like this, subscribe to our free newsletter or stay connected on social networks:

SUBSCRIBE
Subscribe to AM22 tech in Reader or by Email
Sign up for our updates in Email (Free):

 

Have questions? Write into comments or ask in forum