Trapped in a blog post URL

#1

I’m building out a Middleman site, trying it for the first time. I have a navigation bar partial which I include at the top of each layout.

<nav>
  <ul id="nav-display">
     <li><a href="index.html">Home</a></li>
     <li><a href="about.html">About</a></li>
     <li><a href="allblog.html">Blog</a></li>
  </ul>
</nav>

The Blog button takes me to a page with all the blog posts listed and a 250 word article summary. Then I can click through to an individual blog.

Each blog uses the a layout with the navbar partial at the top, but then the navigation gets stuck there.

For example, a blog post URL is

http://localhost:4567/blog/2018/05/24/testingblogpost/

But then when I click on, say, the about button on the nav bar, it takes me to:

http://localhost:4567/blog/2018/05/24/testingblogpost/about.html

… instead of …

http://localhost:4567/about.html

Why?

#2

Simplest way is to add / before the url in the href:

<nav>
  <ul id="nav-display">
     <li><a href="/index.html">Home</a></li>
     <li><a href="/about.html">About</a></li>
     <li><a href="/allblog.html">Blog</a></li>
  </ul>
</nav>
1 Like
#3

And if you want to have a little more smart navigation (no links to the very page you are currently on), then take a look at this topic: Active Navigation .

1 Like
#4

Adding the / worked! Thanks. I’ll check out the other thread, too.