Zimjs website

General
1

Hiya Dan,

I'm setting up a new website (haven't done that in a while) and of course I'm inspired by your website. I'm looking at an efficient and modern way to manage consistent headers, footers, and menus across multiple pages of a new educational games website. I was interested to know how you create and maintain the ZIM site as I'm sure you've probably put a bit of thought into how to manage things with a minimum of fuss and effort. Just wondering if you use a framework or static site generator or do it all manually. Any pointers or advice appreciated.

2

Ah... the very modern server-side-includes ;-). That I have been using since 1995.

So... each html page is hosted on the server. It has a server side include to a header and a footer.

In the .htaccess file there is - not sure if you need the top 3

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

AddType text/html .shtml .shtm .htm .html
AddHandler server-parsed .shtml .shtm .htm .html

There are other things in the .htaccess as well - but these seem to relate to server side includes.

The pages have remote css calls to a main.css, then perhaps one for their type like secondary.css and then a style tag at the top for specific differences like setting up icons for the examples page.

1 Like
3

Love the logic and simplicity. ChatGPT recommended I look at Astro but for a small site your way is quicker. How do you handle SEO for content in the canvas? Is it just a case of alternative text in the HTML?

4

For SEO - the title, meta tags (often ignored), and if it is just ZIM that you are showing (no HTML h1 tags, etc) then there is a built in system that you can try - this is from the docs under Frame:

CANVAS ALTERNATIVE CONTENT
Frame will move any tag with an id of canvasIDAlternative into the canvas tag.
By default, the canvasID is "myCanvas" so use an id of "myCanvasAlternative".
This allows you to show content for non-canvas browsers.
The content may also be indexed by search engines - one would hope
and is read by screen readers (see also ZIM Accessibility).

1 Like
5

@Iestyn Can I offer some tools I use for start websites. If you are interested at all in the development process look into OctoberCMS or its knock off WinterCMS (created by one of the developers of OctoberCMS). I can help you set it up and teach you some basics such as I recommend just using sqlite if you are doing a small website.

I do hosting with HostGator. But A2 Hosting (is now hosting dot com) or Heztner is good.

Server requirements are:

  • PHP version 8.0.0 or higher
  • Composer 2.0 or higher
  • PDO PHP Extension
  • cURL PHP Extension
  • OpenSSL PHP Extension
  • Mbstring PHP Extension
  • ZipArchive PHP Extension
  • GD PHP Extension
  • SimpleXML PHP Extension.
2 Likes
6

Thanks for the offer Petis. For now I'm just going to quickly hand code something static. If it gets traction and traffic and starts showing promise I'll put more time and effort into it.

1 Like