Using Dreamweaver with Ecommerce Templates
- First step - defining your site in Dreamweaver
- How to get started in Dreamweaver
- Troubleshooting Dreamweaver issues
Give your ecommerce template site a name and browse to the folder you extracted the template to. For getting started you won't need to fill in any other information.
You'll find the package has some sample pages, the store .asp/php pages and a file called Main.dwt in the Templates folder. To make site-wide changes to the design, adding your company name, changing the menu etc. you'll need to work from this file. The news sections are often library files and these can be found in the Library folder. Once you've made the changes, save the file and you'll be prompted if you want to update all the files using this template or library file - agree to the prompt and you should be able to see the modifications you've made.
- This video will walk you through the steps of opening the PHP version of Ecommerce Templates in Dreamweaver.
Now that you can see how the general design changes can be made, this is how you would proceed.
- Get your general design done locally, more or less the look you need for the site - don't worry about the products and links for the moment. The ecommerce templates come with .png files in the images/extras folder, so changing colors, titles and company name etc is simple - Adobe have a 30 day free trial available for Fireworks if you don't already have a copy.
- You don't need to make any design changes to the files in the vsadmin folder as you'll be the only one using those pages for adding product information, shipping stuff, categories, credit card processors etc.
- Now you can upload all your site to your server - you can do this through Dreamweaver itself or using a specialist FTP program.
- This is where the fun starts - you'll probably want to get some categories and products on your store so you'll have to log into the admin section - chances are that first of all you'll need to change the path to your database in the file vsadmin/db_conn_open.asp or vsadmin/db_conn_open.php - here's a quick way of checking to get the path correct for the ASP ecommerce plus templates and here for the PHP version.
- Now that's done log into your online admin control panel at www.yourdomain.com/vsadmin/login.asp or www.yourdomain.com/vsadmin/login.php - and the first thing to do is change the default username and password so no-one else can get in.
- Take a look around the various options, the ecommerce templates come with some sample products, categories and descriptions and although they will need to be deleted, they should give you a good idea of how the system works.
- That's about it, you can now start setting up your shopping cart and site in general - check out the user manual and if you run into any difficulties, take a look at the support forums.
If your pages don't update after making a change to the dwt file, make sure your site has been defined as in the steps above. You can also go to Site > Advanced > Recreate Site Cache to make sure that Dreamweaver is recognizing all your files. Another option would be to close Dreamweaver, copy your store files to a new location and set up the site definition again.
If you are seeing code in design view it probably means that Dreamweaver is picking up the coding of the include files from the vsadmin/inc/ folder. You could remove the vsadmin folder from your local site but perhaps a better solution would be to go to Edit > Preferences > Invisible elements > uncheck the "server side includes" box - and show dynamic text as recordset field.
Remember that editable regions will need changing on a page by page basis. Typically the main content in the center of the page is editable but also the title / meta tags section at the top of the code - it's important to have unique content there on each page, reflecting the content so you wouldn't want that to be a global setting in the dwt file.