I'm not sure if I am using the proper term when I refer to "dynamically. *
I want to have a simple, one level, menu displayed on all 80 pages of my site. The menu items will change periodically - new items added, some removed, etc... What is the best way to create this menu so I don't have to update all 80 pages? FYI: I'm not too knowledgeable in all the scripting languages. Thank you.**
The simplest way is to use PHP.
Name all your files so they end in php instead of html, and make a file called menu.php.
Copy your menu into menu.php, then no your other pages where you want the menu, type:
<? include("menu.php"); ?>
and the menu will appear like magic!
I would also suggest SSI, but they are often disabled on shared hosting in my experience.
Create a master page if your working in any one of the "major" web frameworks. You put a lonely HTML tag up there so I'm not sure if this NEEDS to be purely HTML and nothing else.
Related
I have a web site of more than 20 pages, all using the same dropdown menu. Currently, each page contains redundant HTML code for the menu, so if I want to change one thing in a menu, I have to change it for all the pages. I am using plain html/css and some javascript for my site. Is there a way to have my dropdown menu all in one file and include the reference to that file for all 20 pages?
I tried using the <embed> element to include the menu, but it did not work out for me since I cannot adequately align it as it leaves a large empty area right below it to allow for dropdown options. Not sure what is the best way to handle that
As suggested by Quetin Veron in the comment, PHP include statements are the best way to deal with it.
However, in case you're not interested in writing backend code, you can do that using JavaScript by parsing a json or an ini file/text in your script and converting it into the required links on the menu.
[Do note that you'll still have to use JavaScript for that]
If you'd not even prefer to use JS (Not recommended), you can use an iframe as the navigation menu
When you do that, add <base target="_parent"> in the head section of your iframe.
And then, in all other pages, add <iframe src="menu.html"></iframe> and replace menu.html with the path to the menu.
I hope this helps. However, please note that this just is a workaround if you wish to use frontend technologies only.
Otherwise use <?php include "menu.php";?> for PHP or for Node with EJS, use <%include "menu.ejs";%>
So I have a custom css drop down menu and it works fine except I realized that writing this menu out across all the html pages on this website will become tedious if I should update with a new section to the website and need to add on a new tier to the menu, I would end up with a billion htmls to update one simple line of code.
I was wondering, is there a way to write this menu once (on the main page) and call on it on all my other htmls?
I experimented a bit with Objects, Iframe, to call on the dropdown menu written on a separate html file and such but when the menu expands you get scroll bars and both methods seem to embed into the page. I want the contents of the page to be behind the drop down menu just as it standardly looks right now.
The following is my unedited page:
http://www.blue-cicada.net/trivial/index.html
And this is my test:
http://www.blue-cicada.net/trivial/test/
Not looking so good there, my top image is obscured, the submenus wont fly out completely etc, how to fix?
Im really new to this stuff so any help is appreciated.
You want to do something server side really, back in the day this would have been http://en.wikipedia.org/wiki/Server_Side_Includes, depending on who is hosting your site it may even still be, though that's fairly unlikely. Chances are you have some provision from your webhost to do something server side, ie PHP Includes say.
If not you could look at doing JavaScript client side includes but its crufty,
If you're really just hand editing you html files and have no access to any server side technologies well, you can always just have a text editor that can search and replace across multiple files
UPDATE
Given your comments I would just download something like Notepad++ and read the Bulk Find and Replace here 'http://www.dedoimedo.com/computers/notepadpp-tricks.html'. Basically you can have a test page you use for figuring out 'what you want to do' and then use the global find and replace to update all of the 'current' versions of the header/menu/whatever to you new version.
Backup all you files first!
Write it in a page called A.html.
On every page where you want to put it, use an <iframe src="A.html">
Make sure you remove the borders of the <iframe>, and also the scrollbars and make it look natural
I have to create Joomla website. I am PHP programmer, but new to Joomla.
I have spent a lot, reading tutorials and other staff.
The website is very simple, it is visit card for restaurant.
I have installed Joomla 2.5. Spending two days I have managed to do the following:
- create menu
- create multi language site (2 languages) with language swicher
- create simple static pages (articles)
- create one page as contact
- create simple template just for my website
However, I cannot do some things and I have not found any answers in tutorials or google.
If you open this file http://img1.uploadscreenshot.com/images/orig/1/2621034793-orig.jpg you can see images with three different pages on the site:
1) Article with three images on the right.
Basically, I do not know what is the best practice to create article with some custom HTML in it (in this case these are images). For example, i can create table with two columns - one for text, another for images. Without Joomla I would create two divs, but how this can be done here??? Also with custom html I need to do the same for each language - I need to add images for each language, I do not like this. I really have not found any solutions for this. Do you have some suggestions?
2) Article with three buttons on the right side. This is article on landing page.
This is probably the same question - how to create article with some custom HTML in it (in this case these are three buttons - links to pages inside the website)? Again I can create table with text and buttons, but this should be done for each language. Is it a good practice? Do you have some other suggestions to create article with three buttons on the right side? Maybe I can create some custom module, but this sounds strange.
3) Contact page with google map.
I have create contact page with contact details. This is another question, I would ask other time.
Hello Renathy and welcome to Joomla!
1) You can of course insert divs in the editor and style them with floats; but as you mention this is pretty bad for translation, and allows the user to easily break the layout.
You have the following options:
1.a)
Joomla 2.5+ supports an article image and thumbnail that you can specify in the Images and Links group for each article. Quite some work to extend to 3 images, you would need to write a plugin (or do a nasty core hack) and override the view; also it's not well documented. There is a discussion here about it: Add additional images to articles in Joomla 2.5
1.b)
Add the extra images as above with the plugin. Then use a module for displaying the images instead of the view override.
1.c)
Use a custom image management solution to link images to an article, then a plugin to display them. Easier, but still a lot of work. I have done this on one site and worked fine, although I would change a lot of code now. As far as I know there are no extensions available that will do this.
All three solutions allow you to use proper floating of the contents using divs floats responsive as appropriate, and will isolate the layout of the content from the images, thus obtaining a solid environment for the content editors, and easy translation (although, if you go with 1.a) or 1.b), I strongly advise you to use a proper translation suite such as Falang or JoomFish (Falang is a different port of Joomfish from the old 1.5 version)
2)
You will address this as above, with a module.
Create in your template a main
<div class="content-box">
<div class="content-main"> here you will place your component's output.</div>
<div class="content-sidebar"> here you will output a new module position, name it "article-sidebar"</div>
Then style it like this:
div.content-box {
/* here you need a clearfix choose one here: https://stackoverflow.com/questions/211383/which-method-of-clearfix-is-best/211467#211467 */
}
div.content-box div.content-main {
width:70%;display:inline-block;float:left;
}
div.content-box div.content-sidebar {
width:29.99%;float:right;
}
div.content-wide div.content-sidebar {
display:none;
}
But you may not want this on all pages, then you can deal with it programmatically when generating the template.
The idea is: in your template output, where you are writing
<div class="content-box">
instead add a class conditionally when your article-sidebar contains something:
<div class="content-<?php
if ($this->countModules("article-sidebar")==0)
echo "wide";
else
echo "box";
?>">
This will dinamically change the class of the div, so you only serve 1 css.
At this point, create a module and choose to display it "Only on selected pages" .
3)
When you want to change a view, never change the file in place. Instead copy all the view's php to a folder under your template's folder / html/com_contact/contact. Even if you're changing a different layout, you will still need to copy there the default.php.
Then change it inserting the google maps.
A final consideration. You should refrain from editing core files. Joomla sometimes issues security updates, and applying them will be painful. Good luck with your site.
I have a web site that gets a new page every couple weeks, and that means I need to update the menu to have the new page in every single one. I'm wondering if there is a way to have an external text or .htm file that I can basically insert into the web page. That way I can put the menu in the external file and call it wherever I want it. So I only have to edit one thing when I get a new page.
Thanks in advance.
Edit: This is a drop-down menu with ul and li tags with an external style sheet for them. So this needs to work for that too. Thanks
Have a single HTML page like so:
<html>
<head></head>
<body>
HTML OF LINKS HERE
</body>
</html>
Then save it as my_links.html and into the page you want to insert it... do the following. Copy and paste the whole page and it as FILENAME.PHP and then use this code:
<?php include("my_links.html"); ?>
Congratulations, you have just used PHP! Learn more about the including pages here.
This is very easy and common to do on sites that use a server-side language behind them (PHP, ASP.NET, etc.)
If you don't want to use a server side language, than an <iframe> is your only option.
If you want to use HTML, and only html (no server side programming or javascript), you can use Server Side Includes embedded into your html files. Your web server may need to be configured to accept them.
If you are using server side include and you had navigation in a separated file, yes you can just edit things separate.
You can also do this using jQuery.
$('#elementid').load('page.html');
http://api.jquery.com/load/
But this will not be SEO friendly.
Also if someone has scripts turned off in their browser, then this will not work.
So I have a website and I'm using a basic menu located at the top right corner of the screen. It's links are as follows:
| Home | Blog | Results | Pictures | Our Location |
Form time to time I need to add a new link to the menu or change where one of the links points to. This means that on every page that the menu exist I must manually change the link. Surely there is some way to have a master menu that is just put on every page.
Or am I dreaming?
Put the menu in a separate file and include it on the server side, either using a full-blown scripting language like PHP (one line) or using SSI.
There are various ways to do this. It depends what you have access to on the server. Possibly the simplest mechanism is server-side includes. You would just have a file that contains the menu and include it on every page.
You can also do this with every programming language in more or less elegant ways.
EDIT: The SSI is quite simple. You can just make a /header.html file, then do:
<!--#include virtual="/header.html" -->
in the appropriate place.
use the PHP include on all your pages
<?php include 'includes/menu.php'; ?>
and have a separate menu.php within a folder named 'includes'. you'll need to save all oyur pages as .php
you can make your footer as an include too
I think this is the easiest way of doing it without a server side language. Use a javascript library like W3Data. All you need to do is add the w3-include-html attribute to your div. Done!
If your menu is in a file called menu.html you'd do something like this.
<div w3-include-html="menu.html"></div>
Have a server side program determine what menus and locations of the links need to be there.
Then use ajax to periodically poll the server side script to get the contents of the menu at the current time.
It'd be easy to have it send an xml data back like:
<menu>
<link name="Home" href="destinationhome.html"/>
...
<link name="Pictures" href="....html"/>
</menu>
Then build your links from that data.
You can generate pages from templates before uploading them: See Template Toolkit.