How to Customize the WordPress Layout in Photoshop

1. Launch an FTP client such as FilleZilla, FireFTP or WSFTP on your computer and log into your website host FTP account. You will see the folders on your server host in one pane and the folders on your computer in the other pane.
2. Navigate to the folder within your WordPress installation that contains the image files for your template. This location will vary depending on the template but will often be located in a folder such as “/public_html/wp-content/themes/(ThemeName)/images” where “Theme Name” is the name of the theme you want to customize. Sometimes themes do not have an “Images” folder but place images directly into the theme name folder.

3. Navigate to the folder where you would like to save your images in the pane that displays your computer files.
4. Click on the images you want to customize and click the “Transfer” button to move the files to the folder on your computer. The “Transfer” button will look different depending on the FTP client you are using but often appears as an arrow or simply the word “Transfer.”
5. Launch the Photoshop program, click “File,” then click “Open.” Double-click the WordPress image file to load it in Photoshop.
6. Use the Photoshop tools to color and customize the images. You can change the color or draw designs using the paint tools and add your own text using the text tool.
7. Save the changes to your image file when you are finished customizing it.
8. Return to the FTP client and transfer the edited images from the folder on your computer to the image folder on the website server. This will overwrite the current image with your new customized image. When you view your WordPress site you will now see the changes you made in Photoshop appear on your WordPress layout.