Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML How to Make a Website Adding Pages to a Website Add a New Page

Posted by Christopher Mathis
Christopher Mathis
1,237 Points

Site will not switch to about page. Am I missing something within my code?

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Kwaku Osei-Bonsu | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href='https://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400,400italic,700,700italic,800' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
  </head>
  <body>

 <header>
      <a href="index.html" id="logo">
    <h1> Kwaku Osei-Bonsu</h1>
    <h2>Designer</h2>
       </a>
      <nav>
      <ul>
        <li><a href="index.html">Portfolio</a></li>
        <li><a href="about.html" class="selected">About</a></li>
        <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>

<div id="wrapper">
      <section>
      </section>
      <footer>
        <a href="http://instagram.com/oseicanyousee/"><img src="img/instagram.png" alt="Instagram Logo"></a>
        <a href="http://www.facebook.com/kwakuob"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
        <p>&copy; 2014 Kwaku Osei-Bonsu.</p>
      </footer>
      </div>
  </body>
 </html>

(Edited by BothXP to add Markdown)

Jesus Mendoza
Jesus Mendoza
23,289 Points
Jesus Mendoza
Jesus Mendoza
23,289 Points

Your page is named about.html? Is it in your main folder?

bothxp
bothxp
16,510 Points

Hi Christopher,

Can you describe what's going wrong? The above code looks like it is from your about page. Is the actual problem trying to open this page? In which case we'd need to see the code from your starting page, or some info on any error messages or behaviours that you are seeing. Then we can try to help.

Christopher Mathis
Christopher Mathis
1,237 Points

Below is the code from the index file that I began with and copied to start my about.html page. When I open the browse to click on the about page nothing happens. Essentially, I am hoping to see an about page where the body is blank so that I may add a bio and picture. 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Kwaku Osei-Bonsu | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href='https://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400,400italic,700,700italic,800' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
  </head>
  <body>
    <header>
      <a href="index.html" id="logo">
    <h1> Kwaku Osei-Bonsu</h1>
    <h2>Designer</h2>
       </a>
      <nav>
      <ul>
        <li><a href="index.html"> class="selected">Portfolio</a></li>
        <li><a href="about.html">About</a></li>
        <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <div id="wrapper">
      <section>
        <ul id="gallery">
        <li>
          <a href="img/numbers-02.jpg">
          <img src="img/numbers-02.jpg" alt="">
          <p>Experimentation with color and texture.</p>
            </a>
         </li>
          <li>
            <a href="img/numbers-06.jpg">
              <img src="img/numbers-06.jpg" alt="">
          <p>Playing with blending modes in Photoshop.</p>
            </a>
            <li>
          <a href="img/numbers-12.jpg">
          <img src="img/numbers-12.jpg" alt="">
          <p>Trying to create an 80's style of glows.</p>
            </a>
         </li>
  </ul>
      </section>
      <footer>
        <a href="http://instagram.com/oseicanyousee/"><img src="img/instagram.png" alt="Instagram Logo"></a>
        <a href="http://www.facebook.com/kwakuob"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
        <p>&copy; 2014 Kwaku Osei-Bonsu.</p>
      </footer>
      </div>
  </body>
 </html>
bothxp
bothxp
16,510 Points

Thanks Christopher,

So your starting index.html page opens ok in your browser, but when you try and click on the word 'About' in the menu nothing happens?

Does the mouse pointer change if you hover it over the link to your 'About' page?

Christopher Mathis
Christopher Mathis
1,237 Points

BothXP -- Yep, when I hover the color changes, but when I click nothing happens. Odd.

Christopher Mathis
Christopher Mathis
1,237 Points

BothXP, Ethan and Jesus -- Thank you so much! Restarted my browser and Im back on track. You guys rock.

3 Answers

bothxp
bothxp
16,510 Points
bothxp
bothxp
16,510 Points

Yes, very odd.

My next suggested would be the same as Ethan, refreshing the browser. In fact I'd go as far as making sure everything is saved and then restarting your browser.

I'm assuming that you are using Workspaces and I have seen a few strange things in the past with the browser caching when using Workspaces.

Do you have a status bar, or little status pop-up in the bottom left hand corner of the browser window when you hover your mouse over the 'About' link, and if so what does it say?

(I've got to log off now, good luck with getting to the bottom of the issue)

Christopher Sea
Christopher Sea
3,726 Points
Christopher Sea
Christopher Sea
3,726 Points

Looks like your problem is the closing anchor bracket after .html"

"index.html"> class="selected">

try this= "index.html" class="selected">

Ethan Weeks
Ethan Weeks
15,352 Points
Ethan Weeks
Ethan Weeks
15,352 Points

Works well for me! Make sure to save your files and refresh the browser window after every change.