Skip to content Go to Sitemap

Common Questions

I sometimes try to help out over at the /r/Neocities subreddit, and I've noticed that the same questions keep coming up.


How do I build a layout like this...?

Firstly, don't use tables and floats, like some people want to tell you; it's what web developers did decades ago. We don't have to torture ourselves like this anymore. It's difficult to do, and not very accessible since the elements are not semantic. (This means that screen readers (and search engines) don't know what's what.)

Use CSS grid rules. It's a great and easy solution for modern layouts, and it's very simple to make them responsive (by changing the grid-template for smaller screens).

Here's what it could look like: (This example uses semantic elements to make the site more accessible.)


.container {
  display: grid;
  grid-template:
    "header header"
    "sidebar main"
    "footer footer";
  grid-gap: 10px;
}

header { grid-area: header; }
aside { grid-area: sidebar; }
main { grid-area: main; }
footer { grid-area: footer; }
			

(Make sure not to use quotation marks (") when using the grid-area rule. It won't work.)

Here is a working example of a grid layout:

Header
Sidebar
Main
Footer

Very simple layouts can also easily be made using flexbox. I highly recommend learning how to use flexbox because it makes a ton of things easier, it's probably my favorite CSS rule.


What do I do so I don't have to change my layout in all HTML files for every change?

There's lots of things you could do. Here are 3 popular options:

  • Load your pages as iframes. Not recommended (though prevalent on Neocities), more info see here.
  • Use a static site builder like Jekyll (requires Ruby) or Spike (does not require Ruby). This has the best result, but it's difficult, definitely not something for beginners. (If you're interested in using Jekyll I recommend lostletters' Jekyll tutorial.)
  • Load everything that stays the same on every page per JavaScript. This is what I recommend. I have a tutorial and code on my layout base code page.

Why does my script/widget not work? (Neocities)

Are you trying to use an external script (= a script that isn't hosted on your own website)? Unfortunately, if you have a free website on Neocities created after ~2022 you are not allowed to use external scripts, such as guestbooks, shoutboxes, status/mood widgets, and even hit counters unless they are iFrames:

iFrames, and any widgets that use them, do work. For guestbooks I recommend using smartgb (which is what I use for my guestbook iframe) because it is very customizable and looks good in an iframe. For a chatbox you can use cbox, because it works via an iframe.

There is also a trick you could use to use external scripts with your free account: How to use external widgets with Neocities free plans