Email address:
Password: Forgot password?
  Remember me
  No account yet? Register
How do I put an image/banner on my profile page?

1. The image
Choose one of the options below.
- I have the image code or the banner codeShow
- I have an image online (e.g. on the cache page)Show
- I have an image on my computerShow

2. Place the html-code
Now we are going to put the image on the profile. Go to: http://www.geocaching.com/profile/. Now click Edit Your Profile, or go directly through this link: https://www.geocaching.com/account/settings/profile.

Edit your profile

Bio

At the bottom of the page you will find a header About, this is the area for your profile information.

3. Save changes
Finally we need to save the made changes. Click the Save Changes button at the bottom of the page.

Save changes

4. Finished
Finished! The image is now visible on your profile.
Below you will find some extensions that might be handy.

5. Hyperlink
I might be useful to set up the image as a hyperlink. This means that if someone clicks the image a webpage (or image) will be opened. Use the following code for this:

<a href="Hyperlink">Image code</a>

Where hyperlink is the link to the webpage that needs to be opened.
The full code will then be:

<a href="Hyperlink"><img src="Image location" alt="Description" title="Description"></a>

6. Dimensions
Without resizing the images in advance it is possible to show the image with other dimensions than the original. This can be accomplished by adding the width and height attributes, expressed in pixels. An image with a width of 100 pixels and a height of 200 pixels will be:

<img src="Image location" alt="Description" title="Description" width="100" height="200">

By filling out both width and height the image might be pulled out of it's width-height ratio. Luckely it is also possible to use only one of the two. If, for example, only the width is used, the height will change accordingly. The code will then be:

<img src="Image location" alt="Description" title="Description" width="100">

7. Center
To center the image on the page we only need a small piece of code:

<p style="text-align:center;">Image code</p>

The full code will then be:

<p style="text-align:center;"><img src="Image location" alt="Description" title="Description"></p>

Geocaching Toolbox Japiejoo Creative Commons-License
GeocachingToolbox.com is licensed
Powered by Geocaching HQ   Last update: 06-09-2018
Changelog
Copyright © 2019
GeocachingToolbox.com, Japiejoo
under a Creative Commons-License
unless stated otherwise
Powered by
Geocaching HQ
Status Contributions
About GeocachingToolbox.com