create link for a button?

[sinsofpleasure]

Hi, im very new to html and i have a website for which id like to include a 'return home' button. I already have a button image obtained through a free website. But i need the html to make this image into a link that will return the buyer to my home page when its clicked.. Can anyone help pls....?

[EinsteinsEyes]

<a href="HOMEPAGE"> <img src="IMAGELOCATION"/> </a>

replace HOMEPAGE and IMAGELOCATION with the appropriate text.

[globegenius]

An easy way of doing it. Go to Google gadgets and type in html / java script editor into the search box on the page. When you find the one you want add it to your home page. You can add images to it and insert a url . After you add an image run your mouse over the pic holding your mouse down. The link chain will then highlight. Click on it and add your url. Then click the save icon. You can then open the html icon and copy the code and put it were ever you like. Its a great little tool for developing.

[sinsofpleasure]

I tried this (copied and pasted) and changed the wording as you said but it just came up with a picture of a broken file.!

I read on a website the following

How To Make the Button
Here are the commands I used to place the button above:

<FORM METHOD="LINK" ACTION="page1.htm">
<INPUT TYPE="submit" VALUE="Clickable Button">
</FORM>

If you've already read the tutorial on forms you already know most of this. For those of you who don't, note this: The first command (the FORM command) has three parts. Here's what each part means:

* FORM tells the computer a form item is going here.
* METHOD tells the computer how to handle the form command. In this case, you are making a link.
* ACTION denotes what connection you want to make. Here we made a connection to something called "page1.htm."
Note: When using these buttons, make links using the entire URL: http://www.etc.etc.etc.

The second command (the input command) places the button. It has two parts, and here's what they mean:

* INPUT TYPE tells what type of input will occur (duh!). In this case you want to "submit" something. You see, the FORM command above is looking for a link. Here you are "submitting" a link. Get it?
* VALUE is the wording that appears on the button.

Finally, end the whole thing with this:

</FORM>
It's simple and it looks nice.

Now if i change the wording n URL it works but it does not have my image for the button just the plain white style like the submit ones on here
Thank you if any one can help me!!!

[digitalweb]

<a href="home.htm"><img src="button.jpg"></a>
This code help you to give link to return page button.

[sinsofpleasure]

thanks to everyone thats helped..All sorted.

[mjjtt]

I have used the

<FORM METHOD="LINK" ACTION="page1.htm">
<INPUT TYPE="submit" VALUE="Clickable Button">
</FORM>

structure detailed in this thread, but having couple of problems creating multiple (4) buttons

minor one that if I finish with </FORM>, buttons don't work (but do work if I omit)

The buttons display ok, but

Even tho' I change the ACTION= instruction to a different webpage, or to an external webpage, each button just goes to the destination in the first button.

Is there more code I need to add?

[rtrethewey]

First off, use:

<form method="get" action="example.htm">

because "LINK" is invalid. Second, you'll need separate <form>s for each button. If that's what you're doing, post all of your code so people can check it out.

[Major Payne]

All the code shown is well and good except for those using uppercase where you may be coding to XHTML. :P Your "Home" button should be part of the navigation menu placed on all HTML pages. No "form" tags need to be used for this. Take a look at these:

Nav Menus (See following sites for navigation menus):

CSS Library Horizontal CSS Menus: http://www.dynamicdrive.com/style/cs...y/category/C1/
CSS Library Vertical CSS Menus: http://www.dynamicdrive.com/style/cs...y/category/C2/
http://www.dynamicdrive.com/dynamicindex1/
http://www.cssplay.co.uk/menus/
How to Style an Unordered List with CSS: http://www.webreference.com/programm...le2/index.html

How To:

http://www.w3.org/TR/WCAG10-HTML-TECHS/#links
http://www.creativepro.com/article/d...vigation-links
http://efuse.com/Design/navigation.html
Simple JQuery Accordion menu: http://www.i-marco.nl/weblog/jquery-accordion-menu/
Drop-Down Menus, Horizontal Style: http://www.alistapart.com/articles/horizdropdowns/

Sexy Drop Down Menu w/ jQuery & CSS: http://www.noupe.com/tutorial/drop-d...query-css.html
NavDock jQuery Plugin (Ver 1.5.1): http://plugins.jquery.com/project/NavDock
Making CSS Rollover Buttons: http://www.elated.com/articles/css-rollover-buttons/

The Right Way to Make a Dropdown Menu: http://www.sitepoint.com/blogs/2009/...dropdown-menu/

If you just want the one button for "HOME", easier:

Image Link:

<p><a href="relative path to index.html" title="HOME"><img style="width: XXpx; height: YYpx; border: 0;" src="relative path to image" alt="Text Description"></a></p>

You can change the "p" tags to div tags and style as needed.

[mjjtt]

Thanks a lot for your replies

This is my code - want to send viewer to 3 different web sites depending on which button they click.

But with this code all buttons lead to first option (one.html)

I tried changing code to lower case but still same problem

Changed LINK to GET but again no change.

(Minor puzzle that if I change VALUE="Computers> to VALUE="Computers"> it then displays the style command from next line as text??)

This is my code so far

<div class="widget widget_links">
<ul>
<h2>1. Talk About Computers</h2>
<br>

<div style="text-align:right;">

<FORM METHOD="get" ACTION="one.html">
<INPUT TYPE="submit" VALUE="Computers>
"style="width: 150px; height: 40px;
font-size:20px; font-weight:bold; color:black;background-color:white;"

<br><br>
</li>
</ul>
</div>


<br>

<div class="widget widget_links">
<ul>
<h2>2. Talk About Money</h2>
<h4>Anecdotes and Stories</h4><br>

<div style="text-align:right;">
<FORM METHOD="GET" ACTION="http://www.talkingeasy.com/30money.html">
<INPUT TYPE="submit" VALUE="Money>

"style="width: 180px; height: 40px;
font-size:20px; font-weight:bold; color:black;background-color:white;"

</li>
</ul>
</div>

<br>

<div class="widget widget_links">
<ul>
<h2>3.Books About Money</h2>
<h4>Book Excerpts</h4><br>

<div style="text-align:right;">
<FORM METHOD="GET" ACTION="http://www.bitsofbooks.com/30money.html">

<INPUT TYPE="submit" VALUE="Money>
" style="width: 150px; height: 40px;
font-size:20px; font-weight:bold; color:black;background-color:white;"
</li>
</ul>
</div>

Appreciate your help

[rtrethewey]

The immediate problem is that you aren't using the closing </form> tag for your buttons and you're misplacing some other tags. Each one should look like:

<div class="widget widget_links">
<h2>1. Talk About Computers</h2>
<br>
<div style="text-align:right;">
<form method="get" action="one.html">
<input type="submit" value="Computers">
</form>
<br><br>
</div>

[mjjtt]

Hi

Yes I agree you'd expect a </form> closing and I originally coded it that way
but when I put it in, it disables the button completely
(When you click on it, nothing happens)

when I take it out, back to same situation - all buttons go to one.html

[mjjtt]

OK the problem's in the style command I used

style="width: 150px; height: 40px;
font-size:20px; font-weight:bold; color:black;background-color:white;"

when I take that out and put in the closing </form> it directs where it's supposed to

apologies, my stupidity