We recommend that you print this page for further reference as you are working with your new template.
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.
Can I change the template colors? You can easily modify font colors (links, headings, and text) by editing the included CSS file. The colors in the top header area and the bottom footer area are actually graphic images and cannot easily be changed. If you feel the colors used in this template do not meet your needs, we offer custom design and modification services. Please contact us for details and pricing information.
How do I add my site name? The template uses the "logo.jpg" image that has our sample business name applied. We also give you a logo-blank file with no text or logo sample. You can add your text using your favorite image editing software program and select your favorite font. Save your edited image as logo.jpg into the images folder of your web and allow it to overwrite the existing file. [Note: If you do not have the software to edit this file, we can do this for you for free within 30 days of your purchase.]
Watermarked Images: The template contains watermarked images or photos provided by third-party providers. We have obtained permission to incorporate these sample images within the template. If you wish to use these images for your web site, you are required to purchase or otherwise license the non-watermarked version directly from the vendor listed below if applicable. [Note: If you do not have the software to edit the layered Photoshop (.psd) file, we can edit the appropriate .psd for you for free within 30 days of your purchase.]
Main Slideshow Images - Image Numbers #450696, #1880073, #1858673 available from http://www.BigStockPhoto.com. [Note: Be sure to read over all terms of use before using any image from a 3rd party site.]
Icon Filler Images: The small icon filler images are free icons available from http://www.dezinerfolio.com/2007/07/17/aqua-gloss-icons-the-psd. We tweaked them a bit for the template (reduced the size and gray-scaled them), but you can get the whole collection for free.
The copyright for this web template and accompanying design remains with the designer, Round the Bend Wizards and/or My Arts Desire. You may not claim ownership of the design nor may you use it for any purpose other than that explicitly set forth in the separate license agreement.
This template comes with a site license, not a user or computer license. This template is licensed for use on one site only. If you wish to use this template for subsequent sites, you must purchase a license for each additional site. All images and source files included within the template are licensed for use with this template only. All royalty-free image vendors have their own terms of use in how their images may be used and in what context. Please check with the listed vendor(s) if you have questions.
We offer templates in two flavors: Expression Web templates through our site at RTBWizards.com, and Dreamweaver templates through our site at MyArtsDesire.com. You will need to have the appropriate software depending on the version you purchase. While similar, each version contains program-specific features. For example, Expression Web templates use Include Pages where Dreamweaver templates use Library Items.
The template uses the "logo.jpg" image that has our sample business name/logo applied. In the Resources folder you will find a logo-blank.jpg file. You can add your text using any image editing software program and use your favorite font, apply effects, and more. Save your edited image as logo.jpg into the images folder of your web and allow it to overwrite the existing file.
Note: If you do not have the software to add your own text, we can edit the file for you for free within 30 days of your purchase. To have us do this for you, send us an email after you purchase the template. Tell us the number and name of your template along with the date of purchase. Specify in your email the text for the business name and slogan (if appropriate). We copy and paste from your email, so double-check for spelling and punctuation. Allow up to five business days for us to complete your request. We will return your files, along with instructions, to you by email.
Dynamic Web Template pages can be found within the Templates folder of your web and are easily identified by the .dwt extension. They contain the basic page structure for all of your web (.htm) pages. You will find a .dwt for each different page layout included in your template package. If you change the .dwt page, all of the web pages based on that .dwt will also change. Dynamic Web Templates have both “editable” and “non-editable” regions. Editable Regions can change from page to page such as your page content. You open the web (.htm) page and make changes inside of the editable regions. Non-editable Regions are areas defined by the .dwt and cannot be changed on your .htm pages. To change non-editable regions, you have to open the .dwt file. Changing non-editable regions will change every web page in your site that is based on that .dwt page.
This template uses include pages to hold the navigation links. This allows you to easily make changes to your links on the appropriate include page rather than having to make several changes to the .dwt page(s). Note that the include page will look like there is no formatting applied. Just make your changes. Your changes will automatically be applied to each page that uses the included content and the correct formatting will appear on your pages. You will typically find the following pages in the Includes folder:
This template uses library items (.lbi) to hold the navigation links. This allows you to easily make changes to your links on the appropriate include page rather than having to make several changes to the .dwt page(s). Note that the library item page will look like there is no formatting applied. Just make your changes. Your changes will automatically be applied to each page that uses the included content and the correct formatting will appear on your pages. You will typically find the following in the Library folder:
This template package allows you to delete the pages you do not need and to rename existing pages if necessary. To edit the existing .htm pages, just delete our sample content. You can then type your own text and add any additional photos. Note that you will not be able to edit any “non-editable” regions on these pages.
Important: If you delete all content from an editable region, it may disappear and be difficult to find. Switch to Code or Split view and look for the following:
<!-- #BeginEditable “content” --><!-- #EndEditable -->
Type some placeholder text between the two tags as follows:
<!-- #BeginEditable “content” --><p>Content here</p><!-- #EndEditable -->
Switch back to Design view and you will now see the editable region and can add content to that area.
For Expression Web: To create a new, blank page based on a .dwt page layout, go to File > New > Create From Dynamic Web Template. In the dialog box that appears, select the appropriate .dwt page (if you template offers more than one page layout). When your new page is created, save the page giving it a unique name and page title. You can then add content to the editable regions.
For Dreamweaver: To create a new, blank page based on a .dwt page layout, go to File > New. From the dialog box that appears, choose Page From Template. You can navigate to the Templates folder of you web to choose the appropriate .dwt page template.
This template uses a CSS-based layout, which means that the page sections (header, sidebar, content, and footer) are positioned using CSS rather than within a table-based grid. Because this results in cleaner code, your pages load faster and search engines may rank your page better than they would in a table-based design.
When looking at your pages while in Design view, some elements may not appear correctly. Fonts may seem too large or small; spacing between elements may seem too wide, etc. While this can be a bit disconcerting, you will find it easy to keep previewing your site in a browser as you make changes. This will display your page correctly. To preview your pages, save the page after each change and then go to File > Preview in Browser.
Occasionally while editing your pages, you may “lose” the formatting. When this happens, save the page and then hit F5 to refresh your page. The page should snap back into position and the styles will return.
To help get your site listed in search engines and directories, we have added blank meta tags for keywords and description to each page. You will want to either delete these tags or add your own specific content. DO NOT leave our default content in these tags. To add your own unique page description and keyword content, right click on the page when in Design view and select Page Properties. In the dialog box that appears you can change the page title and add your own keywords and description for the page.
We include a simple JavaScript calendar in many of our templates. Note that you will not be able to see the calendar while in Design view. This script is set to show the current date only. If you do not wish to include the calendar, you can delete it from the code.
<p><script type="text/javascript" src="calendar.js"></script></p>
To change the size of the fonts in the calendar or to change the colors, you will need to edit the calendar.js file. [Credit for this application: http://www.bmgamble.com. While this script is free, we recommend that you give credit for all 3rd party applications.]
The Lightbox JavaScript consists of two files (the lightbox.js and a lightbox.css file) and three images (the animated loading.gif, the .png image for the dark overlay, and the close.gif that appears in the top, right corner of the display box). We recommend that you do not move or edit any of these files.
The Lightbox allows you to click on a small photo and have a larger image appear in a semi-transparent overlay that will appear on top of the page. The script will automatically size itself, so your images can be different sizes. Your hyperlinks will look like this:
<a href="images/photogallery/photo1_large.jpg"
rel="lightbox"
title="Photo 1 - Your photo description goes here">
<img alt="sample photo" src="images/photogallery/photo1_small.jpg" /></a>
[Credit for this application: http://huddletogether.com/projects/lightbox. It is also featured at http://www.dynamicdrive.com. While this script is free, we recommend that you give credit for all 3rd party applications. The sample images used in our photo gallery are image numbers 1106764, 32799, 210544, 502677, 496498, 1113494, 711837, 1104855 from Stock XChange at http://www.sxc.hu. )
This is a simple t JQuery JavaScript that will rotate through your images with a nice fade-in and fade-out effect. The images are set within the html coding on the .dwt template pages:
<div id="slideshow">
<img src="../images/mainimage1.jpg" alt="Slideshow Image 1" class="active" />
<img src="../images/mainimage2.jpg" alt="Slideshow Image 2" />
<img src="../images/mainimage3.jpg" alt="Slideshow Image 3" />
</div>
You can easily replace our images with your own, but must keep the same size (462 x 202 pixels). You would then set your own alt text for your image descriptions. You can add more images by following the pattern shown above.
[Credit for this application: Released by Jon Raasch (jonraasch.com) under FreeBSD license: free to use or modify, not responsible for anything, etc. http://jonraasch.com/blog/a-simple-jquery-slideshow]
[ ] Change the page title on all pages as appropriate.
[ ] Preview all pages by going to File > Preview in Browser. It's a good idea to check your site in more than
one browser.
[ ] Modify the keywords and description meta tags on each page.
[ ] Change or add alt text to each photo used on your site. Our images in this template have "sample" as the alternate
text.
[ ] Spell check each page.
[ ] You may remove our logo and any links to our site from the template.
[ ] Upload your new site to your web hosting space, remembering not to upload pages that have not been changed
from our basic template text.
We offer full customer support on all of our template packages. Please visit our web site at http://www.rtbwizards.com for both Expression Web and ProStores ecommerce template packages and http://www.myartsdesire.com for Dreamweaver template packages. We offer a variety of helpful resources available through our site. Need more? We also offer custom design services for your modification needs.
Karey Cummins, Owner
Round the Bend Wizards (http://www.rtbwizards.com)
Email: kareycummins@rtbwizards.com
My Arts Desire (http://www.myartsdesire.com)
Email: kareycummins@myartsdesire.com
Phone: 281-829-0888
Business Hours: M-F 8:00 am – 6:00 pm (Central Time)