the problem

ok friend before we get into how to copy layouts you need to know about a problem.

say you have a website with 4 pages. That means you have 4 files, and those 4 files all have layout items like page headers, menu links, content.

well what happens when you want to update the header image? or add a menu link?

you'd have to go and update all 4 files.

that's lame. and you're too lazy for that.

that's where iframes come in.

iframes allow you to put a page inside a page.

so on one file you put the layout, and the other 4 files are for content.

on the layout page, you can load one of the other pages inside the iframe.

copying the layouts

now that we know what iframes are we can start copying the code.

we'll get the site working offline on your PC first before putting it on the internet.

let's take this layout has an example

press Ctrl + U to bring up the code for the page.

copy the code and put it into a file called index.hml on your computer

now open this new file you created on your browser.

looking broken as hell, that's because we're missing the CSS stylesheet file and the image files.

let's open the "style.css" file and save that to our PC too, next to our index.html is. same with the header.gif image.

now if we refresh the file in the browser we'll see we have the styles

now we looking pretty complete but we're missing the content of the site.

we see an iframe in there and it's named "content" so we're going to assume this is for content!

we'll open up that page and save it as home.html

now the site works!

if you go ahead and right-click on each of the other images on the layout page and save those too, they'll show up:

making other pages

ok well we got home working but none of the other links work.

we need to make extra pages

we know from the menu that it's trying to open blog.html, about.html and links.html

but they don't work because the files don't exist

we'll copy home.html and name it blog.html

we'll write a little something

and now the blog link works

taking it to neocities

now that we got the site working on our computers we can move them online

upload each file to your neocities account

now your site is online