DreamweaverTemplates.Net - Top quality templates at great prices!

 

  Dreamweaver Templates Help Files
  1. Change Layout Colors

  2. Substitute Swap Images

  3. Substitute the pictures in the template with your own pictures
 

  Change Layout Colors
In Fireworks
Step 1 Open template.png
Step 2

Click on Windows/Find and Replace (or Ctrl+F) to open the Find and Replace panel.

Step 3 In the Find and Replace panel choose Search Document from the first drop-down menu and Find Color from the next drop-down menu.
Step 4 Enter the find and replace colors to change the colors in the template.
Here's a screenshot of what it should look like:
Step 5

Once all the colors are changed in the template you need to export all the images again so that they are refreshed in the Dreamweaver template.

  1. Open the Layer panel by clicking on Windows/Layers
  2. View the web layer by clicking on the eye icon next to the web layer in the Layer panel.
  3. All the slices will show in green. Right click on the changed slices and click on Export Selected Slices
  4. Export the slices to the images folder
  5. When you preview the template in IE you should be able to see the new images

In Dreamweaver

Some colors may have to be changed in the html code also. In this case you have to open the Dreamweaver template and make changes to the template. Follow the instructions given below:
Step 1 Open the Dreamweaver template (template.dwt)
Step 2 Click on Edit/Find and Replace… to open the find and replace tool in Dreamweaver.
Step 3 Choose Current Document from the Find In: drop-down
Step 4 Choose Source Code from the Search for: drop-down
Step 5 Enter the color you want to replace in the first text field and the new color in the Replace With: text field.
Step 6 Click on the Replace All button to replace all the instances of the color
Here's a screenshot of what it will look like:
Step 7 Once you've changed all the colors your template should look fine. Preview the template by clicking on File/Preview in Browser

      

  Substitute Swap Images
Step 1 Open template.png.
Step 2 If your template uses swaps you'll find that the png template is divided into different frames. Each frame will have a different swap representing each of the sections.
Step 3 To view all the swaps in the fireworks template open the Frames panel by clicking on Windows/Frames. Click on each of the frames to view different instances of the swaps.
Step 4 Unlock all the layers so that you can select the pictures you want to change.
Step 5 Right click on the object you want to change (circle with the image) and click on Ungroup. Once the picture is ungrouped you can easily replace the pictures with your own pictures. All you need to do is place the picture on top of the circle then cut the picture, select the circle and click on Edit/Paste Inside. This will paste the picture within the circle thus giving the picture a circular look.
Step 6 Repeat these steps for each of the swaps in each of the frames.
Step 7 Preview the fireworks template by clicking on the preview tab found on top.
Step 8

Once all the pictures are finalized and are looking fine in fireworks, the next step is to export all the swaps - the names of the swaps will be as follows:

  • swap.jpg - for the swap in the first frame
  • swap_f2.jpg - for the swap in the second frame
  • swap_f3.jpg - for the swap in the third frame and so on
Step 9 Select the same slice in each of the frames, name it according to the above instructions and export the slices to the images folder.
Step 10 Once the pictures are exported preview the Dreamweaver template in IE to test if all the swaps are working fine.

      

  Substitute the pictures in the template with your own pictures
Step 1 Open template.png.
Step 2 Unlock all the layers so that you can select the pictures you want to change.
Step 3 Select the picture you want to change, delete it and replace it with your own pictures. Make sure your own pictures are the same size as the existing images. You can use the marquee tool to crop your picture to get the same size.
Step 4

Once you've changed all the pictures you need to export the pictures again so that they are refreshed in the Dreamweaver template. Follow the following instructions to export the images:

  • Open the Layer panel by clicking on Windows/Layers
  • View the web layer by clicking on the eye icon next to the web layer in the Layer panel.
  • All the slices will show in green. Right click on the changed slices and click on Export Selected Slices
  • Export the slices with the same names to the images
Step 5 When you preview the template in IE you should be able to see the new images