Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
For controls that you are going to use in many pages throughout your website, it's useful to be able to register the control globally, so that you don't have to use the register declaration at the top of every page. In order to follow along with this demonstration, you must have already created a file called header.ascx in the Controls folder under the Website Root. Open the file web.config from your Website Root folder. This is the file that configures your entire website. It has a Pages element, which I have already scrolled to at about line 67. Within the Pages element, there is a Controls element and then for each custom control that you want to use in your website globally, you put in an Add element as a child of controls.
I am going to move the cursor right before the End tag of Controls, press Enter, move up a line, and then tab in, and then I'll place the New Add tag right below the existing ones. I'll type in a less than character and select add and then I'll tagPrefix. The tagPrefix can be anything you like. I'm going to use a tagPrefix of simply customControls. Then set the tagName. The tagName can be anything you like as well. I'm going to use Header to match the name of the file in which it's defined. Then finally, just as with the register declaration that you used in the local pages, I'll use a source attribute, src, to indicate that I'm getting the file from the Controls folder under the Root. I'll start with the tilde character which you will find right next to the number 1 pressing the Shift key, then a slash, then Controls and then the name of the file Header.ascx.
So there is all my code. Let's review it. I have the Add element which I'll align with the other Add elements just by pressing the Backspace key a couple of times, the tagPrefix, the tagName, and the source. I'll clean up the code a little bit just removing the spaces around the equals operators. They wouldn't hurt anything, but I'd like the code to look a certain way, and then I'll press Ctrl+S to save my changes. Now I'll go to a page, publishers.aspx, which still has the original Header content. I have already selected the text starting with the div tag wrapped around the image and the panel wrapped around the menu, and I'll delete it.
Then I'll tab in, I'll type in a less than character and start typing cus. And you will see that Visual Web Developer already knows that the Header control is available. I will press Enter to select it. I'll press the spacebar, start typing runat, press Enter, quote and then put in server. As with all custom controls, the runat="server" attribute is critical. I'll close the tag with the slash and a greater than. I'll save my changes and run the page without debugging. And there is the result. The publisher page now uses the user control.
Because I have now registered the control globally, in order to implement this control on all the pages, all I need to do is to select that code, copy it to the clipboard, and then I'll be able to open other pages. For example, I'll go to the Authors page, I'll remove the register declaration from the top, I'll remove the call to the header that uses the special prefix that was created in this page only. I'll place the cursor and then once again start typing custom controls. I'll make sure to add runat="server" and then I'll close the tag. I'll run the page once again without debugging, and you will see once again that user control is working correctly.
So once you have created the control and registered it globally in web.config, you can then use it as many times in as many pages as you like.
Get unlimited access to all courses for just $25/month.Become a member