diff --git a/Dockerfile b/Dockerfile
index 548ac12..01691f1 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -5,4 +5,6 @@ RUN hugo new site /hugo
RUN git clone https://github.com/yihui/hugo-xmin.git themes/hugo-xmin
ADD hugo.toml /hugo/hugo.toml
ADD content /hugo/content
+ADD static /hugo/static
+ADD shortcodes /hugo/layouts/shortcodes
CMD ["hugo", "serve", "--bind", "0.0.0.0"]
diff --git a/content/posts/example.md b/content/posts/example.md
new file mode 100644
index 0000000..84dd989
--- /dev/null
+++ b/content/posts/example.md
@@ -0,0 +1,8 @@
++++
+date = '2024-11-27'
+draft = true
+title = 'Example'
+tags = ['tutorial']
+categories = ['technical']
++++
+content goes here.
diff --git a/content/posts/how-to-blog.md b/content/posts/how-to-blog.md
index 6430df2..b0433c3 100644
--- a/content/posts/how-to-blog.md
+++ b/content/posts/how-to-blog.md
@@ -1,6 +1,5 @@
+++
date = '2024-11-27'
-draft = false
title = 'How to Host a Simple Blog'
tags = ['howto', 'tutorial', 'web']
categories = ['technical']
@@ -24,11 +23,13 @@ Ideally, the directory structure should look like this:
blog
├── Dockerfile // dockerfile to build and host the site
├── README.md // info about the repository, not a blogpost
-├── config.toml // blog-framework configuration file
-└── content
- ├── about.md // the "about" page
- └── posts // actual blog posts go here
- └── example.md
+├── hugo.toml // blog-framework configuration file
+├── content
+│ ├── about.md // the "about" page
+│ └── posts // actual blog posts go here
+│ └── example.md
+└── static // non-markdown files
+ └── example.png
```
And then to build the site, simply build the container:
@@ -52,9 +53,78 @@ RUN hugo new site /hugo
RUN git clone https://github.com/yihui/hugo-xmin.git themes/hugo-xmin
ADD hugo.toml /hugo/hugo.toml
ADD content /hugo/content
+ADD static /hugo/static
CMD ["hugo", "serve", "--bind", "0.0.0.0"]
```
For now, I am just using the built-in server in `hugo`, but it should be possible to serve using `nginx`.
I mentioned `hugo` before, but I was mostly mad that I had to add the autogenerated stuff in git - with this approach... I don't have to 🎊!
+
+## Images
+Just put images in the `static` directory, and reference to them in your blogposts like you would normally in a `hugo` project:
+
+```markdown
+
+```
+
+
+
+This is not centered, and there's no built-in [shortcode](https://gohugo.io/content-management/shortcodes/) for centering images (why not, hugo? You have a shortcode for figures, but no css class for centering - you cant even add a `style` tag? Such an oversight)...
+So we have to add one dirty thing to this setup. We have to add a `shortcodes` directory, that is then also added to the docker container in `/hugo/layouts/shortcodes`:
+
+```
+blog
+├── Dockerfile
+├── README.md
+├── hugo.toml
+├── content
+│ ├── about.md
+│ └── posts
+│ ├── example.md
+│ └── how-to-blog.md
+├── shortcodes
+│ └── centered.html // <-- Added
+└── static
+ └── example.png
+```
+
+```html
+
+
+ 
+
+```
+
+Then we can use this new shortcode like so:
+
+```markdown
+{{}}
+```
+
+{{< centered image="/example.png" >}}
+
+Yes! Now we're cooking with gas! ... or atleast cooking with something.
+
+If you want to just manually build and run docker image on your website server, feel free to stop reading here.
+The next section really elevates the publishing flow to a whole another level though.
+
+# Hosting and Deployment
+Being able to build and launch the docker image is nice and can suffice for smaller projects.
+Yes, this blog is a small project and the manual method should be more than enough, but I also play [factorio](https://store.steampowered.com/app/427520/Factorio/) (highly recommend it!), so I _hvae_ to automate everything that is tedious.
+
+## Continuous Integration
+This section
+I am using my [personal gitea instance](git.gtz.dk/agj/blog) to host the source code for this blog - which means that I will be using the integrated CI system there, but you can use whichever CI service you'd like.
+The general concepts of the workflow should be fairly easy to translate to any kind of CI
+
+
+
+This setup also gives us the possibility of performing traditional code-review before releasing by using [pull requests]().
+This should empower us to identify and correct issues (e.g. spelling mistakes or whatever) before they are pushed to the official website.
+
+## Continuous Delivery
+With a docker image readily available
+
+### Orchestration
+I personally am a big fan of the simplicity of [portainer](), as it scales really well when doing perosnal server stuff
diff --git a/shortcodes/centered.html b/shortcodes/centered.html
new file mode 100644
index 0000000..56b6ad8
--- /dev/null
+++ b/shortcodes/centered.html
@@ -0,0 +1,3 @@
+
+
+
diff --git a/static/example.png b/static/example.png
new file mode 100644
index 0000000..4c08bc0
Binary files /dev/null and b/static/example.png differ