Customizing Web Applications with ASP.NET 2.0 Themes and Controls

1. ASP.NET 2.0 Chapter 4 Custom Designing Web Applications

2. Objectives ASP.NET 2.0, Third Edition

3. Customizing the Presentation Layer • Use external style sheets to modify styles using the CssClass property • Remember that Web controls generate HTML code • Styles are applied to HTML code on the client • Apply skins to configure the styles for Web controls • Skins allow you to configure the properties of Web controls, including the styles and templates • Group skins into themes that can be applied throughout your entire web site • Use different themes for different pages and folders ASP.NET 2.0, Third Edition

4. Using Style Sheets to Configure a Web Page Dynamically (continued) ASP.NET 2.0, Third Edition

5. Using Skins to Format a Web Form • A skin is a file that contains style and other properties; it is used to format Web controls • Each control in a skin file is referred to as a skin • Can have multiple controls in a single skin file • SkinID is used to identify each skin • Skin has two meanings: the file itself and the controls in the file ASP.NET 2.0, Third Edition

6. Using Skins to Format a Web Form (continued) ASP.NET 2.0, Third Edition

7. Using Skins to Format a Web Form (continued) ASP.NET 2.0, Third Edition

8. Using Skins to Format a Web Form (continued) ASP.NET 2.0, Third Edition

9. Add a skin using the Add Items templates Skin files end with the extension .skin Include a default skin with no SkinID specified Stored in a subfolder within the App_Themes folder Each subfolder in App_Themes is a theme Using Themes to Create a Uniform Web Page ASP.NET 2.0, Third Edition

10. Applying the Theme to a Folder or Web Application ASP.NET 2.0, Third Edition

11. Using Themes to Create a Uniform Web Page (continued) ASP.NET 2.0, Third Edition

12. Configuring Multiple Themes ASP.NET 2.0, Third Edition

13. User Controls • A User control is a container where you can insert server controls, HTML markup, and programming code • Store content that can be reused in other parts of the web application • Heading, image, list of records returned from a database ASP.NET 2.0, Third Edition

14. Understanding User Controls • Can be reused in other web pages within the same application and across projects • Plan your web application before you start to develop the code • Identify areas where code can be reused • Can be inserted into any Web Form page, including master and content pages ASP.NET 2.0, Third Edition

15. Understanding User Controls (continued) • User controls have an .ascx file extension • The first line must identify the file as a User control with the keyword Control • Can contain a reference to a code behind the page • Cannot include html, head, body, form elements ASP.NET 2.0, Third Edition

16. Understanding User Controls (continued) ASP.NET 2.0, Third Edition

17. Understanding User Controls (continued) ASP.NET 2.0, Third Edition

18. Creating and Registering a User Control ASP.NET 2.0, Third Edition

19. Web Parts and Portals • Web parts are a collection of controls • Contain User controls and Web controls • Can load web parts dynamically • Configured to allow the end user to control the display layout dynamically and edit the content loaded on the page • Each Web Part is called a WebPart control • WebPart controls are stored in WebZones, or simply zones • Add one or more WebZone controls to your web page wherever you intend to insert a zone • Add your own User control or Web control to the zones ASP.NET 2.0, Third Edition

20. Using the WebPartManager Control • WebPartManager control • Used to configure the Web Parts and WebZones • Can be inserted anywhere in the web page • Uses modes to control how the content is displayed • Modify the WebPartManager to change the view to an alternative mode and insert additional zone controls • Change the WebPartManager display mode with the DisplayMode property ASP.NET 2.0, Third Edition

21. Using the WebPartManager Control (continued) ASP.NET 2.0, Third Edition

22. Web Portals • Web portals are used in conjunction with Web Parts • Users can access other local or remote applications through a single interface • May contain one or more Web Parts • Sample applications called starter kits located at www.asp.net/default.aspx?tabindex=5&tabid=41 and include a web portal application ASP.NET 2.0, Third Edition

23. Web Portals (continued) ASP.NET 2.0, Third Edition

24. The Use of Third-Party Controls • Dot Net Nuke (DNN) • A community-supported sample kit frequently used as the foundation for commercial web sites, corporate intranets and extranets, online publishing such as blogs, and custom applications • Integrates Web Parts, zones, and portals and provides modules that can be integrated with the web application • FreeTextBox.freetextbox.com • A multi-line text box, along with multiple toolbars, used for the content and can be styled • Telerik provides TextBox editor control called r.a.d. editor ASP.NET 2.0, Third Edition

25. The Use of Third-Party Controls (continued) ASP.NET 2.0, Third Edition

26. Summary • Skins and themes customize the appearance of the web page. The skin file ends in .skin and contains style information. Server controls can be configured using skins. • Themes are collections of skins, style sheets, images, and other resources used to customize the page appearance and stored in the App_Themes folder. Only one theme can be selected at a time and can be configured at the page, folder, web site, or web server level. • Create your own custom controls called User controls. User controls contain HTML code and programming code, and must be registered before they can be used. Once a tag has been registered, you can reuse the tag. User controls are compiled, and can be reused across multiple pages within the same application. • Third-party applications expand the capabilities of your application. ASP.NET 2.0, Third Edition