Search code examples
phphtmlcssnavigationphp-include

PHP Header Include (nav bar) not showing up


CLARIFICATION: Being that I've never used PHP, it was unclear how to format the PHP file, so that when you include it in the index, then header(nav bar) would show up. No posts explained why I had to change my index.html to index.php to make it work. And again, being that I haven't used PHP, I was under the impression that changing the extension meant that I would have to convert my HTML code to PHP commands. I was trying to avoid having to change my whole code around. That's where the confusion was.

I was going to delete the question once I got it figured out. Then again, I'm sure I'm not the only person that may run into this while making their first website.

SOLUTION. Save only the nav code in html language with a PHP extension (header.php). Change index/home file from .html to a .php extension (don't have to modify any code. but accepts the include prompt). Then, include the header.php in your index.php. Same goes for your footer. Thanks for the help everyone.

*ORIGINAL POST: Through another post, I was told it would be easier to use a nav/footer on multiple pages by using PHP.

I created a file and tried including it and it is not displaying. I'm not sure what I am doing wrong.

There is some CSS in my nav bar as well, do I need to import the css file in the PHP file? or does the index.html file automatically attach to the included (php) file.

PHP Code:

<?php
echo '<nav>
    <div>
        <a href="/">
            <div id="logo"><img src="/Images/7serviceLOGOblue2.png" alt="Home"/></div>
            <div id="headtag"><img src="/Images/title.png" alt="Home"/></div>
            <div id="tagline"><img src="/Images/tag_line.png" alt="Home"/></div>
        </a>
    </div>
    <div> 
        <a href="/" class="here">Home</a>
        <a href="/about.html" >About</a>      
        <a href="/services.html" >Services</a>          
        <a href="/pricing.html" >Pricing</a>    
        <a href="/contact.html" >Contact Us</a>
        <input id="srchbar" type="search" placeholder="Search">
    </div>
</nav>';
?>

HTML Code (include):

<body>
<?php include '/header.php';?>
    ....other code....
</body>

If there's a problem with the PHP file, if I'm missing something, can someone show an explain please?


Solution

  • no need to add <?php ?> code in the header file just keep it as it is :

    1. Create a new file named header.php and add this code to it

      <nav>
      <div>
          <a href="/">
              <div id="logo"><img src="/Images/7serviceLOGOblue2.png" alt="Home"/></div>
              <div id="headtag"><img src="/Images/title.png" alt="Home"/></div>
              <div id="tagline"><img src="/Images/tag_line.png" alt="Home"/></div>
          </a>
      </div>
      <div> 
          <a href="/" class="here">Home</a>
          <a href="/about.html" >About</a>      
          <a href="/services.html" >Services</a>          
          <a href="/pricing.html" >Pricing</a>    
          <a href="/contact.html" >Contact Us</a>
          <input id="srchbar" type="search" placeholder="Search">
      </div>
      

    2. Include header.php anywhere you want