Is there any way to create a similar idea as master/content page in ASP.NET in pure HTML?
I want to create several pages in HTML, but I want that all of them look the sa
I resolved with a Third party c# form application.
Header and footer different page insert key to all other page. (###footer###) Replace files contents with form Application.
footer.html
<h2>this place is footer.</h2>
default.html
<h1>Default page</h1>
bla bla bla
###footer###
Result default.html
<h1>Default page</h1>
bla bla bla
<h2>this place is footer.</h2>
Source Code below
List list = new List();
private void sourceBtn_Click(object sender, EventArgs e)
{
DialogResult result = openFileDialog1.ShowDialog(this);
if (result == DialogResult.OK)
{
sourceTxt.Text = openFileDialog1.FileName;
}
}
private void fileListSelect_Click(object sender, EventArgs e)
{
var result = openFileDialog2.ShowDialog(this);
if (result == DialogResult.OK)
{
fileList.Items.AddRange(openFileDialog2.FileNames);
}
}
private void addSourceBtn_Click(object sender, EventArgs e)
{
list.Add(new sourceKey() { filename = sourceTxt.Text, key = keyTxt.Text });
sourceTxt.Clear();
keyTxt.Clear();
sourceTxt.Focus();
sourceList.DataSource = null;
sourceList.DataSource = list;
}
private void ConvertBtn_Click(object sender, EventArgs e)
{
foreach (var filename in fileList.Items)
{
string text = File.ReadAllText(filename.ToString());
foreach (var item in sourceList.DataSource as List)
{
text = text.Replace(item.key, File.ReadAllText(item.filename));
}
File.WriteAllText(filename.ToString(), text);
}
infoLabel.Text = "Done";
}
Source Code Download Link
The simple way to do that is to use server side includes or SSI. However easier and, probably, much better solution would be usage of PHP with includes. This way you will always have additional PHP functionality then you need it. But both of this solutions require server that will preprocess the pages. If you want collection of pages, say, on a local hard drive, then only solution I know is already proposed iframe tag.
You can use iframe. That would be purely html.
//wait until the dom is loaded
$(document).ready(function () {
//adds menu.html content into any "#menu" element
$('#menu').load('menu.html');
});
In reference to some of the other answers, iframes should be used carefully and sparingly. http://rev.iew.me/help-moving-from-iframes
http://fsvieira.com/2013/06/11/iframes-bad-for-a-website/
Duplicate question here with answer: How to create a master page using HTML?
Well, just as an ugly solution, try <iframe>
tags. They load remote pages into your website, so you could define a "master template" like this:
...
<body>
<div id="content">
<iframe src="content1.html"></iframe>
...
Now, inside of content1.html
, you could just write the content without the main layout.