Getting Started
All of our standard templates include our Getting Started Guide, a downloadable pdf document,
which outlines tips n' tricks to help demonstrate how the template is built.
This template includes a copy of this comprehensive Getting Started page in
a printable format - look for the READme.txt file included in this package.
Ready, Steady, Go!
Before you dive into your new project, make a back-up of the original template download. Keep a copy
of the original on a CD (or another another secure method) to store your original template
safely. You'll appreciate having this handy should you ever need to revert back to the original code.
This template package comes with the starter web site in .zip format. Unzip the package and start editing the pages. You may wish to keep a backup copy of the .zip in case you need to start over. We have included
a basic site structure with common pages to help you get started. You may rename the pages, add more pages, and add your content.
What's Included?
- Website template, with multiple pages, designed for Expression Web® and/or FrontPage 2003®, which includes:
- A master Dynamic Web Template (DWT) is included which manages the 2-column page layout. This layout is also set at a fixed width of 1024 wide;
- External Cascading Style Sheet (CSS) which is used to manage the layouts and other design decisions.
- Fonts resizable - we've ensured that fonts will adjust to the size specified by the visitor through their browser settings. You can also manage fonts globally through the external CSS file.
- Table-less - while the primary elements of this template are managed without tables (i.e. the overall design), some tables have been used to present the shopping cart page.
- Validation & Browsers - this template has been validated for clean code in CSS, XHTML 1.0 Strict, WCAG 1.0, 2.0, and Section 508 accessible. It also works in IE 6 and 7, Firefox 2.0, Netscape 8.0, Opera 9.0, and Safari.
- Layered Photoshop (.psd) master source file included.
Note - the software to edit this file is not included.
You'll Need...
- Microsoft Expression Web or FrontPage 2003 - earlier versions of FrontPage may not work with this template because it uses a DWT (dynamic web template).
- Image Editor (optional) - we've included a master Photoshop file which can be opened in Photoshop, Paint Shop Pro, Fireworks, and some other image editors.
You Don't Need...
- Regarding hosting, you DON'T need FrontPage Extensions to run
this template.
Create a New Web
- Unzip your web package to a desired location on your computer.
- In FrontPage or Expression Web, select File + Open Site
then, browse to the folder where the template resides
Editing the Template
- Main Pages - open any page of the site to begin editing exiting text and images. You'll notice that some areas are not available to edit. Only regions marked as 'editable' are accessible. However, you can make changes to the master template (DWT) if you
need to adjust the master design.
- Editing the Master DWT: editing the master dwt template will effect every 'main' page of your site which uses this template. For instance, in order to modify the footer section, you will have to do so in the master DWT file.
- Editing the Main Image: the main image is called "header.jpg" and is located in the images folder. You can replace this image with your own or edit the Photoshop file provided to created your own custom header graphic. Simply create
your graphic and then save it to the images folder, naming it "header.jpg". Note - the dimensions of the header graphic are 900 pixels wide by 210 pixels high.
- Add More Pages: to create a new page, select File + New + Blank Page. Now save this page. Next, select Format + Dynamic Web Template + Attach Dynamic Web Template and select the DWT template offered in the selection window (i.e templateHAPPY-xxxx.dwt) and select OK. You can begin adding content to the page.
- Renaming Pages: access the file to be renamed through either the Folders List or the Web Site view. Place your cursor on the file to be renamed and right-click + select rename from the list of options. Next, type in your new name.
Important - when links point to a page being renamed, a warning will pop-up to ask you to confirm this step (yes or no to proceed). Say yes or broken links will occur.
- Delete Pages: similar to renaming pages, access the file via the Folders List or the Web Site view. Right-click on the page to be deleted, select delete from the list of options. You must
select "yes" from the warning message in order to complete this task. Important - remember to remove links to deleted pages if they exist.
Pre-Publish Check List
- Preview Your Work - before publishing your site, check
pages to see how they look. File + Preview in Browser.
- Title Tag - make sure to change the title tags, otherwise
called page title, as appropriate.
- Meta Tags - you can add keywords and a page description sentence
of each web page. These hidden tags are found in the <head> section
of each html page and can be accessed two ways: split screen,
editing directly into the html, or, placing your cursor on the
design section of the page, right-click + select page properties
from the options. Then, fill in the blanks of the page properties
pop-up window.
- Spell check each page. Typing errors generally appear
marked with a red underline. Right-click these to see suggested
corrections or retype corrections manually.
Publish to Host / Live Server
- Go to File + Publish Site
- Type in the URL of your web site: http://www.company.com
- Want to test your site first? Create a (temporary)
sub-folder such as: http://www.company.com/test
- Enter the username and password as prompted.
- When publishing to a new folder, you may be prompted to "create a new web."
Click OK.
- Then, click Publish to begin the process of uploading your content
to your web hosting space. When completed, click to
view your published web site.