Load dynamic content into page from external source

Today I've been thinking a lot about CMS and how to load data into a templating engine dynamically.

I thought about the languages that one could use. I've been using Pug and EJS in NodeJS, but I assume the idea around data loading remains the same.

I would like to make a website that is not completely static, rather, it lets the owner of the website decide a few things of the page by using an admin page, much like Wordpress or other CMS.

The first thing that comes to mind about this is probably the title of the page, or the H1 element.

I tried to look for information on the web but I'm probably missing some naming conventions for this particular subject, hence the question on stackoverflow.

To try and make the question more understandable:

In the image you can see the parts that I would like the admin of the page to modify without the help of a developer (the image is just for the purpose of explaining my question, I'm not working on that thing).

I thought about loading a file from the backend, be it XML or JSON, that stores these informations in an object like fashion:

{
   title: the title,
   h1: h1 text,
   paragraph1: paragraph1 title
}

This solution could work, the server would have access to the file and could make read and write operations to it if the user has the necessary permissions. This is possible, but I feel like it is not the best solution nor a good solution.

Thinking specifically about a Wordpress admin page, where you decide the title of the theme and page, the navbar links and all the other things, how would I go about creating something like that? How would it interact with the templating engine to load the page with the modified html depending on the choices from the admin?

Thanks in advance!

via mnemosdev