Jump to content

What programs do you use to make your description into HTML code?

zimmazimm

By zimmazimm
in How do I...?

Followers 3

Recommended Posts

zimmazimm

zimmazimm

Posted
Posted

Hi there! I'm fairly new to geocaching.com, and I've seen some very professional cache descriptions. I've hid a couple of caches, and I want my cache descriptions to be eyecatching and awesome. I can make some really nice desktop publishing flyers and stuff, but what programs do you use to turn it into HTML code, in order to copy and paste it into the Long Description?

 

Thanks!

Zimmazimm

Link to comment
Iowa Tom

+Iowa Tom

Posted
Posted

A lot of information can be found at this thread

 

I myself do the HTML by hand. I do a lot of copying of code and pasting it in. It can be a real headache because the GC website tries to make corrections automatically, as far as I can tell. The corrections often add extra " " which disabled the ability of the browser to read the code for color and so on. I find it necessary to find the extra " " and so on and edit them out on the webpage editing feature. I may be able to help if you decide to do something the way I do. I use the auto-correct feature in Word to save time. Like when I type hreff.. up comes <A rel="no follow" href="http:// ">words</a>. To that I simply input a URL and add words that when clicked on go to the link.

 

Good luck.

 

-it

Link to comment
palser

+palser

Posted
Posted

On short descriptions where I use HTML, I normally type it in by hand. Not hard after you kind of get the hand of it. For longer descriptions and where I use some graphics, I resort to MS FrontPage. I believe I am using the 2003 Version. Actually it is pretty easy to use and the learning curve was not at all hard. Cut & paste works well and the WYSIWYG turns out well for the most part.

 

Dr. P

Link to comment
Iowa Tom

+Iowa Tom

Posted
Posted

A lot of the HTML that I learned how to use was obtained by finding something that I was interested in on a webpage then finding the code in the source information. E.g. let’s say that you want to know how I set up the table with pictures at my Look again my friend geocache. Look for a distinct word or set of words that are written right before the table. In this case the words “mode for” should work. Now go to the tool-bar at the top of the screen and if you are using IE click on Page, then View Source or if you are using Firefox click on View, Page Source. On your keyboard hit Ctrl F (a shortcut for find) and type in the words, mode for. [NOTE! Sometimes the HTML gets split between two lines so a word search may not locate “mode for this” but it will locate “mode for”, for instance. In other words, don’t give up if you cannot find a two or more word part of a sentence.] Now click on next. The screen will take you to the HTML that comes right before the table begins.

 

The HTML for my table begins with…

 

<center>

<table border="1" bgcolor="green">

<tr>

<td></td>

<td>

<center><b><font size="3" face=

"Microsoft sana serif"><font color="Yellow">1</font></font></b></center></td>

<td>

<center><b><font size="3" face=

"Microsoft sana serif"><font color="Yellow">2</font></font></b></center></td>

<td>

<center><b><font size="3" face=

"Microsoft sana serif"><font color="Yellow">3</font></font></b></center></td>

Notice that part way through the table HTML is this…

 

<td><a rel="nofollow" href=

" Lookagain.jpg?t=1193402099

<img src=

"http://img.geocaching.com/cache/0739b07d-8062-4fd0-adbd-7cd7e9824045.jpg"

width="55"></a></td>

 

The leaves image that shows in the table cell to begin with is the second URL; it’s the one that is set with a width of 55. When you click on that image up comes the leaf face image whose URL is listed first. It goes like this: URL- 1 on top is what you go to when you click on the URL-2 on the bottom.

 

The code for tables is pretty intuitive. Like , <tr> means the beginning of a table row and <td> means table data and </td> means the end of that table data.

 

If you would like to get a copy of the short-cuts I use when typing in HTML let me know and I’ll send it to you in a Word document.

 

One of the biggest problems I have had is making tables and pictures too big for the screen of computers that have their screen resolution set much lower than what I have mine set at. I don’t realize that I’ve done that till I go to the school where I work and see it on an older computer.

 

Notice how, at the bottom of my "Look again" cache page, I adapted the geochecker tool. I got the HTML code as supplied by the geochecker site and adapted it. When you click on the geochecker symbol the checker webpage comes up. To get the URL for the geochecker icon I used Firefox. Simply right click on the graphic and click on Copy Image Location.

 

The HTML for the geochecker is…

 

<br>

<a rel="nofollow" href=

"http://www.geochecker.com/index.php?code=f9ebfdcd8c81095f6b64a16b3595a0b9&action=check&wp=47433136573536&name=4c6f6f6b20616761696e206d7920667269656e6421&visitcount=1">

<font color="white">.</font></a> <a rel="nofollow" href=

"http://www.geochecker.com/index.php?code=f9ebfdcd8c81095f6b64a16b3595a0b9&action=check&wp=47433136573536&name=4c6f6f6b20616761696e206d7920667269656e6421&visitcount=3838ccf6f9446c63fa91d414ecfb4c37">

<font color="white">.</font></a>

<center><a rel="nofollow" href=

"http://www.geochecker.com/index.php?code=ebd805460bd13ad0a2c3b67ca827c41b&action=check&wp=474354514842&name=497361616327732050757a7a6c65&language=">

</a> <a rel="nofollow" href=

"http://www.geochecker.com/index.php?code=f9ebfdcd8c81095f6b64a16b3595a0b9&action=check&wp=47433136573536&name=4c6f6f6b20616761696e206d7920667269656e6421&language=">

<img src="http://www.geochecker.com/gc3_coin.gif" border="3"

vspace="5" hspace="5" width="100" align="center"></a></center>

 

The <br> serves as a break to separate the checker graphic from the text above it.

 

I would also say use Firefox and NOT Internet Explorer when writing up a webpage. I do this in part because Firefox has a spell check built in. One of my pet peeves is careless spelling.

 

One last thing. Copy all your work into a text document before pasting it into the GC.com edit box.

-it

Link to comment
TrailGators

+TrailGators

Posted
Posted (edited)

When I started I used to cut and paste the html for the cache description from someone else's cache page that I liked into Notepad. Then I tweaked that code for my page and then pasted it into my new cache page form (don't forget to check the html box or you'll lose it all). It's fairly easy to understand what you need to change. Now I just cut and paste from my own cache pages and tweak them.

Edited by TrailGators
Link to comment
Driver Carries Cache

+Driver Carries Cache

Posted
Posted

I'm just sitting here cleaning up some hideous code that one of my customers created in some WYSIWYG monstrosity. There are plenty of sites on the net that will teach you (most importantly) good, clean, compliant html that will display neatly on any browser, on any platform. It may not look identical on every computer, but it will be neat and readable and won't break.

 

For an easy, un-intimidating starting point, I'd recommend: www.htmldog.com/

 

DCC

Link to comment
Iowa Tom

+Iowa Tom

Posted
Posted

This is something that I have wanted to ask. Does anyone know if the GC webpage will accommodate a mouseover event? If so can someone provide a simple example along with the code?

 

Thanks,

-it

That would require javascript, which is a no-no in cache pages.

Thanks. That saves me the hassle of more research. I figured that was the case.

 

-it

Link to comment
Iowa Tom

+Iowa Tom

Posted
Posted

It's ironic in a way for me in that I didn't want to take the time to learn how to use a program for creating HTML so I learned it the hard way. In doing it that way I understand a lot more than I would have otherwise. At least I think I do. :unsure: One of these days I would like to try something that will free up more of my time however.

Link to comment
Miragee

+Miragee

Posted
Posted

A lot of the HTML that I learned how to use was obtained by finding something that I was interested in on a webpage then finding the code in the source information.

 

<snip>

That is what I have done as well. In fact, when I took a class to learn HTML, I was really surprised that was what the instructor said we could do . . . :)

 

Most of the time the HTML code I use on my cache pages is simple, using codes easily memorized. Codes such as <b> for Bold and </b> for closing the Bold formatting.

 

This is a good page to Bookmark and refer to when sprucing up your cache pages. :)

Link to comment
Iowa Tom

+Iowa Tom

Posted
Posted
This is a good page to Bookmark and refer to when sprucing up your cache pages. :)

The background feature explained at that website, namely,

 

Background: <BODY BACKGROUND="http://nozen.com/geo/hpbackground.jpg" BGPROPERTIES="fixed"> creates the background seen on http://www.geocaching.com/seek/cache_details.aspx?ID=1065310

does not work anymore, right? Seems like I remember reading about how they did away with what I think were called backgrounds.

Link to comment
Prime Suspect

+Prime Suspect

Posted
Posted (edited)
This is a good page to Bookmark and refer to when sprucing up your cache pages. :D

The background feature explained at that website, namely,

 

Background: <BODY BACKGROUND="http://nozen.com/geo/hpbackground.jpg" BGPROPERTIES="fixed"> creates the background seen on http://www.geocaching.com/seek/cache_details.aspx?ID=1065310

does not work anymore, right? Seems like I remember reading about how they did away with what I think were called backgrounds.

This is the kind of bad code (bad, because it introduces a <body> tag inside an existing <body> container) that HTMLtidy thankfully strips out. There is now a field on the cache edit page to specify a background image.

Edited by Prime Suspect
Link to comment
Rattlebars

+Rattlebars

Posted
Posted

This is something that I have wanted to ask. Does anyone know if the GC webpage will accommodate a mouseover event? If so can someone provide a simple example along with the code?

 

Thanks,

-it

 

GC strips some code and GC adds some code and GC screws up some code, but mouseover works dandy.

 

You can see the following mouseover in action at: Black or White

 

Mouseover works fine. Here's mine which preloads the images (which are small) and it even includes a link should you click on it:

 

<center><img src="http://www.rattlebars.com/geocache/tr1.gif"

style="display:none;"> <img src=

"http://www.rattlebars.com/geocache/trani.gif" style=

"display:none;"> <a rel="nofollow" href=

"http://www.rattlebars.com/geocache/index.html" target=

"_blank"><img src="http://www.rattlebars.com/geocache/tr1.gif"

border="0" onmouseout=

"this.src='http://www.rattlebars.com/geocache/tr1.gif'"

onmouseover=

"this.src='http://www.rattlebars.com/geocache/trani.gif'">

</a></center>

Link to comment
Rattlebars

+Rattlebars

Posted
Posted

I also have an FTF alert box at the top of my most recent cache placements. You may be interested. Once there's an FTF finder, I just change the text inside the quotes and it will say the name of the FTFer.

 

<center><button onclick=

"alert('Nobody yet, go for it!')">FTF</button></center>

<br>

 

You can see at: Black or White

 

My old caches won't be edited because I have code in them that's been "grandfathered" and will get stripped out under the new editing parameters in place on GC.

 

Here's one: Jimmy's Coalburg Garage

Link to comment

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
Followers 3
Go to topic listing
×
×
  • Create New...