Basic web geek question
 

Hello guys, how to design a web page if you have a selection of menu either at the top, left or right side.
When the user click something on the menu, the page will be displayed right on the same page.
What I mean is like here in LQ, I click on "Linux General" then the Linux General discussion will get loaded. If I click on "Linux NewBie" then the Linux Newbie discussion will get loaded but it gets loaded without opening a new page but on the same page only.

Just need some ideas, or example if possible.

Thanks in advance for any help.

I just realize it after posting, will it be something like this: <a href="https://www.w3schools.com" target="_blank">Visit W3Schools</a>

Are there any other methods? simple one but works fine.

^ that would open it on a new page.
simply leaving the target=... out should be enough.
but maybe there's a setting to explicitly keep it on the same page.
i recommend searching w3schools.com for this.

Hi Ondoho, true it will open a new page. I think it should be _self.

Thanks for the heads up, but I don't know whether there are other ways to do this.

In the old days, you would use frames to accomplish this.

Today I would use CSS to do this. Frames are awkward, and the usage is being depreciated in most tools. When things go wrong a frame degrade is VERY ugly.

CSS is faster, more general, degrades (when properly designed) with functional elegance, and is fun.

I second the motion on W3Schools.com. I taught myself to write valid XHTML and CSS there almost 20 years ago and it has served me well.

I am a master of XHTML 1.0 Frameset and can arrange frames in any configuration from top, bottom and sides, or make them going round and round in a spiral to a 1 inch square in the middle of the page. Which serves no purpose other than an exercise.

In fact, I've been working on my site and played with Frameset a couple days ago. This has a head, content and a foot frame with a head.html, foot.html. content.html and index.html page. Only the index page is Frameset, the rest are XHTML Transitional. CSS 3 no longer recognizes the code for the white frame borders.

I did say playing...

Erm. I am sorry.

But would not omitting the target-attribute quite simply have the desired effect? If the user has configured the browser in a way that imposes a behavior, do rather not try to overrule that. But that is just Html2 to xhtml knowledge. I use to ignore anything which is not a “standard” in the old sense of the word.

Of course, but I was promoting W3Schools. :)

If your files are all in the same directory on the same server all you need is a basic hyperlink:

None of those frameset pages uses the target attribute, yet all 4 come together for 1 page by simple links from the index page.

If I wanted side frames I would use the "cols" attribute, for columns, instead of "rows" for bars, or both.

The CSS for the frame borders is no longer officially supported but here is the code, which was valid at the time I wrote it:

Now if someone were to click on a link to an outside site, normally that site would appear in my middle content frame. To prevent them from being trapped in my frame, I would use:

Then the page opens in a new window.

Otherwise target isn't needed for content to appear in that frame, either to do what you asked. Have a page open in the same window.

i'm beginning to understand op's requirement, i think.
it is the same thing i stumbled over when i tried to build a web page for the very first time:
the menu, top- and sidebar are always the same, only the content changes.
you don't want to have the exact same code on every page.
yes, it can be done with frames, but for me the ultimate answer was server side scripting, i.e. PHP.
build each page whenever it is requested.
CSS cannot achieve this.

ondoho, I am not recommending OP use frames. I don't even use them, and although my example scales down proportionally with the screen size I have no idea how it would render in a smartphone.

And you are correct, CSS cannot do the job. That's the work of XHTML.

Trust me. If OP follows my examples he can achieve the desired results. I have websites links to the Wayback Machine going back to 2004 I provide in the FreeBSD forums in the same thread where my work in XHTML and CSS is also displayed as a fix for 2 freebsd.org website Bugzilla bugs.

I usually accomplish management of menus by simply repeating the menu code on each page of the site. That can be onerous if there are many pages, of course.

I've also used CSS to create drop-down menus, but the code, or at least the link to the code, still has to be repeated on each page.

Using PHP or (as I do) perl to create dynamic content works, as ondoho pointed out, but the end result is a rendered page with the menu code repeated, right?

Frames have their uses: One of my favorite uses is to hide the URL of a dynamic page ( somedomain.com/somescript.pl ) so that the visitor doesn't see the actual script name. This is useful when they are completing a survey and we don't want them to bookmark the script itself, but I wouldn't recommend frames normally, for reasons that have already been expressed here.

In the past, I've used tables to control page layout, sometimes with only two columns: The menu column on the left, and the main content column on the right. Today a newbie should learn to do things like that with CSS to be current.

To address the OP's original question: Not specifying a target will cause the new content to be loaded into, and replace, the page being viewed.
A snippet from w3schools:
I've used the named frame to change what goes into a pop-up window. The first use of a framename will work like _blank

I learned back in the day, and old habits die hard, so I still use tables. But tables are what I use to get my site to scale down in proportion as the screen size shrinks, as do the CSS buttons. That also shows how to get your images to do the same with percentage.

Wow, thank you so much guys. That's a lot of things to digest.

W3schools is really awesome, i never knew about top before.

https://www.w3schools.com/tags/tryit...html_link_test

I think this is what I need.


I'll be using PHP, an HTML template with bootstrap. Which I just found on the web.