Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 14 of 14
  1. #1
    New to the CF scene
    Join Date
    Sep 2007
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Basic(ish) HTML questions

    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
    Last edited by Arch-Enemy; 09-18-2007 at 03:50 AM.

  • #2
    Regular Coder PremiumBlend's Avatar
    Join Date
    Apr 2006
    Location
    Marion, Iowa
    Posts
    201
    Thanks
    0
    Thanked 13 Times in 13 Posts
    Can you please post the code that isn't working, then we can help steer you in the right direction.
    My Website: DumpsterDoggy

  • Users who have thanked PremiumBlend for this post:

    timgolding (09-19-2007)

  • #3
    New Coder
    Join Date
    Sep 2007
    Posts
    34
    Thanks
    0
    Thanked 7 Times in 7 Posts
    first let us kno,how u tried to key ur code !
    then raise ur question from it !!

    regards,
    rams

  • #4
    Regular Coder
    Join Date
    Feb 2007
    Location
    Canada
    Posts
    924
    Thanks
    10
    Thanked 56 Times in 55 Posts
    On your Home page, use this one:
    Code:
    <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:
    Code:
    <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.
    Last edited by jlhaslip; 09-18-2007 at 12:20 PM.

  • #5
    New to the CF scene
    Join Date
    Sep 2007
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    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
    Last edited by Arch-Enemy; 09-18-2007 at 07:24 PM.

  • #6
    New to the CF scene
    Join Date
    Sep 2007
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Surely someone can help me?

  • #7
    Regular Coder
    Join Date
    Feb 2007
    Location
    Canada
    Posts
    924
    Thanks
    10
    Thanked 56 Times in 55 Posts

  • #8
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    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

  • #9
    Senior Coder timgolding's Avatar
    Join Date
    Aug 2006
    Location
    Southampton
    Posts
    1,517
    Thanks
    114
    Thanked 110 Times in 109 Posts
    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/h...le.php/3478171
    You can not say you know how to do something, until you can teach it to someone else.

  • #10
    New to the CF scene
    Join Date
    Sep 2007
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    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

  • #11
    Regular Coder
    Join Date
    Feb 2007
    Location
    Canada
    Posts
    924
    Thanks
    10
    Thanked 56 Times in 55 Posts
    Code:
    <!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. ***

  • Users who have thanked jlhaslip for this post:

    Arch-Enemy (09-20-2007)

  • #12
    New to the CF scene
    Join Date
    Sep 2007
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by jlhaslip View Post
    Code:
    <!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

  • #13
    Senior Coder timgolding's Avatar
    Join Date
    Aug 2006
    Location
    Southampton
    Posts
    1,517
    Thanks
    114
    Thanked 110 Times in 109 Posts
    that is the code that links from one page to another

    Put this on first page:
    Code:
    <a href="page-to-link-to.html">link to other page</a>
    Then this on the second
    Code:
    <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/h...le.php/3478171
    You can not say you know how to do something, until you can teach it to someone else.

  • Users who have thanked timgolding for this post:

    Arch-Enemy (09-21-2007)

  • #14
    New to the CF scene
    Join Date
    Sep 2007
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by timgolding View Post
    that is the code that links from one page to another

    Put this on first page:
    Code:
    <a href="page-to-link-to.html">link to other page</a>
    Then this on the second
    Code:
    <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/h...le.php/3478171
    That worked. I cant thank you enough


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •