The local root and testing server folders are the working development folders for your Web site, while the remote folder is the Web server folder that visitors access on the Web.. Dreamw
Trang 1Managing Web Site Files
Introduction
A Web site is made up of numerous files As you continue to
create more and more Web pages and other files for a Web
site, keeping track of them becomes an important job
Managing Web site files is an important part of creating an
organized site that one or more developers can work on
In Dreamweaver, there are three main site folders: local
root, remote, and testing server The local root and testing
server folders are the working development folders for your
Web site, while the remote folder is the Web server folder
that visitors access on the Web Instead of using Windows
Explorer (Win) or Finder (Mac) to manage and work with Web
site files, you can use the Files panel When you create or
open a Web site, the Files tab in the Files panel displays all
the site’s files, which you can use to quickly and easily
man-age individual Web pman-ages, files, and folders If you can find a
file on your site, you can also use the Files panel to help you
locate it
If you’re creating a custom template or sharing files with
someone who needs them for use in another program, you
can use the Save As dialog box to change the file type for a
Web page or other related file
When you create a Web page, one of the first things to do
is to apply some general settings to your page The Page
Properties dialog box lets you specify the default font family
and font size, background color, margins, link styles, and
many other aspects of page design You can assign new page
properties for each new page you create, and modify those
for existing pages Dreamweaver allows you to embed these
changes to the page using HTML or CSS (Cascading Style
4
What You’ll Do Explore Web Site Files and Folders Set Up Site Folders
View the Files Panel Open and Create Files in the Files Panel Manage Files and Folders in the Files Panel
Find Files in the Files Panel Save a File with Different Formats Identify Dreamweaver File Formats Set the Home Page
Prepare to Set Page Properties Set Appearance Page Properties Set Link Page Properties Set Heading Page Properties Change Title and Encoding Page Properties
Insert a Tracing Image Use Visual Aids Work with Invisible Elements Select Elements
Trang 2server folder on your local computer or appli-cation server In order to set up a testing server folder, you need to define the local and remote folder first
Web site development takes place in the local folder, while Web site final production takes place in the remote folder After you fin-ishing developing files and folder in your local folder, you can upload them to your remote folder The folder structure in the local and remote folders should always be the same If the folder structure is not the same, files upload to the wrong location and links
to files don’t work So, making sure the folder structure of the local and remote are the same is very important
You can name and specify the location of the local folder However, the remote folder name and location is typically provided by your Web server administrator After you find out the name and location of your remote folder, you can establish a connection to it from Dreamweaver If the remote folder name and location is not available at the moment, you can still set up a local folder now and start creating Web site files, and then specify the remote and testing folders later
Typically, you work on files in your local folder and then upload them to your remote folder However, you can also work on files directly on your remote site in Dreamweaver
When you make a change to a remote site file make sure you also update the local site file too so they are both the same
A Web site consists of linked documents and
related files organized into folders You can
use Dreamweaver to organize and manage
your site files and folders, and maintain your
links With Dreamweaver, you can create,
develop, and work with site files and folders
on your local hard disk and upload them to a
Web server where visitors on the Web can
access it
Working with Site Folders
The development environment for a
Dreamweaver site consists of three main
folders: Local root, Remote, and Testing
server The local root folder, known as the
“local site,” stores your site files and folders
you work on during development You can
store the local root folder on your local
com-puter or a network server The remote folder,
known as the “remote site,” stores your site
files and folders for production on the Web
The remote folder is typically the Web server,
known as a production server, where visitors
access your site on the Web If you plan to
use dynamic pages—Web pages that change
based on circumstances—in your Web site,
the Web server also needs to run an
applica-tion server An applicaapplica-tion server is a network
server with software, such as ColdFusion,
ASP, ASP.NET, JSP, or PHP, that processes
dynamic pages If you want to test dynamic
pages during development, you also need a
testing server folder, which provides a place
to generate and display dynamic content
while you work You can store the testing
Exploring Web Site Files and Folders
Trang 3In Dreamweaver, there are three main site folders: local root, remote, and testing server The local root folder is the working development folder for your Web site The remote folder is the Web server folder for your Web site This is the location on the Web where visitors access your Web site The testing server folder is a development folder for generating and displaying dynamic page content while you work A
dynamic page is a Web page that changes based on circumstances
The other type of Web page is a static page, which only changes when
you edit it You can set up site folders when you create a new site or edit an existing one If you don’t know the settings for the remote and testing server folders, you can set up a local folder now, start creating Web site files, and then specify the remote and testing folders later
Setting Up Site
Folders
Set Up Site Folders
Use one of the following methods:
◆ New Site Click the Site menu,
and then click New Site
◆ Exist Site Click the Site menu,
click Manage Sites, select the
site you want, and then click
Edit.
Click the Site category.
Click the Browse For Folder icon,
locate the local folder you want to
use, and then click Select.
Click the Servers category.
Click the Add New Server button,
specify the server name,
connection type, address,
username and password, and root
directory on the Basic tab (New !)
Click the Advanced tab, and then
select testing server model and
access method you want to use to
display dynamic page content
(New !)
Click Save, and then click OK
to cache files, if necessary
Select the check box for the
Remote and Testing server you
want to use (New !)
Click Save.
9
8
5
7
6
5
4
3
2
1
8
9 5
2
3
4
Trang 4The Files panel is a useful place for managing files and folders When you create or open a Web site, the Files tab in the Files panel displays all the site’s files If you want to change locations, you can use the Site list arrow in the Files panel to select a remote server, local drive, or desktop The Files tab displays the file hierarchy of all the folders and files in your Web site in different views, either local, remote, testing, or repository version control from Subversion Using the plus sign (+) and the minus sign (-) to the left of an icon in the Files tab allows you to dis-play different levels of folders in your Web site without opening and displaying the contents of each folder If you want to display two differ-ent views, you can expand the Files panel
Viewing the
Files Panel
View Files in the Files Panel
Select the Web site in which you
want to view
Click the Window menu, and then
click Files to display the Files
panel
Click the Site list arrow, and then
select the location where you
want to view files
Click the Site Files View list arrow,
and then select the view you want
◆ Local View Displays the folder
structure of the site on your
computer (Default view)
◆ Remote Server Displays the
folder structure of the site on a
Web server
◆ Testing Server Displays the
folder structure of the testing
and local site
◆ Repository View Displays the
Version Control site files using
Subversion
Perform the commands you want
to display folder structure and
contents:
◆ To show the file and folder
structure, click the Plus
sign (+)
◆ To hide the file and folder
structure, click the Minus
sign (-)
◆ To display the contents of a
folder, click the folder icon
5
4
3
2
5
Trang 5Work with the Files Panel in
Expanded View
Select the Web site in which you
want to view
Click the Window menu, and then
click Files to display the Files
panel
The Files panel appears, displaying
the Files tab
Click the Expand button to expand
the Files panel
The Files panel expands to display
the remote site, testing site, or site
map on the left and the local site
on the right
Click a button on the toolbar to
display the view you want:
◆ Remote Server Displays the
remote site
◆ Testing Server Displays the
testing site
◆ Repository Files Displays the
Version Control site files using
Subversion
Click the Collapse button again to
collapse the Files panel
5
4
3
2
1
3 Click to expand/collapse
4
See Also
See “Managing Files and Folders in the
Files Panel” on page 74 for information
on working with site files in different
views
Trang 6Instead of using Windows Explorer (Win) or Finder (Mac) to manage and work with Web site files, you can use the Files panel After you open a Web site, you can quickly open files using the Files panel instead of using the Open command on the File menu The Files panel displays all the files for the working site If you want to open a file for another site, you need to use the Open command on the File menu, or switch the working site and use the Files panel In addition, you can create a new file When you do, Dreamweaver creates the new file in the same folder as the selected file
Opening and Creating
Files in the Files
Panel
Open a File in Files Panel
Select the Web site in which you
want to view
Click the Window menu, and then
click Files to display the Files
panel
Click the Site list arrow, and then
select the location where you
want to view files
Click the Site Files View list arrow,
and then select Local View.
Use any of the following methods:
◆ Double-click the file icon
◆ Right-click (Win) or
Control-click (Mac) the file icon, and
then click Open.
5
4
3
2
5 4
Did You Know?
You can refresh the Files panel If you
don’t see a file or folder you know is in
the Files panel, click the Refresh button
(Dreamweaver sites only) or right-click
(Win) or Control-click (Mac), and then
click Refresh
Trang 7Create a File in Files Panel
Select the Web site in which you
want to view
Click the Window menu, and then
click Files to display the Files
panel
Click the Site list arrow, and then
select the location where you
want to view files
Click the Site Files View list arrow,
and then select Local View.
Select a file where you want to
place the new one
Right-click (Win) or Control-click
(Mac), and then click New File.
Enter a name for the file or folder,
and then press Enter (Win) or
Return (Mac)
7
6
5
4
3
2
1
5
4
6 3
7
Did You Know?
You can control what applications
open specific files For example, you
might want to open your gif files using
Fireworks, or you might want to use
Photoshop Click the Dreamweaver
(Mac) or Edit (Win) menu, and then
click Preferences Click the File
Types/Editors category, make your
changes, and then click OK