Site Search:
Sign in | Join | Help
4Penny.net

Steve Gray

Random Thoughts from the 4Penny VP of Development

How to edit a web site using Visual Web Developer

4Penny supports the use of 2 web editing tools (Visual Web Developer - free - http://asp.net/downloads/essential/) and Microsoft Expression Web - $300 - http://www.microsoft.com/expression/). These tools are not the same, and are intended for widely different purposes. The differences are beyond the scope of this article.

We need to use a live site for this demo so we'll use www.tstoday.com. If you own a time share, you need to be on this site and you should also get a subscription to the magazine, I personally recommend it.

We support only one FTP Tool - Beyond Compare from Scooter software http://www.scootersoftware.com/download.php

Our reasons are also beyond the scope of this article, and there are many fine FTP tools out there. I'd recommend, though, that you invest in Beyond Compare.

This article will server as a primer on how to edit a site using Visual Web Developer. Using this tool, clients may safely edit the sites that were originally created by 4Penny.

So, here goes:

How to edit a web site using Visual Web Developer

Download and install the free Visual Web Developer 2008 Express Edition
http://asp.net/downloads/essential/
Download and install Beyond Compare
http://www.scootersoftware.com/download.php, $30.


Using Beyond Compare, connect to your web site. Place the web site in the right hand window and your local directory in the left hand window. Copy all pages from the site to your local machine.

Note that the time was modified 5 hours, so that the time stamps of the local and remote files where the same.

In Visual Web Developer, click on File > Open Web Site…

In the Open Web Site Dialog, be sure that File System is selected in the left column and then navigate to the directory where you downloaded your web site, select it and click Open.
 

After the site opens, there is a little housework to do. Be sure that the Solution Explorer is open. If it is not, click on View > Solution Explorer


Click on the solution file at the top of the list,

Then click F4 to open up the Properties window. In the Properties window, find the Virtual Path line and edit to be ‘/’.

Note that there are three choices for what you see in the bottom left corner of VWD, Design, Split, and Source. Explore all three, but in most cases Split or Design will be the best choice for beginners. 
 

Clicking the green ‘go’ button will launch the site locally, but any page that requires database access will fail because usually the local site will not have the database correctly configured. Configuring databases -althouth possible - is beyond the scope of this document. 
 

Note that most 4Penny.net sites make use of a ‘Master Page’, that page usually holds the header, footer, and navigation components of a web site. That way any changes made to the master are made throughout the site at one time.
In VWD, you are able to view the contents of the Master Page, but they are greyed out and not editable, as seen below. 
 

Make whatever edits you like, save them, and then reverse the process in Beyond Compare to FTP the changed pages back up to the site.
Note that some pages are marked ‘read only’ on the server and may download like that. Use Windows Explorer to navigate to the file, right click on it, and unmark the ‘read only’ attribute. This change can also be done to the root folder to unmark all the files at one time.


In Beyond Compare, click on View > Display Filters >  Only Mismatches. Then, only the changed files will show (in the image below, the file in red is the file that was edited)
 

Comments

No Comments

Leave a Comment

(required)  
(optional)
(required)  
Add

About Steve Gray

Steve is a seasoned (translate: old) developer in VB and ASP.NET. He spends most of his time in Dynamics GP, writing custom mods for consulting firms. Crystal reports, eConnect, VS Tools for Dynamics... anything that comes along.