HTML Templates

Tutorial Home>Step1

Step 1: Obtaining the template of your choice

This step depicts how to search for templates using a keyword, how to purchase and download them. 

1. Go to the homepage of the templatepilot.com website.

2. Find the search box, type the specific keyword in it and press the Search button. The list of thumbnails will appear. You can also search templates by Author, Category and by template number. 

3. Choose the template you like and click on its screenshot to preview.

4. Click an image for preview.

5. Buttons on the bottom of the page are used for buying the template. (In this tutorial we will skip purchasing procedure. You will need to use your Credit Card or Paypal account in order to make a purchase). After making a purchase email will arrive to you in 2-20 minutes after your credit card or paypal account is charged. Follow the link in email to download zipped files of the chosen template.

6. Unzip the archive with WinZip. Visit http://www.winzip.com/winzip/download.htm to download a free trial version of WinZip if you do not have it on your computer. Please follow the instructions on that page to install WinZip on your computer.

7. Browse the unzipped files to find the following:

   • FONTS folder that contains fonts that you will need to edit the .psd source file but might not have installed in your system;

   • HTML folder with "index.htm" file and IMG folder - you can preview the page in a browser. You can use this folder if you wish to just customize HTML. Advanced users prefer to customize Photoshop file and make HTML out of it. HTML version of template contains buttons and other elements without text. This allows you to add custom text to empty cells;

   • JPEG folder with "TEMPLATE.jpg" file, which is a compressed image of your template;

   • PSD folder with "TEMPLATE.PSD" file that allows you making ANY modifications to design of your web site. You can customize fonts, colors and do just anything to make your website really unique. Later you will need to make HTML out of it and.... see next steps :);

   • LIBRARY folder contains advanced clipart library that you can use to give your template unique look.

After you have your template files unzipped and saved to your hard drive you can proceed to Step 2: Editing your template in order to do modification by editing text and graphics.

Step 2 >