Click here to Print

Dreamweaver Extensions

Introduction

Macromedia® Dreamweaver® is a popular Web page design application for more advanced Web designers. You can use the V4.1 Dreamweaver extensions in place of WebWizard to design your Web pages and still have access to the V4.1 e-commerce tools.

You will need to install Dreamweaver 3 before installing the V4.1 extensions. Instructions for this can be found in the Dreamweaver help files. The V4.1 Dreamweaver extensions automatically pass information between the V4.1 tool set and Dreamweaver, allowing you seamless use of most of the V4.1 tools, within the Dreamweaver application.

Installing Dreamweaver Extensions

On the V4.1™ Tools Manager page is a link to download the Macromedia® Dreamweaver® 3 extensions.

The Dreamweaver extensions icon

Selecting this link will automatically install the plug-ins if you have the Dreamweaver Extension Manager. If you do not have this application, you will need to download it from the Macromedia Website at: http://www.macromedia.com

Using Dreamweaver Extensions

Back to Top

Creating a new site
Please Note: These directions are for Dreamweaver 4, for directions for setting up a site with Dreamweaver MX, please refer to the online help for MX. You would use the same information as below within MX.
  1. After installing the Dreamweaver® extensions, open the Dreamweaver program from your hard drive. An untitled, blank document window will appear on your screen.

  2. Click Site on the tool bar at the top of this page. A drop-down list will appear.

The Dreamweaver site menu
  1. Select New Site. A Site Definition dialog window will open.

The Dreamweaver Site Definition menu
  1. Select Local Info from Category menu. The frame on the right will display the options within the selected Category.

  2. Name your site in the appropriate text box. You will need to choose a Local Root Folder, which specifies where the site will be stored on your hard drive. You can browse the directories on your hard drive by clicking the folder icon next to the Local Root Folder text box.

  3. Select Web Server Info from the Category menu.

  4. From the Server Access drop-down menu, select FTP. Several FTP text boxes will open below.

The Web Server Info screen and FTP text boxes
  1. Fill in the text boxes as follows

  1. Click OK.

  2. A pop-up window will appear asking you if you would like to create a cache site. We recommend selecting Yes. Having a local cache site improves the speed of link and site management tasks.

  3. After the cache site has been created, your site map window will open automatically. This lists the files in your site. It will appear empty if you your site is newly created.

The Dreamweaver site map window
  1. Click Connect from the tool bar buttons. Once you are connected to the host, all the host files will be listed under Remote Site.

  2. Click Refresh for an updated list of host files.

To move a file from the Remote Site to the Local Folder, select the file and click Get. To add an entire list of files, click the open folder at the top of the list and click Get. The entire list of files will be imported.

Designing Pages within Dreamweaver

  1. Instructions for using Dreamweaver specific tools can be found in the help section of the Dreamweaver application.

  2. The PWEB V4.1 tools available within Dreamweaver are found in the Objects palette. To view this, select Objects from the Window menu.

The Dreamweaver Window menu

  1. The Objects palette will appear. From the drop-down menu, select V4.

The Dreamweaver Objects palette with V4 extensions selected

  1. The Add a Form, Add a Checkout Button, Add a Product and Update Products/Forms/Channels icons will be listed. Click once on the icon you wish to work with. From this point on, you will work with each V4.1 tool in much the same way you would work inside the V4.1 environment.

  1. Place your cursor where you want to locate your form and select the Add a Form icon. The Add Form window will appear.

  2. Designate a form name, whether you want the form to be forwarded to your e-mail, and/or a success page.

  3. Select a channel and/or an auto-response from the drop-down menus to apply to your form.

  4. Click OK. The form will be placed in your Dreamweaver editor.

  1. Place your cursor where you want your checkout button located. You can also highlight an image or text to be used as a checkout button. Select the Add Checkout Button icon.

  2. The checkout button will appear in your Dreamweaver editor.

  1. Place your cursor where you want the product image located. Select the Add a Product icon. The Add Product window will appear.

  2. Select whether you want to place the product in the Dreamweaver editor, create a category link, or create a product link. You can also highlight images in your editor for category and product links.

  3. Select the desired category and/or product from the drop-down menus.

  4. Click OK. The actions and/or images will be applied to your Web page.

  1. When you click this icon a prompt will open asking if you would like to overwrite the file data.pwb.

  2. Click Yes to complete the update.

Updating Changes to Your Files

  1. To work with any of the files listed in your local folder, click the file name.

  2. Make your changes and select Save from the File menu. You will be returned to your site window.

  3. Select the modified file and click Put. A prompt will appear asking you if you want to overwrite the file.

  4. Click Yes.

The file titled data.pwb contains all of your site information, such as all product information, and created WebChannels categories and AutoResponder messages. DO NOT delete this file. It is essential in order for your site to work properly with the Pacific WebWorks™ products. You can, however, make changes to the items within this file. To do this, you must click Disconnect before making changes to your site. After making changes, reconnect by clicking Connect. Select the data.pwb file and overwrite the file with your new changes.

Added technical support for the Dreamweaver product can be found at http://www.macromedia.com/support/dreamweaver/