Making a web badge

[MacPanda]

hey folks just making a page and wanted to make a web badge basically an image that points the person to my web page and my friends can put on their site but i am not sure how to do that i really just want to supply the image as a link integrated inside it so they can simply embedd it in . thanks here is the image below. all help appreciated. :apple:

http://farm2.static.flickr.com/1215/544280569_d2b001b9d2_o.gif

[Dimwhit]

Never mind. didn't work.

[MacPanda]

all help appreciated :) thanks

[yagran]

what i dont understand what you want?


<a href="http://yoursite.com" target="_blank"><img src="http://yoursite.com/yourimage.jpg" border="0"></a>


thats the code to have a linked image in HTMl, is that what you where after?

[snickelfritz]

You might try creating a Flash movie with the URL embedded in it.
Maybe one the Flash experts here could talk you through the process.

[yagran]

You might try creating a Flash movie with the URL embedded in it.
Maybe one the Flash experts here could talk you through the process.

no need for flash here, the simple code above is sufficient. if you want basic animation in the 'badge' i would reccomend just using an animated gif format.

[tominated]

what i dont understand what you want?


<a href="http://yoursite.com" target="_blank"><img src="http://yoursite.com/yourimage.jpg"></a>


thats the code to have a linked image in HTMl, is that what you where after?

Even better :
css
#badge {
display: block;
width: widthinpixelspx;
height: heightinpixelspx;
background: url(path/to/image.png);
}

html
<a href="yourlink" id="badge" rel="external" title="pagename"></a>

[yagran]

Even better :
css
#badge {
display: block;
width: widthinpixelspx;
height: heightinpixelspx;
background: url(path/to/image.png);
}

html
<a href="yourlink" id="badge" rel="external" title="pagename"></a>

sorry but how is this better in any way? he wants to distribute it to friends for links on their site, so the shortest amount of code is the BEST solution surely. your method adds nothing

[MacPanda]

hey folks thanks for your replies and help - what i am trying to do is give people an image that they can put on their website and when a person clicks on that image it takes them to my little page. Thanks for the html code but i don't know how to link it to the image - when i wanted to make a link on something i would just use a hot selection in dreamweaver to put over the image and that would do it - do i supply the code and the image separately? i am a little bit lost. thanks once again for your help guys.

[Dimwhit]

hey folks thanks for your replies and help - what i am trying to do is give people an image that they can put on their website and when a person clicks on that image it takes them to my little page. Thanks for the html code but i don't know how to link it to the image - when i wanted to make a link on something i would just use a hot selection in dreamweaver to put over the image and that would do it - do i supply the code and the image separately? i am a little bit lost. thanks once again for your help guys.

MacPanda, linking to an image is basically the same, regardless. The code in Dreamweaver to link to an image will be:

<img src="image path here">

That's all we're doing. The path will depend on where your image is. Currently, it's:

<img src="http://farm2.static.flickr.com/1215/544280569_d2b001b9d2_o.gif">

Ideally, you want to upload the image and make the link something like:

<img src="http://www.flowoflava.com/images/imagename.gif">

Then, all you need is the code so that when you click on it, it takes people to your site. It works like any other link you make in Dreamweaver. The final code is like yagran posted:

<a href="http://www.flowoflava.com" target="_blank"><img src="http://www.flowoflava.com/images/imagename.gif" border="0"></a>

Not sure that helps, but there you go.

[dcv]

Take a look at the way Apple (http://www.apple.com/about/webbadges/) or the W3C (http://validator.w3.org/check?uri=http%3A%2F%2Fvalidator.w3.org%2F) do theirs :)

[MacPanda]

thanks folks i think i worked it out - what i will do is put the image on my webspace and send people the line of code to add to their page - thanks so much for your help - i am not great a coding stuff :( wish i was. thanks once again tho ...