Make a few elements of static site dynamic?

I have hand-coded several client websites, as static HTML files. Most of the sites are around 40 pages and nearly 150 images. The clients would now like to have the ability to use a CMS to edit the main body text content, but they don’t really need to manage anything else. So the sites would primarily be “static”, with probably the main article on each page being “dynamic”.

Is there a way to do this in Kirby, without having to recreate the sites in Kirby which would take a big chunk of time?

I think Perch CMS is designed to retrofit an existing site with a CMS, or just make some small parts of the site editable. Can Kirby do something similar?

It probably wouldn’t be a huge amount of work. Your site might have 40 pages but there are probably only 2 or 3 unique layouts to worry about.

Infact, i used to build plain static HTML sites (just the unique page layouts) before translating it into a Kirby template.

We have a wonderful, supportive community here. If you do decide to convert it to Kirby, do ask questions if you get stuck at all. We are very fast at answering them :slight_smile:

Hi. It’s the thought of having to create 40 folders, 40 text files, 3 templates and then 150 text files for the images, then customise the Panel… when all I really need to do is make one or two elements on each page editable.

I’m guessing this isn’t possible in Kirby?

I really like the look of Kirby and how easy it is to understand. I may well use it on bigger projects.

Do you still create plain static HTML sites first – to get client approval - before translating into Kirby?

That will be no different with Perch, I guess. You will need the folders there as well if you want to have dynamic content, it has to be stored somewhere.

Creating the content files could be automated programmatically, as long as there is a way to get the folder names from the html files.

Perch CMS says " Retrofit existing sites: Perch is a brilliant choice if you need to retrofit an existing site with a CMS, or just make some small parts of the site editable." and “No need to turn the whole site into a “theme”.”

Similar to how I think Perch CMS works, I am wondering if I can keep my existing sites ‘static’ apart from the main body <article>? So no Kirby templates, no snippets, no text file for every image (containing a caption), just a text file for the main text content?

While you don’t need a “theme”, you still need content folders to store the content, and you need templates to render the content.

The idea is that you have 1 template per page type, e.g. if you have blog articles, you would have a blog page parent and posts with a template article. All posts would share the same template, and only the variable parts in each page would be pulled in dynamically.

Perch is not a flat file CMS but requires a database, but I have never tested it so can’t say how it compares to Kirby and how easy it would be as a “plug in” solution, the relevant videos/documentation seems to have gone or moved.

Ok, trying to think this through. So the header, menu/nav, footer, heading and importantly the images and captions on the portfolio pages (about six per page) could be static? With just the main text being pulled in dynamically?

I think the Perch CMS selling point is that it is a ‘plug in’ solution and only those elements that need to be dynamic can be dynamic. However, I have misgivings about Perch and it isn’t something I would currently want to learn

Yes, that’s the principle. You create a page template where everything can be static HTML and only a content field would be dynamic. You’d create a blueprint (panel layout) where only this field can be edited and that’s it.

Yes, as long as this content is always the same on all of these pages. Otherwise you would need different templates.

The headings and images are different on every page, but static – I add them in for the client. The only bit that is dynamic / the client can manage is the text.

I’m thinking that this isn’t possible within Kirby or for that matter a CMS.

Do you have some links to these sites that you can share? we can probably give some more answers if you show us what you are shooting for.

You can technically throw all the images in the assets folder, and call them by file name into the pages, but you’ll get much more flexibility if you add them the pages they belong to. A compromise is to create a page that acts as a media library, that would give you the best of both worlds without having to upload to each page.

The old Kirby tag line was “Flexible as hell”. That remains mostly true.

What you’re looking for is probably possible, but I’m not sure it’s worth it. It would revolve around the “virtual pages” feature. Especially the part about “merging content”. You essentially would scan through your static html files, creating a virtual page for each, and extract the info you want to be dynamic (the text).

But it might actually be worth the effort to write instead an utility tool that converts your pages to kirby pages. Like, scan through your html files, parse them, extract the info you want to have dynamic (headings, text, images), and write them to the text files.
I know you’ve said you wanted the headings to be “static”, but having them dynamic would make it easier for you to maintain the website in the future too, like if you need to add a facebook pixel: you’d have to update 1 file, not 40.

1 Like

You could actually use kirby just for delivering some content. In your case just a simple text field.
But keep in mind that you would still need to somehow create those 40 folders + text files for each page where you want to have the dynamic text field.

To make this work you could skip the kirby routing and basically all of the frontend scaffolding shipping with kirby. You would also need to make sure that php is running for your static html files by either adjusting your server to run PHP on .html files or just rename the static files to about.php or about.html.php.

There are many ways to set this up. In this example you would run kirby in a subfolder setup so you could access the panel at www.example.com/kirby/panel.
The folder structure could look something like this:

├─ 📄 about.html.php
├─ 📄 contact.html.php
├─ 📄 gallery.html.php
└─ 📁 kirby
   ├─ 📁 content
   │  ├─ 📁 about
   │  ├─ 📁 contact
   │  └─ 📁 gallery
   │     └─ 📄 default.txt
   ├─ 📁 kirby
   ├─ 📁 site
   │  └─ 📁 blueprints
   │     └─ 📁 pages
   │        └─ 📄 default.yml
   ├─ .htaccess
   └─ index.php

A single page could look like this:

<!DOCTYPE html>
<?php require dirname(__DIR__) . '/kirby/kirby/bootstrap.php' ?>
<html>
  <head>

    <title>About</title>

  </head>
  <body>

    <p><?= page('about')->text() ?></p>

  </body>
</html>

I would not necessarily encourage someone to do it this way. I’m also not sure if you would save a lot of time doing it this way instead of the “regular” way. But in the end it is all about how much time you can/want to spend on this issue.

The time needed to setup your project in any of the ways outlined in this thread also highly depends on the level of experience you have in a certain CMS.

Thanks for all your help. It seems an amazing Kirby community.

I think for these ‘smaller’ sites I’m going to use Surreal CMS https://www.surrealcms.com. But for ‘larger’ sites with more dynamic stuff like blogs I will use Kirby.

Thanks again!