Click here to Skip to main content
13,260,383 members (43,476 online)
Click here to Skip to main content
Add your own
alternative version


25 bookmarked
Posted 5 Oct 2004

Web Parts

, 5 Oct 2004
Rate this:
Please Sign up or sign in to vote.
On the fly customization of the Web Paes by using Web Parts.
· On the fly customization of the Web Pages by using Web Parts Creating Web Parts involves following controls : WebPartManager WebPartPageMenu CatelogZone WebPartZone ZoneTemplate EditorZone AppearanceEditorPart LayoutEditorPart Follow the steps to demonstrate the Web Parts : Create an html table in .aspx page. Create a WebPartManager before the table as
<asp:webpartmanager id="WebPartManager1" runat="server" />
Add an <asp:webpartzone> element inside the first <TD>element in the table, and assign its property values as shown in the following code example.
<asp:webpartzone id="SideBarZone" runat="server"  headertext="Sidebar">        
Note : The layout of the Web Parts zone is specified by a <ZONETEMPLATE>element. Inside the zone template, you can add any Web server control, whether it is a custom Web Parts control, a user control, or an existing server control. 4. Inside the <ZONETEMPLATE>element for the Main zone, add an <asp:label> element with some content, as shown in the following code example.
<asp:webpartzone id="MainZone" runat="server" headertext="Main">
<asp:label id="contentPart" runat="server" title="Content">      
<h2>Welcome to My Home Page</h2>      
<P>Use links to visit my favorite sites!</P>    
Save the WebPartsDemo.aspx file. 6. Create a new file in your text editor. This file will contain a user control that can also be added to the page as a Web Parts control. · Enabling Users to Change the Layout 1. In the WebPartsDemo.aspx page, add an <asp:webpartpagemenu> element just after the <asp:webpartmanager> element. 2. Add the following property values and child elements to the <asp:webpartpagemenu> element.



                        text="Display Mode" 

<HoverStyle BorderWidth="1" />
<MenuStyle BorderWidth="1" />

<Designmodeverb text="Design" />
This creates a WebPartPageMenu control at the top of the page, which enables a user to change the page layout by switching to design mode. 3. Save the WebPartsDemo.aspx file. · To add editing capabilities to Web Parts 1. In the WebPartsDemo.aspx file, add an <asp:editorzone> element inside the third <TD>element in the table. Add a <ZONETEMPLATE> element, an <asp:appearanceeditorpart> element, and an <asp:layouteditorpart> element. The code should look like the following example.
<td valign="top">
<asp:editorzone id="EditorZone1" runat="server">    
<asp:appearanceeditorpart runat="server" id="AppearanceEditorPart1" />      
<asp:layouteditorpart runat="server" id="LayoutEditorPart1" />    
· To allow user to select WebParts from WebPart Catalog: The WebPart Catalog contains the WebParts that can be selected and then added to the WebZones. First we should declare all the WebParts at the top below the <%@ Page %> Directive as :
<%@ Register TagPrefix="Vorne" TagName="MyCht" Src="../MyChart.ascx" %>
<%@ Register TagPrefix="Vorne" TagName="Cale" Src="../Calender.ascx" %>
<%@ Register TagPrefix="Vorne" TagName="Chart" Src="../Chart.ascx" %>
To create Catalog, we can write as :
<asp:CatalogZone ID="CatalogZone1" Runat="server">
      <asp:DeclarativeCatalogPart Runat="server" ID="DeclCataPart1">
           <Vorne:Calender Runat="server" ID="c1" Title="Calender" />
           <Vorne:MyChart Runat="server" ID="c2" Title="Line Chart" />
           <Vorne:Chart Runat="server" ID="c3" Title="BarChart" />


This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


About the Author

No Biography provided

You may also be interested in...

Comments and Discussions

GeneralMy vote of 2 Pin
hemantpandey037-Oct-12 23:38
memberhemantpandey037-Oct-12 23:38 
Generalwebparts problem Pin
shhhhhhhhhh16-Apr-07 21:49
membershhhhhhhhhh16-Apr-07 21:49 
Generalwebparts problem Pin
shhhhhhhhhh16-Apr-07 21:44
membershhhhhhhhhh16-Apr-07 21:44 
GeneralRegarding calender control Pin
Bandu Anil Varma14-Nov-06 0:58
memberBandu Anil Varma14-Nov-06 0:58 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

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

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.171114.1 | Last Updated 5 Oct 2004
Article Copyright 2004 by rahul_bcs_0071
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid