6. Replacing Images



The images in a template are generally only for reference. When you'll create your own web site starting from a template you'll need to replace some of the images in the template with your personal images or with your company images. In this tutorial you'll learn how to open and bring a new image in the main layout replacing an old one.

Open the index.psd file located in template/psd. (Note: if the opened file has the slices visible just press Ctrl+H to hide them)

Now open a new image from tutorial/tutorial_images:
Select the image layer you want to replace by pressing Ctrl+click on the image. The image layer will be selected. In this example select "img3" layer. You can also select a layer directly from the Layers palette clicking on the layer you want.
Drag the new opened image over the selected image.

The new image will become a new layer placed over the previously selected layer in the original .psd file. The layer will be named "Layer 1"

As you can see the image you want to replace ("img3" layer) has a stroke. We must copy the layer style and apply it to the new image layer. To to that select the image layer you want to replace and right-click anywhere in the blue area to display the menu. In the options menu choose "Copy Layer Style"

Select the new image layer and right-click in the layers blue area to display the options menu. Now choose "Paste Layer Style"
Now select the image layer you want to replace ("img3" layer) and press the Delete Layer icon shown below and it in the dialog box that pops up confirm that you want to delete the layer.
And now you have a new image with the same style (a thin stroke)