WGA logo for stat box

[knoffer]

I was wondering if the WGA logo is available so it can be displayed in the stat box instead of the GC or Signal the frog logos now available. http://forums.groundspeak.com/GC/index.php?showtopic=150367&hl=

knoffer

[Jeremy]

Note you have to be logged in to the Groundspeak forums to view the topic referenced above.

Unfortunately, the WGA logo is not one of the choices for the stat box logo and it looks like Groundspeak is not accepting new logos from other regional organizations. As soon as they do, we can whip up a small version of the WGA logo for the stat box and provide it to them.

An alternative would be to modify the stat box image coming back from geocaching.com… the WGA server could be instructed automatically replace the Groundspeak logo with the WGA logo. This would increase the load on the WGA server, as everyone using a stat box with a WGA logo would “hit” the WGA server to get the stat box image file…

[knoffer]

Thanks for the update and quick response. I certainly don’t want to load up the WGA servers. Was a general question and not a request. I can certainly wait til the day GC.com allows it.

Thanks,

Ken

[Cheesehead Dave]

@Jeremy wrote:

An alternative would be to modify the stat box image coming back from geocaching.com… the WGA server could be instructed automatically replace the Groundspeak logo with the WGA logo. This would increase the load on the WGA server, as everyone using a stat box with a WGA logo would “hit” the WGA server to get the stat box image file…

I can definitely confirm that this would work…

[Cheesehead Dave]

WARNING!!! TECHNICAL STUFF AHEAD!!!

---

Here’s an interesting method I worked out. It uses Java Script and CSS and because of that, it will only work on pages that you can fully edit, such as a personal home page that you get from your ISP.

Here’s what you need:

1. The URL of your stat button image. Go to your profile page, right click on the image and pick “Copy Image Location” or whatever your browser calls it.

2. A 44×44 graphic to use as the logo which will be overlaid on the button. I used this one: Feel free to save that to your own personal webspace instead of directly linking to this one, as it might not always be there.

3. This bit of Java Script: (Note: you need to eliminate the space in the word ‘scr ipt’ at the top and bottom. The forum software wouldn’t let me enter the word ‘script’ just in case I was trying to hack the forums…)

function overlay()

{

var button_x = button_y = 0;

obj=document.getElementById('my_stat_button');



if(obj.offsetParent)

while(1)

{

button_x += obj.offsetLeft;

if(!obj.offsetParent)

break;

obj = obj.offsetParent;

}

else if(obj.x)

button_x += obj.x;



obj=document.getElementById('my_stat_button');

if(obj.offsetParent)

while(1)

{

button_y += obj.offsetTop;

if(!obj.offsetParent)

break;

obj = obj.offsetParent;

}

else if(obj.y)

button_y += obj.y;



document.getElementById('logo').style.left=(button_x+3)+'px';

document.getElementById('logo').style.top=(button_y+3)+'px';

document.getElementById('logo').style.zindex=20;

document.getElementById('logo').style.visibility='visible';

}

Here’s how it all comes together:

On your HTML page, put the stat button where you want it like normal, inside an tag:

You need to make one little change, however. You need to add ‘id=”my_stat_button”‘ to your tag so it now looks like this:

What that just did was to give that button a name so the JavaScript can refer to it easily.

Next, add this bit of code to put the overlay logo on your page. It doesn’t really matter where you put it, as the Java Script is going to reposition it elsewhere, anyway. Personally, I put it just before the tag at the botton of your HTML:

The src= can be any graphic you want, but it should be 44×44 pixels. Note that the tag is surrounded by

tags. That’s important.

Next, take that Java Script above and paste it into your page, just before the tag at the top.

Finally, change your tag to read

What this does is automatically call the overlay() function as soon as your page is done loading.

That’s it! Here’s a working example here.

Disclaimer: I’ve only tested it with Firefox and IE6. It won’t work if people are using older browsers or have Java Script disabled. I think it will work with Safari as well, but I don’t have a copy here at work to test it out.

[Team B Squared]

edit…never mind

[Cheesehead Dave]

@Team B Squared wrote:

edit…never mind

Oh, come on… you can say it! I’m a big geek! 😆

[Team B Squared]

@Cheesehead Dave wrote:

@Team B Squared wrote:

edit…never mind

Oh, come on… you can say it! I’m a big geek! 😆

Nope, I wasn’t calling you a geek, I had one of those dumb questions that I answered about 2 seconds after hitting the submit button. 😳

[Jeremy]

@Cheesehead Dave wrote:

Here’s an interesting method I worked out. It uses Java Script and CSS and because of that, it will only work on pages that you can fully edit, such as a personal home page that you get from your ISP.

Very clever way of editing the stat box image… I like how you shifted the burden of editing the image to the client accessing the web page instead of some poor server somewhere. 😀 Hopefully this solution will tide people over until geocaching.com (possibly) allows organizations or individuals to submit custom images for the stat box.

What I didn’t like was the small WGA logo itself. Nothing against what you did Dave, it is just that when our normal logo is reduced to that size it is nearly impossible to read or discern anything. So for those of you who want to try the custom WGA logo stat box, I came up with a couple logo variants that are also 44×44 pixels that I think look a little better. I also copied Dave’s original small logo to the WGA server to give it a permanent home.

WGA logo, no text, GPS and ammo box
(No need for words… you ever notice how our logo has the outline of the state of Wisconsin, a GPS receiver, and an Ammobox = WGA. Deep. :))

http://wi-geocaching.com/banners/wga_icon_44_1.gif

WGA logo, full text, GPS and ammo box, white background

http://wi-geocaching.com/banners/wga_icon_44_2.gif

WGA logo, big WGA text, GPS and ammo box

http://wi-geocaching.com/banners/wga_icon_44_3.gif

WGA logo, big WGA text only

http://wi-geocaching.com/banners/wga_icon_44_4.gif

WGA logo, full text, GPS and ammo box, tan background, Dave’s original logo

http://wi-geocaching.com/banners/wga_icon_44_5.png

[Cheesehead Dave]

Nice logos!

[Johnny Cache]

@Cheesehead Dave wrote:

Nice logos!

Hey now. Let’s keep it clean, geeks.

[Author]

Posts