Navbar repetition, How to avoid writing my Navbar in each page |
Navbar repetition, How to avoid writing my Navbar in each page |
GaryE |
Jul 30 2017, 03:20 PM
Post
#1
|
Group: Members Posts: 6 Joined: 31-August 16 Member No.: 24,769 |
My website is http://bostontechnicalwriter.x10host.com/
My navbar section is exactly the same in my index page and each of my subject pages (Blogging: Electronic Products Magazine, IEEE Globalspec, etc, etc.) Right now, if I want to add or delete one of the subject pages, I have to modify the navbar not only on the index page, but in each of the dozen or so subject pages. This is a cumbersome, error prone task. Is there any way to write only one navbar, and have it apply to the index page and all the subject pages? BTW: Are "Navbar" and "subject Pages" the correct words? |
CharlesEF |
Jul 30 2017, 05:21 PM
Post
#2
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
You can define your menu once, then 'include' it using a server side language. What languages does your host support? (PHP, ASP or ?)
|
GaryE |
Jul 30 2017, 06:28 PM
Post
#3
|
Group: Members Posts: 6 Joined: 31-August 16 Member No.: 24,769 |
Hi Charles,
I use x10hosting, and at: https://x10hosting.com/hosting-features it says: Complete Control Want to write your own PHP scripts or install a third-party package? Sure! So I guess that means I have free access to pHp - Gary |
CharlesEF |
Jul 30 2017, 08:53 PM
Post
#4
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
Ok, so you have PHP to use. The first thing to know is that any page that contains PHP code needs to have a '.php' extension and must be served up thru a web server. In theory, you could change the '.php' requirement by changing your web server configuration. I stay out of that part.
Next, create your menu page (save it as 'menu.html', for example). Only include the menu parts, do not include <head> or <body> or any other parts. Now, on each page that will have the menu you need to add something like this: CODE <nav id="menu"> These are the pages that will need the '.php' extension. The <nav> is valid for HTML5 pages. If you are using anything else then use a <div> instead.<?php include("{$_SERVER['DOCUMENT_ROOT']}/path/to/menu.html");?> </nav> That is the basics of what you need to do. If you need to work on the position or something else then you need to use CSS. |
GaryE |
Jul 31 2017, 03:53 PM
Post
#5
|
Group: Members Posts: 6 Joined: 31-August 16 Member No.: 24,769 |
Hi Charles,
I'll give this a try. Thanks! Gary |
GaryE |
Aug 13 2017, 11:30 PM
Post
#6
|
Group: Members Posts: 6 Joined: 31-August 16 Member No.: 24,769 |
Hi Charles,
Your idea worked. I tried it out on a new free host, the modified website is: https://exper17.000webhostapp.com/ I Inserted this command into each page: <!-- Left Column, Navbar division --> <?phpinclude('navbar.php'); <!-- End of Left Column, Navbar division --> as for navbar.php itself (after I took out most of the menu choices to save space in this note, they are all about the same): <!-- Left Column, Navbar division --> <div id="left_col"> <table style= "width: 100%" cellspacing="8" cellpadding="2"> <tr style="background-color: #ffcc33;"> <td style="width: 100%"><a href="index.php">Home</a></td> </tr> <tr style="background-color: #ffcc33;"> <td style="width: 100%"><a href="softwarewriter.php">Software Articles</a></td> </tr> <tr style="background-color: #ffcc33;"> <td style="width: 100%"><a href="scopejunction.php">Scope Junction</a></td> </tr> <tr style="background-color: #ffcc33;"> <td style="width: 100%"><a href="gmvolt.php">GM Volt</a></td> </tr> </table> </div><!-- End of Left Column, Navbar division --> Now, I only have to modify "navbar" in one place only when I want to change my choices. So, thanks again for your help! Regards, Gary |
CharlesEF |
Aug 14 2017, 12:49 AM
Post
#7
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
Great, glad it worked out for you. One thing I did see that needs fixing, maybe if was just a copy and paste error. This line of code:
CODE <?phpinclude('navbar.php'); Should be: CODE <?php include('navbar.php');?> In PHP you need '<?php' to start PHP code and '?>' to end PHP code.Also you could expand this method to include your header or footer sections (if you use either). |
Lo-Fi Version | Time is now: 28th March 2024 - 09:59 AM |