|
HTML - Updating Content On Multiple Pages At Once
Hello everyone.
I'm working on a website and I'm not quite sure how to do something. I'm hoping someone here might be able to point me in the right direction. The site will have content on each product page such as special deals, recent news or announcements. Each product page will also have their contact information. Now what I need to figure out is this. Since the "recent news" , "Special deals" and "Announcements" will be on every product page. I need to find a way to those things on every page at once. Just to show an example. Here's one of the practice pages: http://sbultimate.com/newsite/toeswitch.html If you scroll down you'll see the sample of Announcements, specials and news. That's the part I'm talking about. If any of you can help me learn how to do this I'd greatly appreciate it. Thanks. Ron Similar TutorialsIntroduction: Seeing as this question is brought up very often, I hope this short guide will be a destination for users seeking information about the topic. Although this is a server-side issue, those who are not aware of this fact generally seek help in HTML/XHTML, so this is where the topic will remain Note: Read the answers to Frequently Asked Questions in the next post! Hasn't this been done before? Absolutely; this is meant as a straightforward stickied version that brings a few things together and references previous threads where you can find further details. If your question is somewhere in the realm of one of these, you're in the right place: How do large websites manage their content? How do I make the same content appear in multiple pages without copy/pasting? How do I automatically update parts of different pages, without editing every file? How do I avoid duplicating code in multiple files? Is there an alternative to IFrames? The answer is using PHP Includes, SSI (Server Side Includes), or ASP Includes. Each will be discussed below. Basic Concept: Let's assume we have a basic HTML page with a few links that represent a navigation menu (we're using HTML5 markup for simplicity): Code: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>Main Page</title> </head> <body> <div> <ul> <li><a href="home.html">Home Page</a></li> <li><a href="gallery.html">Gallery Page</a></li> <li><a href="about.html">About Page</a></li> <li><a href="contact.html">Contact Page</a></li> </ul> </div> </body> </html> This HTML page is now our basic template for subsequent pages that we create, which traditionally meant that we copy and paste our menu into each one. However, what if we end up creating 50 pages and then find out we have to add another link to the menu? Our only solution would be to add the link to each page. In order to avoid this, we separate our menu from the rest of the page like so: Code: <div> <ul> <li><a href="home.html">Home Page</a></li> <li><a href="gallery.html">Gallery Page</a></li> <li><a href="about.html">About Page</a></li> <li><a href="contact.html">Contact Page</a></li> </ul> </div> Save it in a file, and then place an include on every page where we want to display the menu: Code: <!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Main Page</title>
</head>
<body>
code for including menu would go here
</body>
</html>
This setup lets us update our menu file, and have the changes be immediately reflected everywhere we placed our include. The concept is most often used with things like menus, headers, and footers, but it can be used with anything and we'll now discuss how it's done in practice. Note: The attached zip contains working examples of all three methods. PHP Includes: General Requirements: Your web-hosting provider must support PHP, which most of them do. If your host does not support PHP, I would suggest switching hosts. If you do not have a hosting provider, and you're attempting this on your local computer, it must be set up as a local server and configured to run PHP. The easiest way to do this at once is by installing XAMPP. Required Filetypes: By default, servers will only parse PHP code inside files with the .php extension. Therefore, you must change the extension of any files you want to use includes in to .php (e.g. index.html becomes index.php). Although your main file must have a .php extension, you can include files with extensions such as .html, .txt, .inc, other .php files, and more. Syntax Here are two ways to include a file in PHP: PHP Code: <?php include('file_to_include.html');?> or: PHP Code: <?php include 'file_to_include.html';?> Note that you can also include full URLs if URL file-access is enabled in your server's configuration: PHP Code: <?php include("http://www.google.com/");?> Code Example: (some_page.php) Code: <!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>PHP Include</title>
</head>
<body>
<?php include("menu.html");?>
</body>
</html>
Server Side Includes (SSI): General Requirements: Your web-hosting provider must support Server Side Includes, which most of them do. If you do not have a hosting provider, and you're attempting this on your local computer, it must be set up as a local server and configured to support Server Side Includes. If you are using Apache, you can find information on enabling SSI here. If you are using IIS, you can install Server Side Includes inside Windows Features > World Wide Web Services > Application Development Features > Server Side Includes, although this path may differ depending on your version of Windows. Required Filetypes: By default, servers will only parse Server Side Includes inside files with the .shtml, .shtm or .stm extensions. Therefore, you must change any files you want to use includes in to have one of these extensions (e.g. index.html becomes index.shtml). Although your main file must have one of the above extensions, you can include files with extensions such as .ssi, .html, .txt, .inc, and more. Syntax Here are two ways to include a file using SSI: Code: <!--#include file="menu.ssi" --> Is used to specify a relative path, i.e. a path to your include in relation to where your main file is. The above assumes that your main file, and menu.ssi are in the same directory. Code: <!--#include virtual="includes/menu.ssi" --> Is used to specify a path relative to the web root. The above assumes that menu.ssi is located inside webroot/includes Code Example: (some_page.shtml) Code: <!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>SSI Include</title>
</head>
<body>
<!--#include file="menu.ssi" -->
</body>
</html>
ASP Includes: General Requirements: Your web-hosting provider must support ASP. If you do not have a hosting provider, and you're attempting this on your local computer, it must be set up as a local server and configured to support ASP. If you are using Apache, you can find information on enabling ASP here. If you are using IIS, you can install ASP inside Windows Features > World Wide Web Services > Application Development Features > ASP, although this path may differ depending on your version of Windows. Required Filetypes: By default, servers will only parse ASP code inside files with the .asp extension. Therefore, you must change the extension of any files you want to use includes in to .asp (e.g. index.html becomes index.asp). Although your main file must have a .asp extension, you can include files with extensions such as, .html, .txt, .inc, other .asp files, and more. Syntax Here are two ways to include a file using ASP (The syntax is exactly the same as SSI): Code: <!--#include file="menu.html" --> Is used to specify a relative path, i.e. a path to your include in relation to where your main file is. The above assumes that your main file, and menu.html are in the same directory. Code: <!--#include virtual="includes/menu.html" --> Is used to specify a path relative to the web root. The above assumes that menu.html is located inside web root directory/includes Code Example: (some_page.asp) Code: <!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ASP Include</title>
</head>
<body>
<!--#include file="menu.html" -->
</body>
</html>
NewB question I'm sure and this seems like such a basic thing. I searched but didn't find this. I'm building a new site with a sidebar on the right. The page layout is the same for all six pages. In the sidebar I want to have latest news and events; dynamic content basically. I'd like to have that content in a separate file so that I only have to edit it in one place and then have it show up on each of the six pages. I'm relearning HTML and learning css and javascript now, but I can't seem to find a good way to do this. I've looked at link and iframes and I'm wondering if a script would be the way to go. I wanted to ask you all - what's the best way to do this that's standards compliant (XHMTML) Thanks for your help. Cheers, Maggie Hello, I'm helping a friend redesign a film website. Is there a way of making an area of content (such as a set of links in a menu bar) updatable so that if it is updated it will change across all the specified pages on the site? I am vaguely aware of templates in Dreamweaver CS3 and I think this would provide the solution, but my friend uses Frontpage and will be editing and creating content in that. Is there a way of using CSS to update areas of content? I know how to use CSS to update values like fontcolour and background images, but not areas of actual HTML content. Thanks for any help you provide. Hello all, I have recently set up a website for my gaming servers. http://www.accurategameserver.110mb.com As you can see on my site, it has all the recent game changes etc. I find it really anoying and time consuming to have to keep flicking back and forth to change each section data and its usually only like one small change. Any way that I can change it so that it automatically updates to a set image/text on a seperate page? Last question is, how do ou make a registration form on your website without mysql and send out automatic emails. Thanks all in advance. Cheers Don't forget to register to my website for gaming goodness Hi my site www.brewrecords.net the text on the top right, I have to change it on all pages on the site when a new gig comes in. It is highly time consuming Is there a way i can update it once and that applies to the whole of the site? It's only text. cheers, tom Hi, I am semi new to HTML coding, I have created several basic websites but I am currently working on a bigger web project. I am hoping to create a website that will get traffic, and I am trying to make it as legit as possible, but of course, I do not know how to do certain things, and help would definitely be appreciated So first of all, the website will be kind of like a news page, so I might very well be updating the main page several times a week with new articles, and as I update, I want the older updates to go to page 2, and articles in page 2 to go to page 3 and on...So it is like a Stack, but I just do not know how to express or code this in HTML or what have you. The second is I wish for people to be able to comment on each article. Now I am not sure if I want them to be signed up users or anonymous, but at the least some kind of system so that people can comment on the articles and talk to each other. Also a a side question, if and only if, the site began to get ads or something, where and how would they be implemented? I have extra spaces at the left and right sides of the website, so I am thinking they could just be implemented there? Sorry to all if these questions sound obvious, but I would appreciate any kind of help Thank you for your time! Hello, I'm going to be updating an HTML website for a friend, and it's going to be a very basic webpage. Mostly HTML with a little JavaScript thrown in for fun. My question is, how do I handle content management for the user? The website is going to be a standard setup with a "New Information" section on the homepage. This section will be updated by the admin (my friend) on a regular basis, but I'd like to be able to have her update this info in a more user-friendly manner than updating the actual HTML code. Content management is new to me, so I'm open to any suggestions. Thanks in advance! Im not sure if this an html, php, or javascript question but here goes. I am trying to set up a place at my sight where I can have a content page from a certain link update automatically. For example, I want to create a 30 day journal link where each day a new journal page would come up. To my understanding I know I would have create a folder that would have 30 separate html pages. But my question is how can I set up the site that each page would automatically update according to day and time. Let's say that at 12:00am midnight a new html page with new content would be available for the reader. I don't have a lot of time to manually update the link with new content, so I want the site to do it on its own each day. Am I making any sense? I just need to know how I can have content automatically update each day without my needed to go and do it manually every day. Any help would be appreciated....thx so much. I have a lot of content on a page, and it is being added to every day. Because of the constant adding, the page becomes longer & longer. Instead of this happening, is there a script I could use that would make the content AUTOMATICALLY move to a new page when neccessary? Example: Page 1 can only have 30 tables. Someone adds 5 more tables to page one- CAUSING the older tables to be moved to another page. I can make the pages(page 1, page 2, page 3) beforehand, but is there a script that will let the content automatically go from page 1 to page 2 when page 1 is overflowing? Is the ANY way I could do this? Through PHP? or even Javascript? Is it possible to have a asp control in the content section of a content page of a master page? If not what is a possible work around short of remaking the entire page? I'm not sure how to explain this, but I hope someone can help me or point me in the right direction. I'd like to have a small side column on my website with content such as recent updates. Ideally, I'd like to be able change just one file and have that reflected on every page. Right now, I have to go through and update each page manually but I know there must be an easier way to do this. I'm thinking this is somehow related to RSS feeds but I don't really know much about them and I'm not sure if that's what I'm actually looking for. Can anyone offer any advice/tutorials/suggestions/help for a way to do this? The site I'm working on is located here and the section that I would like to be able to change that right column ("Recently Updated"). Ok I'm really new to this so bear with me.. I just started my file hosting website, and I have a ****ton of videos.. I really don't want to create thousands of individual pages so that users could view the videos. Is there a simple way to view each video in a page with my logo on top, tabs on the side, etc. without creating tons of individual pages? (NSFW!) ex: - family unfriendly link removed - Hey im new to this forum and i want to ask is there a way to edit multiple pages of a website and once. because i have a site with hundreds of pages and i want to add some ads and banners and i don't want to manually go and add to each page. Hello, I'm starting off. I have done a little before. I have tinkered around with html and css. I wanted to know if there is a way to have one main page with the template filling the surrounding the page, and then have the inner page be dynamic. This way I only would have one web page, and every link would change the center. What can i research to accomplish this, other than frames. unless that is the only way to do it. Would other scripting languages help, like php? Please point me in the right direction to do this with any examples or topics to research. Than you in advance! Can someone show me how to make multiples pages on a websites? For example, I want to make a "Home" page, a "Gallery" page, and other pages within my website that when people click on, say... the "Gallery" page, it takes them to that particular page and when they press "Home", it brings them back to the main page. Can it all be done with html or you need Dreamweaver to do that? Thanks. Help! I figured that this was the sort of question that someone with good web knowledge would be able to answer with ease, so thought that this site was the best way to go. I have pretty basic html skills, and what I do know is self taught. Therefore, my coding isn't great! basically, I have this site: www.mallymalcz.co.uk Which has the same layout for most of its pages, with the same navi bar and background. However, the only way that I could think of achiving this look, was to have multiple pages, with the same code but slightly different content. As a consequence, every time you go to a page, it has to load the whole thing. I was wondering how I change it so that clicking on a different page will only load 'what has changed' i.e. text, so that the images don't need to load each time and the site is more seamless. Like for instance, most sites, where the top of the page/navigation remains, but the rest of the content is replaced when links are followed. Does that make sense? I wondered whether CSS is the answer (I haven't tried using them yet). Any help would be greatly appreciated! I have the same sidebar which I would like to use on more then one page of my website. I don't want to have to put it on each page individuality because this is a pain whenever I have to edit it. What I want to be able to do is have one file that is the html of my sidebar and have that show up on each of my pages. But I don't know how to do that. Anyone else know? At the moment I have my sidebar located in a directory above the pages I want it in. Side bar: http://www.invader-stu.com/holland/g...y_sidebar.html A few of the pages I want to put it in: http://www.invader-stu.com/holland/g...s/cartoons_01/ http://www.invader-stu.com/holland/g...s/cartoons_02/ http://www.invader-stu.com/holland/gallery/comics/ http://www.invader-stu.com/holland/g...mics/comic_01/ http://www.invader-stu.com/holland/g...mics/comic_02/ Hi, I have one main problem when trying to make a site. If I want to make a side content bar and put it on every page, the only way I know of doing that so far is by either copying and pasting onto every page or by frames. I keep hearing that frames are bad, I'm not quite sure why. If I copy and paste, then when I want to add something different to the contents I would need to alter each page which could take forever. Is there another way I can do this? Thank you for any help you can provide Hi, hopefully this is in the right forum.. I have some text at the top of every page in my site, and I wanted to know if I could edit the text on one page, and have it appear that way on every other page. Any help would be greatly appreciated. Thanks Hey I had this cool bg music created by a composer friend for my website; It used to be just 1 page containing a big SWF file so I had no problem inserting a sound into the swf and making it play throughout the browsing experience. However in order to make it more google-friendly I separated it into separate files and used a .swf as the background. Is there maybe a way to still insert the sound and make it play continuously across the different pages of the website? Thanks! Cat |
|||||||