Learn to customize an html template using this simple tutorial to edit our sample template.
- What are the programs you require in order to customize an html file?
Programs required for editing HTML file in the template
You can open an index.htm file with any HTML editor such as Microsoft FrontPage, Macromedia Dreamweaver or etc.
You can also use FrontPage Express program that included in Windows 98 .
Programs required for editing Photoshop file in the template
To edit graphic of our template (with given *.psd) , you need to have Adobe Photoshop 5.5 or a newer version of the same.
Programs required for editing Flash file in the template
To edit *.fla or Flash template you need to have Macromedia Flash 5.
- How do you insert your content?
You can enter texts at <your content here or pictures here>
- How can you change a link title?
You can replace "Your Link" with your link title such as Home, Services, and Contact
- How can you edit a Hyperlink?
For the Text link
<a href="http://www.atemplate.com">Your Link</a>
Replace "www.atemplate.com" to your web address.
For the Text link
<a href="#">Your Link</a>
Replace "#" to your web address.
For the Images link
<a href=http://www.atemplate.com><img src="bt.gif"></a>
Replace "www.atemplate.com" with your web address.
- How do you customize the template?
Customizing templates in the sample that begin with letter "c"
Ex: c014_bl , c025_bl , c038_bllht , etc.
Customizing the image link template
- You will find a blank image in which you can enter your text. The blank image will start with "b_". For example "b_bt" or "b_logo"
- If you want to use it the blank image as a HOME button, copy "b_bt" and paste it.
- Rename "copy b_bt" to "home".
- Now open any graphic editor to edit your home image. You can also use Paint program that is included in window98 for the purpose.
- Select a typing tool and colour for your "HOME".
- Type " HOME " on an image
- Add any effect that you like such as Drop Shadow, Bevel or Emboss.
- Repeat the process until you have customized all of your buttons.
Customizing templates in the sample that begin with letter "p"
Ex: p047_b , p063_o , p182_bdrk , etc.
Customizing the template graphic
- To change template graphic, edit the attached .PSD template file with Adobe Photoshop. Customize it as per your desire.
- Save the customized file :
- Go to Photoshop Menu Bar > File > Save for Web > save as "p.html" in the same directory as index.htm
- This will replace the existing images file with your new graphic.
- Open "index.htm" and adjust it according to your use.
Customizing the image link template
- To customize rollover menu, edit the attached .PSD template file with Adobe Photoshop.
- Change the name of each menu to suit your content. You may also change the colour or font.
- Save the customized file :
Go to Photoshop Menu Bar > File > Save for Web > save as "p.html" in the same directory as index.htm
Edit your menu for rollover
Go back to your .PSD template file then customize the menu such as changing colour of the button to make the button colour change when you rollover.
- After you have finished customizing, save the file:
- Go to Photoshop Menu Bar > File > Save for Web > save as "o.html" in the same directory as index.htm
- This will replace the existing images file with your new graphic.
- How to insert your content & picture in the Flash template?
Customizing templates in the sample that begin with letter "pf"
Here is the simplest way to edit the Flash.
- Open *.FLA file with Macromedia Flash 5
- Press ctrl+L to show Library window.
- Double click each object in the window to edit.
- How to create a button in Macromedia Flash5?
- Create your object button by typing a text or adding an image to your movie.
- Select the object, then press F8.
- Assign a name to the button and select its behaviour as "Button", click ok
- Edit it by double-clicking on it.
- Now you'll see 4 frames of the button: Up, Over, Down, Hit.
- Up is shown when the button is loaded.
- Over is shown when you put your mouse over it.
- Down is shown when you click on it.
- Hit is not shown in the movie at all. This frame is used to assign the area of the button.
- Click on the frame you want to customize and press F6 to create a key frame.
- After creating the key frame for each frame, change the text or picture as you wish.
- To exit the button editing, double click on blank area of the frame
- How to assign a target link to a button in Macromedia Flash5?
- Create a Button object.
- Right click on the button and select "Actions"
- Double click "Get URL" under the main topic named "Basic Action"
- In "URL" text field, type your HTML address in absolute link i.e. http://www.yourdomain.com/file.html
- In "Window" text field, choose any of the following options from the drop-down list box:
- _self = opens the URL in the same window as the flash template.
- _blank = opens the URL in a new window.
- _parent = opens the URL in the same frame (if any) as the flash template.
- Now, on the right section of Action window, you'll see:
on (release) [GetURL ("http://www.yourdomain.com/file.html”, "_self") ;]
- Viewing the file correctly in Netscape old version, which doesn't support CSS:
- View the source code of the HTML
- Remove the tag
<link rel="stylesheet" href="style.css" type="text/css">, seen in, <head> ... </head>
This will remove CSS from the template.
- Assign the font type and font size to each paragraph as you desire.
|
