Nav Bar -why the duplication

User 598317 Photo


Registered User
5 posts

In all the examples I have seen, the formatting of the various parts of the website all go in one or more css files - no problem with that.

The part I do not understand - why does it appear that the nav bar in the index.html home file, with the various options and sub-menus has to be repeated in all the other individual pages. If we grow to 100+ pages, we cant be copying the menu hierarchy 100 times - so far, not seen this coded in a css file, which would make more sense as it would only need changing once (assuming all pages have the same menu/nav bar requirement).

So as a simple example:
<ul>
<li><a href="default.asp">Home</a></li>
<li><a href="news.asp">News</a></li>
<li><a href="contact.asp">Contact</a></li>
<li><a href="about.asp">About</a></li>
</ul>

Why is this not done as a css itself so avoiding the need to edit/amend this in each of the four separate pages?


User 122279 Photo


Senior Advisor
14,197 posts

The code quoted in your example is not CSS code, it's HTML tags. Surely, in the CSS (main.css most likely) there will be CSS telling something about what the <ul> is supposed to look like, for example, vertical or horizontal, how wide the <li> is supposed to be, the colour and font of the text, etc etc., and that CSS appears only once (unless you want it to appear differently on each page, that is).

The actual HTML tags have to appear wherever you want the navigation to appear. But you could make it easier for yourself by creating one menu fully finished, and then make it into a symbol. After that, you insert the symbol on each page. With that done, you can update just one instance of it, and they will all be updated.

I see that you are using the .asp extension. I'm not familiar with ASP myself, but if it is similar to PHP, I guess it should work. In PHP you have the 'PHP include'. I don't know if there is something like that in ASP.
Ha en riktig god dag!
Inger, Norway
This site was made before we were able to create components through the app:
Component sharing for RFF, RBB, RSD and SD: https://eikweb.com/sharing/
My work in progress right now:
Components for the same as above + HTML Editor: https://mock-up.coffeecup.com


User 2699991 Photo


Registered User
4,383 posts
Online Now

so far, not seen this coded in a CSS file, which would make more sense as it would only need changing once (assuming all pages have the same menu/nav bar requirement).


CSS is for styling elements (with given class names as in all the same type of element with the same class name get the same styling (CSS code) applied even across all the different pages, no matter how many pages there are, elements with Unique ID's get their own CSS code (which over-rides any class styling that may be applied to it's class name) (elements with same ID but on a different page get the same CSS styling )
HTML is the code for what one sees on a page.

I must be missing something here
Site Designer takes care of all the code you need (CSS, JS, HTML) all one has to do is drag & drop elements into the canvas, then "style" as required Site Designer does everything else. Export it or publish it,,, BOOM there it is done for you looking just as you did it on the project canvas. I don't understand why you are worrying about duplicating however many CSS bits there are,

And as Inger says applying elements as "Symbols" allows you to put the same element with exactly the same styling and functions as the others, you can also copy and paste one element to another page or even the same page in a different location and Site Designer even takes care of all the coding for that too,
Mastering The Understanding With Hands-On Learning
NEW TO
"COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS

I can make "INDIVIDUAL BESPOKE" step-by-step video tutorials
for you to watch at your leisure as many times as you need

I have also started updating the ready made step by step tutorials, Ready Soon

my secure email details form
https://rsd-tutorialscom.coffeecup.com/ … l-details/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.