A few years ago I picked up a HTML for Dummies book and read through it, but never took the time to do anything with it. When I got into geocaching and I was looking through other cachers profile pages and trying to figure out how they were doing some of those thing. I wrote to Jat311andElf for help, he referred me to a couple of web sites ( http://www.usd.edu/trio/tut/html/index.shtml or http://www.weballey.net/html/index.html incase you want to learn more) and what I had read a couple of years ago started coming back. Plus I dug out that Dummy book once again and started to play. Now, thanks to this game I've been able to put a use to writing HTML code and with this web site been able to take it a step further.
Here's: Using HTML on your cache page, part 1. I have had no formal training with this, so I'm no expert at this, but I believe if I can do this anyone can. I'm going to show you how to do some fun things when creating or revising your cache page. You can also use what you learn here and use it on your profile page. In part one, we will go through some simple terminology and a few easy codes for you to play with this month. If you want you can even cut and paste from this page to help in your learning process.
When writing HTML code the code is placed in what they call a tag, which is also called angle brackets <>. Code writing within these brackets and are properly tagged will not be seen on the web page. The cool thing is, is that what you put in the brackets tells your browser how you want the font to look like, where you want to link to, what picture you want to show and so on. To me all of this is very cool. Before any of this will happen geocaching.com needs to know you are going to write in code, make sure you place a check mark where it asks are you writing in HTML.
The first simple, but very useful tag is called a line break tag <br>. You would use this tag if you want to drop down one line with no space between the lines. It actually looks as if you hit the enter key once on a word processor. The place I use this is in the short description section.
Here's an example of how you would write it on the edit page (make sure you check the HTML box):
Park in parking lot<br>
You will need a pen and tweezers
Here's an example of how it would look on the cache page:
Park in parking lot
You will need a pen and tweezers The break line tag stands alone it doesn't need a partner. The rest of the codes we are going to learn in this section will be partnered up. They are called an opening tag <tag attribute> and a ending tag </tag>. The opening tag tells the browser what
ATTRIBUTE
we want to use to control the fonts/page and the ending tag will tell the browser when we want to stop using that tag, make sure to place a back slash before the name of the ending tag.
Before we go onto playing with the fonts, lets use our paired tags to place a paragraph line break <p> PARAGRAPH </p>. When using these tags the paragraph line break it will drop down two lines leaving a blank line between the two paragraphs, lines or words however you want to use this tag.
Here's an example of how you would write it on the edit page (make sure you check the HTML box):
<p>Park in parking lot</p>
You will need a pen and tweezers
Here's an example of how it would look on the cache page:
Park in parking lot
You will need a pen and tweezers OK let's start playing with the fonts. Using the same tag partners as before let's says we wanted to bold a certain section of our description. On the edit page you will use a bold code tags <b> DESCRIPTION</b> (note if you want to type it all out you can use <strong> DESCRIPTION </strong>)
<b>Very easy grab and go.</b>
On the cache page it will look like this:
Very easy grab and go. How about ITALISAZING the fonts, use the same basic tags <i>DESCRIPTION</i>
How you would write it on the edit page:
<i>Very easy grab and go.</i>
On the cache page it will look like this:
Very easy grab and go.
You can play with different combinations. Tag them first in last out style.
<b><i>Very easy grab and go.</i></b>
Very easy grab and go. Change the size of the font. Heading tags <h1>WORDS</h1>will bold and make the fonts larger, with heading tags the smaller the number the larger the the font will be.
Example of sizes:
How you would write it on the edit page:
<h1>Geocaching</h1>
Geocaching
How you would write it on the edit page:
<h2>Geocaching</h2> Geocaching
How you would write it on the edit page:
<h3>Geocaching</h3> Geocaching
How you would write it on the edit page:
<h4>Geocaching</h4> Geocaching
How you would write it on the edit page:
<h5>Geocaching</h5> Geocaching
There should be enough here to get a hang of it, if you have any questions on anything that we have covered here just email me and I'll walk you through it.
Next issue we will cover changing the font style and its color. |
