The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Navigation Help, Navigation across many pages
r8th
post Oct 3 2020, 09:49 AM
Post #1





Group: Members
Posts: 2
Joined: 3-October 20
Member No.: 27,574



hi,

I have a website with a growing number of pages.

Is there a way to avoid having to individually update the navigation code on every page each time a new page is added to the site? I'm thinking of some kind of nav template, that is updated once, and which then deploys changes across all pages.

I am quite new to html coding. I am building a website "by hand" and I want to keep simple, using only HTML5 and CSS if possible.

Any suggestions are GREATLY appreciated! This updating of every page is becoming tiresome and I'm certain there must be a more efficient way!

Thanks

r
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Oct 3 2020, 10:21 AM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Yes, but not with HTML alone.

You can use SSI, Server Side Includes, if you are on an Apache server. It's very easy to use. Basically you keep the menu in a text file (just the menu markup, not a complete HTML page) and place a special tag where you want it to show up. It's a little like when you use Find & Replace with an editor, only the server does it before it sends the page to the browser. If you view source with your browser, the markup will look as before. Only HTML, the SSI tag will be replaced with the menu.

You can do the same thing with PHP which may be a smarter choice, should you at a later point want to use PHP for something else. You need to choose between SSI and PHP. SSI works well, but it only does this kind of stuff, basically it includes files and server variables. It isn't a programming language like PHP. You couldn't for instance create a forum with SSI.

This isn't hard to do, it doesn't involve any programming. But you must learn how to enable SSI or PHP. Once that's done it's easy sailing.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Oct 3 2020, 10:43 AM
Post #3


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



You might use Find & Replace on multiple files in a text editor, and then upload all the edited files to the server. This can easily go wrong if you're not careful with the Find patterns though.

Or you might let the server include an external file into the HTML file before it's sent to the browser (usually this is done with PHP these days, back in time SSI was also used).

With just HTML, you might use a nav menu on the home page only (with links back to the home page on all the content pages), this actually works very well and saves space on the content pages. Users can always open the content pages in new tabs/windows if they don't want to load the home page again and again.

Another HTML-only option is using frames. I do not recommend using framesets, but loading an external nav menu page in iframes might work. If you do the latter, let the links in the iframed page use target="parent" so they won't load the content pages inside the iframe. You may also want to prevent search engine robots from linking directly to the nav menu page with a "noindex, follow" directive.

It's also possible to put the nav menu on the home page, and load all content pages in an iframe on that same home page, however I advice against that since users can open the content pages in new tabs outside the home page iframe (back in time people used awful workarounds to prevent that). Search engines will also link directly to the content pages outside of the home page iframe.

This post has been edited by Christian J: Oct 3 2020, 06:15 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Oct 3 2020, 10:56 AM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Don't see how iframes are any better than frames. You'll still get orphaned pages through search engines, may it be content or nav pages, bookmarks will be screwed up and so on. I wouldn't go this way.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Oct 3 2020, 11:01 AM
Post #5


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Oct 3 2020, 05:56 PM) *

Don't see how iframes are any better than frames. You'll still get orphaned pages through search engines,

If you load the nav page in iframes, you can use a robots.txt directive to prevent search engines linking directly to it, just like I wrote.

QUOTE
bookmarks will be screwed up

Not when done this way. I'd still be wary of doing it myself though. cool.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Oct 3 2020, 11:27 AM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



QUOTE(Christian J @ Oct 3 2020, 06:01 PM) *

QUOTE(pandy @ Oct 3 2020, 05:56 PM) *

Don't see how iframes are any better than frames. You'll still get orphaned pages through search engines,

If you load the nav page in iframes, you can use a robots.txt directive to prevent search engines linking directly to it, just like I wrote.


robots.txt isn't always followed. And do you mean it should be used for content pages too?


QUOTE
QUOTE
bookmarks will be screwed up

Not when done this way. I'd still be wary of doing it myself though. cool.gif


How is that? How can you bookmark a specif page if they are loaded in an iframe? Well, I know how to bookmark it without the menu, but the average user don't.

QUOTE
I'd still be wary of doing it myself though. cool.gif


Then maybe everyone should be. tongue.gif

Don't listen to Christian (about this). This is an old and bad way to do it. Very 1995-ish. laugh.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Oct 3 2020, 04:53 PM
Post #7


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Oct 3 2020, 06:27 PM) *

robots.txt isn't always followed. And do you mean it should be used for content pages too?

No it's not necessary for the content pages.

QUOTE
How is that? How can you bookmark a specif page if they are loaded in an iframe?

The idea was that each content page loads the menu page in an iframe. The content pages are the parent pages, all of them embedding the global nav menu page. So you can bookmark the content pages just like on any ordinary website.

When you later load a bookmarked content page, it will in turn embed the menu page in its IFRAME element.

QUOTE
QUOTE
I'd still be wary of doing it myself though. cool.gif


Then maybe everyone should be. tongue.gif

Nah there's nothing too bad about it that I can think of, except maybe making the framed page fit on the parent page without causing unnecessary scrollbars in some viewport sizes.

QUOTE
This is an old and bad way to do it. Very 1995-ish. laugh.gif

Not at all, back in time people used FRAMESET (which is indeed old and bad). The IFRAME element idea I'm suggesting was almost never used since Netscape 4 didn't support it.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Oct 3 2020, 05:03 PM
Post #8


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



I took it you also suggested...

QUOTE
It's also possible to put the nav menu on the home page, and load all content pages in an iframe on that same home page,


... but maybe you adviced against it. unsure.gif


I still don't see why anyone would want to do it that way when there are better options available. Unless you are on a free host that allows absolutely nothing more than HTML, CSS and JS. But I think such hosts are pretty scarce today. Even back in the day SSI was often avaialable, even if not always announced. Yes, I've been down that route. tongue.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Oct 3 2020, 06:14 PM
Post #9


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Oct 4 2020, 12:03 AM) *

I took it you also suggested...

QUOTE
It's also possible to put the nav menu on the home page, and load all content pages in an iframe on that same home page,


... but maybe you adviced against it. unsure.gif

Yes I do advice against that. I'll edit my post for clarity.

QUOTE
I still don't see why anyone would want to do it that way when there are better options available.

I just mentioned it since the OP only wanted to use HTML and CSS.

An additional advantage over server-side includes is that you don't need to rely on a server. Sometimes web hosts break your PHP scripts and/or server configurations, which then also ruins your PHP includes.



User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
r8th
post Oct 4 2020, 09:46 AM
Post #10





Group: Members
Posts: 2
Joined: 3-October 20
Member No.: 27,574



Thanks alot for the ideas!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 09:13 AM