Walkthrough: Creating a Web Parts Page

To create a page for containing Web Parts controls

1. Close the default page and add a new page named WebPartsDemo.aspx.
2. Switch to Design view.
3. In the View menu, click Visual Aids, and then make sure that the ASP.NET Non-Visual Controls and Margins and Padding options are selected.

This enables you to see layout tags and controls that do not have a UI.

4. Position the insertion point in the div element.
5. From the WebParts tab of the Toolbox, drag a WebPartManager control onto the page, between the newline character and the opening <div> tag.

The WebPartManager control does not render any output, so it appears as a gray box on the designer surface.

6. Add a new line just after the WebPartManager control.
7. In the Block Format list in the toolbar, select Heading 1.
8. In the heading, add the text "Web Parts Demonstration Page".
9. Add a new line after the text.
10. In the Table menu, click Insert Table, specify a table with one row and three columns, and then click OK.
11. Drag a WebPartZone control into the left table column.
12. Right-click the WebPartZone control, choose Properties, and set the following properties:

ID : "SidebarZone"

HeaderText : "Sidebar"

13. Drag a second WebPartZone control into the middle table column and set the following properties:

ID : "MainZone"

HeaderText : "Main"

14. Save the file, but do not close it yet.

Your page now has two zones that you can control separately. However, neither zone has any content, so the next step is to create content. For this walkthrough, you work with Web Parts controls that display only static content.

The layout of a Web Parts zone is specified by a ZoneTemplate element. Inside the zone template, you can add any ASP.NET control, including a custom Web Parts control, a user control, or a server control. In this walkthrough, you use the Label control to display static text. When you place a server control in a WebPartZone zone, ASP.NET treats the control as a Web Parts control at run time, which enables Web Parts features for the control