...

View Full Version : Basic(ish) HTML questions



Arch-Enemy
09-18-2007, 03:46 AM
Hi,
I'm fairly new to HTML and have two questions.

1.How would I go about linking my homepage to a product page? I've tried a standard hyperlink from my homepage and used an anchor link on my products page with no success

2.I've made a text space but when I try it on Firefox it wont start a new carriage (the comments just become one big line) I should probably drop in the fact I've tried the wrap physical tags.

Any help will be greatly appreciated
Thanks :thumbsup:

PremiumBlend
09-18-2007, 04:01 AM
Can you please post the code that isn't working, then we can help steer you in the right direction. :)

rams1703
09-18-2007, 11:02 AM
first let us kno,how u tried to key ur code !
then raise ur question from it !!

regards,
rams

jlhaslip
09-18-2007, 12:17 PM
On your Home page, use this one:


<a href="http://www.product_domain.com/product_page.html" title="Link to my Product page."> Product Page </a>From your Product page, use this one:


<a href="http://www.my_home_page.com/index.html" title="Link to my Home page."> Home Page </a>Change the URL's, of course.

And we would need to see some code for the other question. :)

Arch-Enemy
09-18-2007, 04:00 PM
This is what I was trying to use -

<A HREF="PRODUCTS.HTM">Products Page</A> As the hyperlink

<A NAME="PRODUCTS.HTM#>View Are Products</A> As the anchor

For my text area I used this -

<TEXTAREA NAME="comments" ROWS="10" COLS="50" WRAP="virtual"></TEXTAREA>

This is what I used to try and start a new carriage (line) in Firefox. Works in IE but no luck in FF.

Thanks for any help.

The actual instructions I was given were as follows; create a menu (done this) on your homepage and have links to your product page and contact page etc. All I need is a heading saying products, contacts etc but I cant see how I can do this without making a full site. I'm almost certainly making some kind of amateur mistake

Arch-Enemy
09-19-2007, 05:08 PM
Surely someone can help me? :(

jlhaslip
09-19-2007, 08:35 PM
http://codingforums.com/showpost.php?p=612358&postcount=2

bazz
09-19-2007, 10:49 PM
sniff, sniff; smells like homework to me. ;)

but we can't even point you to a tutorial without seeing your code and, therefore, what you need 'tutorialised' on.

bazz

timgolding
09-19-2007, 11:57 PM
In other words paste what you did so far. In the mean time you could try looking for some tutorials on anchor tags, heres one I found

http://www.htmlgoodies.com/primers/html/article.php/3478171

Arch-Enemy
09-20-2007, 03:25 AM
Sorry for the wait. I didn't pick up on what I was being told / still may not be on the right tracks.

On the linking issue this is literally it - <A HREF="PRODUCTS.HTM">Products Page</A> and <A NAME="PRODUCTS.HTM#>View Are Products</A>

And yes..this is for college :D

jlhaslip
09-20-2007, 04:09 AM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>
Using anchors to Navigate a page
</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="expires" content="Mon, 01 Jan 1995 00:01:01 CST" />
<meta http-equiv="keywords" content="keywords list here, comma seperated" />
<meta http-equiv="description" content="insert a description here." />
<meta http-equiv="reply-to" content="jlhaslip@yahoo.ca" />
<meta http-equiv="author" content="Jim Haslip" />
<meta http-equiv="reply-to" content="jlhaslip@yahoo.ca" />
<style type="text/css">
/*<![CDATA[*/
/* =======
Template CSS
============*/

* html { margin:0; padding:0;}
html, body { height: 100%; }
#wrapper { min-height: 100%; } /* div you want to stretch */
body { margin:0 auto; text-align:center; background-color: #eeddbb; }
p { margin: 1em; padding:1em; text-align:left }
#wrapper { margin: 0 auto; width:1000px; background-color: #ffeecc; border: 1px solid #666666; }
#header { margin: 1em auto; text-align:center; border-bottom: 1px solid #666666; }
#header h1 { margin: 1em 0; }
#pagewidth { text-align: left; }
#footer { margin: 1em auto; padding: 1em; text-align:center; border-top: 1px solid #666666; }
#footer a { margin: 1em 3em; padding: .5em; }
/* =======
Page specific CSS Below this line
============*/
.content {
margin-left:auto;
margin-right:auto;
text-align:center;
padding:.5em;
padding-top:.5em;
width:750px;
background-color: #ee9999;
}
#hdr {
width:60%;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.test {
margin: 1.0em;
text-align:left;
background-color: #cc6666;
}
/*]]>*/
</style><!--[if lte IE 6]>
<style type="text/css">
#wrapper {
height: 100%;
}
</style>
<![endif]-->
</head>
<body>
<div id="wrapper">
<div id="header">
<h1>
Basic Page Anchors
</h1><!-- header -->
</div><!-- header -->
<div id="pagewidth">

<a href="#footer" id="top">Go To Footer</a> <!-- test for named anchor here -->

<div id="hdr">
<h1>Navigating within a Page</h1>
<h2>Using Anchor Tags</h2>
</div><!-- end hdr div here -->
<div class="content"><!-- page content starts below this comment -->
<p class="test" >Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
<div class="content"><!-- page content starts below this comment -->
<p class="test" > Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
<div class="content"><!-- page content starts below this comment -->
<p class="test" >Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
<div class="content"><!-- page content starts below this comment -->
<p class="test" >Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
</div ><!-- pagewidth --> <div id="footer">
<a href="#top">Go To Top of this Page</a>&nbsp;
<a href="http://validator.w3.org/check?uri=referer">validate the xhtml</a>&nbsp;
<a href="http://jigsaw.w3.org/css-validator/">validate the css</a>



</div><!-- footer -->
</div><!-- wrapper -->
</body>
</html>
So you need to link to another portion of a single page site? Those are referred to as 'named anchors'.
The above sample has a link at the top of the page which takes you down the page to the footer, and a link in the footer which takes you back to the top. Adjust to suit your needs.

Place a 'named anchor mid-page and call it 'Products', add links accordingly.

*** You may need to shorten the window to see the effect properly. ***

Arch-Enemy
09-20-2007, 10:22 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>
Using anchors to Navigate a page
</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="expires" content="Mon, 01 Jan 1995 00:01:01 CST" />
<meta http-equiv="keywords" content="keywords list here, comma seperated" />
<meta http-equiv="description" content="insert a description here." />
<meta http-equiv="reply-to" content="jlhaslip@yahoo.ca" />
<meta http-equiv="author" content="Jim Haslip" />
<meta http-equiv="reply-to" content="jlhaslip@yahoo.ca" />
<style type="text/css">
/*<![CDATA[*/
/* =======
Template CSS
============*/

* html { margin:0; padding:0;}
html, body { height: 100%; }
#wrapper { min-height: 100%; } /* div you want to stretch */
body { margin:0 auto; text-align:center; background-color: #eeddbb; }
p { margin: 1em; padding:1em; text-align:left }
#wrapper { margin: 0 auto; width:1000px; background-color: #ffeecc; border: 1px solid #666666; }
#header { margin: 1em auto; text-align:center; border-bottom: 1px solid #666666; }
#header h1 { margin: 1em 0; }
#pagewidth { text-align: left; }
#footer { margin: 1em auto; padding: 1em; text-align:center; border-top: 1px solid #666666; }
#footer a { margin: 1em 3em; padding: .5em; }
/* =======
Page specific CSS Below this line
============*/
.content {
margin-left:auto;
margin-right:auto;
text-align:center;
padding:.5em;
padding-top:.5em;
width:750px;
background-color: #ee9999;
}
#hdr {
width:60%;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.test {
margin: 1.0em;
text-align:left;
background-color: #cc6666;
}
/*]]>*/
</style><!--[if lte IE 6]>
<style type="text/css">
#wrapper {
height: 100%;
}
</style>
<![endif]-->
</head>
<body>
<div id="wrapper">
<div id="header">
<h1>
Basic Page Anchors
</h1><!-- header -->
</div><!-- header -->
<div id="pagewidth">

<a href="#footer" id="top">Go To Footer</a> <!-- test for named anchor here -->

<div id="hdr">
<h1>Navigating within a Page</h1>
<h2>Using Anchor Tags</h2>
</div><!-- end hdr div here -->
<div class="content"><!-- page content starts below this comment -->
<p class="test" >Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
<div class="content"><!-- page content starts below this comment -->
<p class="test" > Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
<div class="content"><!-- page content starts below this comment -->
<p class="test" >Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
<div class="content"><!-- page content starts below this comment -->
<p class="test" >Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</p>
</div>
</div ><!-- pagewidth --> <div id="footer">
<a href="#top">Go To Top of this Page</a>&nbsp;
<a href="http://validator.w3.org/check?uri=referer">validate the xhtml</a>&nbsp;
<a href="http://jigsaw.w3.org/css-validator/">validate the css</a>



</div><!-- footer -->
</div><!-- wrapper -->
</body>
</html>
So you need to link to another portion of a single page site? Those are referred to as 'named anchors'.
The above sample has a link at the top of the page which takes you down the page to the footer, and a link in the footer which takes you back to the top. Adjust to suit your needs.

Place a 'named anchor mid-page and call it 'Products', add links accordingly.

*** You may need to shorten the window to see the effect properly. ***

I really dont know how I can explain this but here goes.

Your close to what I mean, I'm trying to link one page to another but I dont know what codes I need. I know and can use your standard hyperlink (<A HREF=example.com>) but I'm trying to link from one page to another in my own site. All I need is an example of the code but can find one :(

Once again thanks for any help

timgolding
09-21-2007, 10:36 AM
that is the code that links from one page to another

Put this on first page:


<a href="page-to-link-to.html">link to other page</a>


Then this on the second


<a href="index.html">Orignal page</a>


As long as a document exists on your server that is the same as whats in the "" for the href, then it works

If youe teacher hasn't got the time to help then try this primer
http://www.htmlgoodies.com/primers/html/article.php/3478171

Arch-Enemy
09-21-2007, 06:03 PM
that is the code that links from one page to another

Put this on first page:


<a href="page-to-link-to.html">link to other page</a>


Then this on the second


<a href="index.html">Orignal page</a>


As long as a document exists on your server that is the same as whats in the "" for the href, then it works

If youe teacher hasn't got the time to help then try this primer
http://www.htmlgoodies.com/primers/html/article.php/3478171

That worked. I cant thank you enough :thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum