HTML Tips

Cache Page HTML Tips

Before the character(s) you want to be bolded type then type a word or sentence and when you want the bolding to
end type .

Italicise a word or Sentence:
Before the character(s) you want to be italicized type then type a word or sentence and when you want the italics to
end type .

Colorize a Word or Sentence:
Before the character(s) you want to be a color other than black type then type a word or sentence and
when you want the color to end type . You can change the color
by changing the name such as; red, orange, green etc.

Add a Carnage Return or Line Break:
At the point where you want to end a line and start another line of text immediately below the current line type .

Start a New Paragraph:
At the point where you want the current paragraph to end and a new paragraph to begin with a blank line between the
paragraphs type .

Center, Left or Right Justify a Sentence or Paragraph:
Before the text you with to justify type to center the text. At the end of the text or paragraph type to
end the justification. Note that the default justification is left justification so typically you do not need to left justify. If you
wish to right justify simply type and type your text followed by when you wish to end the paragraph
justification.

Indentation and Creating Spaces:
If you wish to indent a paragraph type &nbsp: only use a semi-colon instead of a colon and note that each &nbsp:
represents one space. If you simply want to insert a blank space type &nbsp: as many times as you wish before typing the
next text. Remember to use a semi-colon instead of a colon.

Create a List of Items with Bullet Points:
First type <UL><Li> then type the heading of the list.
Second type <Li> followed by the first item on the list followed by </Li>
Third type <Li> followed by the first item on the list followed by </Li>
Repeat the third step until you have listed all of the items.
Finally type <UL> which ends the list.

Create a Scrolling Banner:
This is a more complex HTML code with a number of variables including the size, color and font of the text. Below is the full
HTML code as well as examples of some of the variables you can change.

<center><marquee bgcolor="#FFFFFF" loop="-1" scrollamount=
"4" width="75%">TYPE WORDS YOU WISH TO SCROLL HERE</marquee></center>

Variable - Color
Where you see 'marquee bgcolor=' you can insert the color you prefer. You can use simple colors such as red, green or
orange or complex colors using the hex color code. Google 'hex color chart' and you'll find many color variables. Here are
a few examples; Black = #000000, Dark Blue = #00008B, Pine Green = #003300, turquoise = #00C78C, gray = #4A4A4A,
purple = #551A8B, grape = #660198.

Variable - Font Size
Where you see the text size="+3" you simply change the number. +1, +2, +3 and so on creates font size which which is
one or more times larger than the standard font size in HTML. You can also make the font size smaller by using -1 or -2.
Test it out on your cache page and adjust the value to achieve the look you want.

Variable - Font Face
Where you see the text <font face="Times New Roman" you can choose another font type by replacing Times New Roman
with fonts such as arial, algerian, courier etc. Google 'safe HTML fonts' for more examples of fonts you can use.

Hide Information in Your HTML:
This technique will not allow anyone to see what you've typed unless they view your source code. Simply type . The finished HTML will look like this 

Add an Image:
The code is shown below. First you need to upload the image to the cache page. When the image displays click on the
image and it will open in a new window. Copy the URL or web address and insert
that address into the formula below.

<img src="INSERT URL HERE"target="_blank">

Variable - Align the Image to the Left, Right or Center:
Use the code above but before <img scr= type the following . Replace "center" with "left" or "right"
depending on weather you want the image aligned left or right instead of center.

Align the Image and Allow the Surrounding Text to Wrap Around the Image:
The HTML code is shown below, it's a variation on the code above only showing the image border as zero and then you
can choose if you want the image to the right or left of the other text on the page.

<img border="0" align="right"
src="http://web page url here" />

Add an Image Which is a Link to Another Web Site:
The code is shown below. First you need to upload the image to the cache page. When the image displays click on the
image and it will open in a new window. Copy the URL or web address and insert that address into the formula below.

Where you see "http://www.gogeocaching.com/" this is where you insert the web site you want the link to go to.

<a rel="nofollow"
href="http://www.gogeocaching.com/"
target="_blank"><img src="Image URL goes here"
width="40%" height="40%" /></a>

Variable - Size
If the image is too large or too small you can change the width and height by modifying the percentages.

Text Which Links to Another Web Site or File:
The code is shown below, you need to copy the URL you wish to have the text link to into the code where it says
"http://cord.info/GC426FH" and then insert your text between the greater than and less than symbols > <.

<a rel="nofollow" href=
"http://coord.info/GC426FH"target="new">TEXT HERE</a>

Add the GoGeocaching.com Logo to Your Page:
If you found any of these HTML tips useful consider adding the GoGeocaching.com logo to your cache page. Simply copy
and paste the code below onto your cache page..

<a rel="nofollow"
href="http://www.gogeocaching.com/"
target="_blank"><img src="http://www.gogeocaching.com/gogeocaching_logo_medium.jpg"
width="40%" height="40%" /></a>

If you're looking for a quick tips check out the simple HTML code tips below.