Nav bar links to internal html pages not working

admin

Administrator
Staff member
I built a site for one of my clients with this template - <a href="http://www.templatemo.com/tm-395-urbanic" rel="nofollow noreferrer">http://www.templatemo.com/tm-395-urbanic</a>

The site is <a href="http://www.southholstonriverlodge.com" rel="nofollow noreferrer">http://www.southholstonriverlodge.com</a>

They recently wanted me to change up the nav bar. It previously was only linked to anchors within the template which worked fine. I tried changing it to link to other pages ex.

Code:
&lt;li class="active"&gt;&lt;a href="index.html" title="Home"&gt;HOME&lt;/a&gt;&lt;/li&gt;

and they are no longer working.
The nav links that go to anchors still work and the links that go to external pages work. And I can right click and open the pages in new tabs, but directly clicking does nothing. I've tried so much to fix this and just can't get anywhere. Ideas? I'm at a point of not even knowing where to look. I'm fairly new with bootstrap and I was working on implementing a dropdown, thinking that was the issue, removed it. I'll include some code snippets but I'm not even sure where to begin.

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override">
Code:
.nav &gt; li &gt; a {
    padding: 10px 10px;
}

.nav &gt; li &gt; a:hover,
.nav &gt; li &gt; a:focus {
    background-color: #648c33;
    color:#fff;
}

.navbar-default .navbar-nav &gt; li &gt; a:hover,
.navbar-default .navbar-nav &gt; li &gt; a:focus {
    background-color: #648c33;
    color:#fff;
}


.nav &gt; li &gt; a {
    color: #929292;
}
.navbar-default {
    background-color:#fff;
    border:none;
}

.navbar-default .navbar-nav &gt; .active &gt; a,
.navbar-default .navbar-nav &gt; .active &gt; a:hover,
.navbar-default .navbar-nav &gt; .active &gt; a:focus {
    background-color: #005200;
    color: #fff;
}

.navbar {
    margin-bottom: 0px;
}
<pre class="snippet-code-html lang-html prettyprint-override">
Code:
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;&lt;!-- InstanceBegin template="/Templates/SHRL Template.dwt" codeOutsideHTMLIsLocked="false" --&gt;&lt;head&gt;
&lt;!-- InstanceBeginEditable name="doctitle" --&gt;
&lt;title&gt;South Holston River Lodge | World Class Fishing | Luxury Lodging&lt;/title&gt;
&lt;!-- InstanceEndEditable --&gt;
&lt;meta name="keywords" content="south holston river lodge, lodge, soho, tennessee fly fishing, tennessee lodge, south holston, fly fishing, float, wade, guide, all inclusive, lodging, vacation, trips, cabins, home, bristol, tennessee, tn, destination, eastern tennessee" /&gt;
&lt;meta name="description" content="South Holston River Lodge is located in Eastern Tennessee. It is a destination fly fishing lodge with excellent year round fishing." /&gt;
&lt;!-- Global site tag (gtag.js) - Google Analytics --&gt;
&lt;script async src="https://www.googletagmanager.com/gtag/js?id=UA-51645845-1"&gt;&lt;/script&gt;
&lt;script&gt;
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-51645845-1');
&lt;/script&gt;
&lt;!--

Urbanic Template

http://www.templatemo.com/tm-395-urbanic

--&gt;
&lt;meta charset="UTF-8"&gt;
&lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
&lt;!--&lt;link rel="shortcut icon" href="PUT YOUR FAVICON HERE"&gt;--&gt;
&lt;link rel="shortcut icon" href="images/favicon.ico?v1.ico"&gt;
&lt;!-- Google Web Font Embed --&gt;
&lt;link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic' rel='stylesheet' type='text/css"&gt;
&lt;!-- Bootstrap core CSS --&gt;
&lt;link href="css/bootstrap.css" rel="stylesheet" type="text/css"&gt;
&lt;!-- Custom styles for this template --&gt;
&lt;link href="js/colorbox/colorbox.css"  rel="stylesheet" type='text/css'&gt;
&lt;link href="css/templatemo_style.css"  rel="stylesheet" type='text/css'&gt;
&lt;!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --&gt;
&lt;!--[if lt IE 9]&gt;
          &lt;script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"&gt;&lt;/script&gt;
          &lt;script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"&gt;&lt;/script&gt;
        &lt;![endif]--&gt;
&lt;!-- InstanceBeginEditable name="head" --&gt;
&lt;!-- InstanceEndEditable --&gt;
&lt;!-- InstanceParam name="OptionalRegion1" type="boolean" value="true" --&gt;
&lt;/head&gt;
    
    &lt;body&gt;

        &lt;div class="templatemo-top-bar" id="templatemo-top"&gt;
            &lt;div class="container"&gt;
                &lt;subheader&gt;
                    &lt;div id="phone" class="pull-left"&gt;
                            &lt;img src="images/phone.png" alt="phone"&gt;
                             877.767.7875
                    &lt;/div&gt;
     &lt;div id="email" class="pull-right"&gt;
                            &lt;img src="images/email.png" alt="email" title="Email Icon"&gt; [email protected]
                    &lt;/div&gt;
                &lt;/subheader&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="templatemo-top-menu"&gt;
            &lt;div class="container"&gt;
                &lt;!-- Static navbar --&gt;
                &lt;div class="navbar navbar-default" role="navigation"&gt;
                    &lt;div class="container"&gt;
                        &lt;div class="navbar-header"&gt;
                                &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"&gt;
                                &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                                &lt;span class="icon-bar"&gt;&lt;/span&gt;
                                &lt;span class="icon-bar"&gt;&lt;/span&gt;
                                &lt;span class="icon-bar"&gt;&lt;/span&gt;
                                &lt;/button&gt;
                                &lt;a href="index.html" class="navbar-brand"&gt;&lt;img src="images/sohorl.png" alt="SHRL Logo" width="200" title="South Holston River Lodge" /&gt;&lt;/a&gt;
                        &lt;/div&gt;
      
                        &lt;div class="navbar-collapse collapse" id="templatemo-nav-bar"&gt;
                            &lt;ul class="nav navbar-nav navbar-right" style="margin-top: 40px;"&gt;
                              &lt;li class="active"&gt;&lt;a href="index.html" title="Home"&gt;HOME&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="about.html"&gt;ABOUT US&lt;/a&gt;&lt;/li&gt;
                                &lt;li&gt;&lt;a href="#templatemo-blog" title="Services"&gt;SERVICES&lt;/a&gt;&lt;/li&gt;
                                &lt;li&gt;&lt;a rel="nofollow" href="https://www.flickr.com/photos/[email protected]/albums" class="external-link" title="Photo Gallery" target="_blank"&gt;GALLERY&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a rel="nofollow" href="https://southholstonriverlodge.wordpress.com/" class="external-link" title="Fishing Report" target="_blank"&gt;FISHING REPORT&lt;/a&gt;&lt;/li&gt;
                                &lt;li&gt;&lt;a href="#templatemo-contact" title="Contact"&gt;CONTACT&lt;/a&gt;&lt;/li&gt;
                            &lt;/ul&gt;
                        &lt;/div&gt;
      
                     
      &lt;!--/.nav-collapse --&gt;
                    &lt;/div&gt;&lt;!--/.container-fluid --&gt;
                &lt;/div&gt;&lt;!--/.navbar --&gt;
            &lt;/div&gt; &lt;!-- /container --&gt;
        &lt;/div&gt;
</div>
</div>