The BoxedArt Guide to Using Website Templates

Using Adobe Photoshop to Edit Graphical Image Text

Launch Photoshop, go to File > Open and locate the "psd" folder that came with your template package. Open the folder and select the .psd file you want to open.

To replace text or images in the .psd you must first select the layer that holds the item.

A shortcut to locating the appropriate layer is to Control-click on the text you wish to modify.(Choose the Move Tool from the toolbar and hold down the Ctrl key on your keyboard while clicking on the text in the document.)
The Layers palette will immediately show the correct layer as highlighted in blue.

Ctrl-clicking on an item snaps the Layers palette to its layer. You can click on the eyeball icon to hide the layer if you wish to make sure it is the correct layer. Click the eyeball icon again to show the layer once more. You may also wish to name the layer for future reference.  To do so, right-click on the Layer's name in the palette and choose Layer Properties from the list.

Editable text layers are marked by a T in the layers palette. If the layer shows a yellow alert next to the T, your computer does not yet have the font for it installed.  You will need to install the font file(s) that came with your template and then return to Photoshop. See: How to Install a New Font (If the layer for the text has no T it has been rasterized, i.e., is no longer editable with the Text tool. Click on the document with the Text tool to create a new text layer and type in your new text. Choose the font from the font dropdown list and choose the color and size you want.)

Once you have located the layer the text is on and the layer is selected in the palette, choose the text tool from the toolbar (the T icon).  Place your cursor at the beginning of the text on the screen - the cursor will change to an I-prompt. Click and drag across the text to select it.  Then type your new text over the old.   While the text is selected, you may also change its size, as was done here:

When you have the text image the way you want it, you will need to save it for the web and insert it into your html web page file.
For more on saving graphics for the web, see Optimizing Website Template File Size when Saving for Web

In most of the .psd files that come with your template you will see paragraphs of text, known as body text:



These are included in the .psd file for you to visualize the entire layout, but you should not save them as graphic files. This text should be typed in the html file for the web page. 

This is also the case for any forms pictured in your .psd files. Web forms such as these need to be created in the html file, not saved as graphics.

Table of Contents

Copyright © 2007 Big Resources, Inc. All Rights Reserved