- Creating a New Website
- Opening Existing Websites
- Working with Web Pages and Other Content
- Customizing the Visual Web Developer Experience
- Viewing, Moving, and Resizing Windows
- A World of Help at Your Fingertips
- Summary
- Q&A
- Workshop
This chapter is from the book
This chapter is from the book
This chapter is from the book
Working with Web Pages and Other Content
A website is simply a repository of related files and subdirectories. Websites typically contain files of the following types:
- Static web pages—An HTML page is a static web page. Unlike an ASP.NET page, it contains only HTML content—no Web controls and no source code. As its name implies, the content of these types of files is static, and cannot be altered based on user input, server-side data, or other criteria.
- ASP.NET web pages—ASP.NET pages are the dynamic web pages in your site. They are implemented as two files: PageName.aspx, which contains the HTML portion; and PageName.aspx.vb, which contains the source code portion.
- Image files—Most websites have various images, logos, and clip art. These image files typically are stored on the website, either in the root directory or in an Images subdirectory.
- Configuration files—ASP.NET websites contain a configuration file named web.config, which provides server-side setting information.
- Style sheet files—Style sheets are files that spell out display information. For example, in your site you might want all content to be displayed in the Arial font and have content within <h1> tags displayed in italics. You can specify this aesthetic information through style sheet files. For more information on style sheets, refer to http://www.w3schools.com/css/.
- Script files—In addition to server-side source code, a web page may contain client-side script code. This is code that is sent to and runs on the end user’s web browser. Often this script is packaged in a separate script file on the web server, which the browser requests as needed.
This list of file types enumerates the most commonly found file types on a web server but is hardly exhaustive. A rock band’s website, for example, might also have MP3 files available for download. Additionally, numerous ASP.NET-specific files can optionally be added to your website to provide various types of functionality. We’ll be learning about many of these different ASP.NET-specific file types throughout this book.
Adding Content to Your Website
When you create a new website using the ASP.NET Web Site template, the new website has the web.config file along with a single ASP.NET page, Default.aspx (which is really composed of two files, Default.aspx and Default.aspx.vb). You can easily add additional files and folders through the Solution Explorer. From the Solution Explorer, start by right-clicking on the website name; this will bring up the context menu shown in Figure 3.3.
)
Figure 3.3 To add a new file or folder, right-click on the website name in the Solution Explorer.
To add a new folder to your website, select the New Folder item from the context menu. To add a new file, choose Add New Item. Selecting Add New Item will display the Add New Item dialog box (see Figure 3.4). The Add New Item dialog box lists the wide variety of types of files that can be added. Notice that there are file types for each of the popular file types enumerated earlier, in addition to many other types.
)
Figure 3.4 The Add New Item dialog box allows you to choose the type of file to add.
At the bottom of the Add New Item dialog box, you’ll find a series of options. The options displayed depend on what file type you have decided to add. For Web Forms, which are the item type name for ASP.NET pages, there are four options:
- Name—This indicates what the file will be named.
- Language—This dictates the language of the page’s server-side source code portion.
- Place Code in Separate File—This specifies whether the source code portion should be implemented as a second file (PageName.aspx.vb) or if server-side <script> blocks will be used instead.
- Select Master Page—A master page is a site-wide template that can be applied to ASP.NET pages to maintain a consistent look and feel across the site. If you are using master pages, you can check this option to assign a master page to the newly created ASP.NET page.
The Language drop-down list value for the ASP.NET page’s source code portion will be the same language choice you specified when creating the website. However, a single ASP.NET website can have web pages that use different programming languages for their source code portions. However, I recommend against this approach and encourage you to stick with a single, unified programming language choice across all ASP.NET pages for a given website.
Although ASP.NET pages will work just as well if their source code portion is in the .aspx page in a server-side <script> block or if it is relegated to a separate file (PageName.aspx.vb), keep in mind that all of the examples we’ll be working through in this book use the separate page model. Therefore, when adding a new ASP.NET page to your website, be sure to check the Place Source Code in a Separate File check box. Doing so will create both the PageName.aspx and PageName.aspx.vb files.
Let’s practice adding a new ASP.NET page to our website. Imagine that in addition to Default.aspx, we also want to have a second ASP.NET page, DisplayTime.aspx. To add this page to your website, perform the following steps:
- Go to the Solution Explorer and right-click on the website name.
- Choose Add New Item from the context menu.
- From the Add New Item dialog box (see Figure 3.4), select to add an item of type Web Form.
- Enter DisplayTime.aspx for the page’s Name, leave the Language setting as Visual Basic, and check the Place Source Code in a Separate File check box.
- Click the Add button to create the new ASP.NET page.
You can follow these same steps to add other types of resources to your website. Of course, the options present in step 4 will differ depending on the type of item being added.
Adding Existing Content
Along with adding new content to your website, you can use Visual Web Developer to easily add existing content. You may already have an image file on your hard drive or an ASP.NET page from another project that you want to include in this project as well. If that’s the case, you can add an existing item by right-clicking on the website name in the Solution Explorer and choosing Add Existing Item.
Choosing this option will display the standard file browsing dialog box. From here, you can navigate to the folder on your hard drive that contains the content you want to add, select it, and click the Add button. This will copy over the selected item to your website’s directory, making it part of your website now.
Moving, Renaming, and Deleting Content
Along with adding new folders and files, from the Solution Explorer you can also move and delete content. To move content among the folders in your website, simply drag the file or folder from its existing location to a new file or folder.
To rename or delete a file or folder, start by right-clicking on the item in the Solution Explorer. This will bring up the context menu shown in Figure 3.5. As you can see from the figure, Rename and Delete menu items are available. Simply click on the appropriate menu item to rename or remove the selected file or folder.
)
Figure 3.5 Select the appropriate menu item from the context menu.