Adding Image Effects to your website

In this tutorial I want to show you how to insert an image effect into your website; you will see how easy it is to integrate Creative Dw Image Effects in the layout of your web-page. Firstly I just want to remind you that, in order to be able to solve the tutorial, you will need the Creative Dw Image Effects extension installed on your computer; if you encounter any problems while doing that, please visit the “How to install an extension” tutorial.


Click here to download the required files for solving this tutorial.


1. Open Dreamweaver, create a new website and a new file; save your file. If you have problems creating your website, try reading the “How to create a website” tutorial. I want to use an already-created page, I will take one from Dreamweaver's „page-from-sample”'s. The one I chose is called „Entertainment – Product page”, but if you choose another one, it will be the same thing; try and if you have any problems, don't hesitate to contact me at support@extendsudio.com.

2. From the Insert menu – the Image Effects section, Insert a new Simple Image Effects on your newly-created page.

Insert a Simple Image Effects instance

Insert a Simple Image Effects instance

3. Let's configure the Image Effects instance first; browse for the image file (you can find it attached to this tutorial) and then select the respective static effects from the list and add them.

Configure the Simple Image Effects instance

Configure the Simple Image Effects instance

4. Configure the effects as you can see in the following screen-shots:

Round Corners effect configuration

Round Corners effect configuration

Glossy effect configuration

Glossy effect configuration

5. Click OK to insert the Simple Image Effects instance in the page; now save your file and preview it in a browser (F12). You should see something like this:

Preview your file

Preview your file

As you could see in the tutorial, Image Effects is really easy to implement in an already-created layout and it looks very good as well. Thank you for your time and I hope this tutorial was useful to you. I invite you to read the rest of our tutorials and check out our other products on www.extendstudio.com. If you have any questions please contact us at support@extendstudio.com.