How to use templates

Setting up template

At first select a template theme what you want to use. There is three different colour schemes where to choose from. You can select: Blue, DR (Pink) or Green theme. When you have previewed and choosed template you would like to use download template.

Download:
blue.zip
dr.zip
green.zip

Step 1 - Make a folder on your computer like "My RPStuff Page"
Step 2 - Download entire contents of your selected template (ie, green.zip) and extract contents in folder you made in step 1.

Creating your page

Step I - Title

After you have saved template in your computer open document (named blue, dr or green) in text editor like Windows Notepad.

In text editor you see page as HTML (Hyper Text Markup Language) code.

At first you could enter a name for your web page. Enter title you want between<title> </title> tags replacing - ENTER TITLE OF THE PAGE HERE - text

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
	<title> - ENTER TITLE OF THE PAGE HERE - </title>
	<LINK REL="stylesheet" HREF="styles/template_style.css" TYPE="text/css">
</head>

This title will appear on Internet browsers title bar like -

Step II - Your avatar

NOTE: If you do not want to use avatar (picture which appear top left corner of the page) you can skip this step and to to step III.

Look from code where it reads:

<div class="imagespace">
<!--insert your URL to you icon here, example below-->
<img src="pics/icon_lightning.jpg" height="180" width="180" align="left" border="0" alt="Lightning">
</div>

First look for picture which is maximum 180 pixels wide and 180 pixels tall.
Then move picture you want to use as your avatar in pics folder located in folder you created earlier and enter picture name where it reads "icon_lightning.jpg" and adjust width and height values to match size of your avatar.

NOTE: If your avatar is not located in "pics" folder you need alse enter right path to make picture appear on your page.

Step III - Entering header and description on your page

Look for code as following:

<div class="description"<
<h3>How to use templates</h3>
<p>This is a guide for using RPStuff.org templates on your own web-site.</p>

Put header of the page between <h3></h3> tags and you can also enter short description for your page by editing what is between <p> </p> tags on line below.

Step IV - Putting context on your page

Next we put some more content on page. There is a line reading:

You can remove all "Blaa blaa blaa" and enter what do you like there.

Step V - Uploading your page

Finally save edited template as index.html and upload entire contents of your work folder using FTP in your directory.

Some tips and tricks

Most Most HTML tags require an "opening" and "closing" like <p>Starts a paragraph and </p> ends it.

If you want to start new paragraph enter: <p>

If you want to add headers for some paragraphs enter:<h3>Header here</h3>

will render as:

Header here

If you want to create italic text type: <i>Text to be italic</i> will render as Text to be italic

If you want to create bold text type: <b>Text to be bold</b> will render as text to be bold

If you want to create underlined text type: <u>Text to be underlined</u> will render as text to be underlined

Links:

You can add link on your page by using following code: <href="link URL here">Link name here </a>

If you want to add picture on your page type: <img src="picturesfoldername/picturename.extentension">
NOTE! - unlike most HTML tags IMG tag doesn't end with </img>