Skip to content

Personal blog with Github, Cloudflare and Webmentions

This is a lot and there is more to come. I will possibly make a series but today I will cover the most basic things and stuff I did. I had some things from before, but I wanted to upgrade them with something better.

Github private repository

I already had a GitHub page built on Jekyll, and that part is rather easy unless you want a custom style which I had to create.

Otherwise, you can pre-install or fork a template that fit your needs and set it up as explained in the official Jekyll or GitHub page manual.

For the sake of a better preview, you can change the URL in username.github.io Settings to build directly on Github, but you will need to keep files in a public repository. Built from private is only available in GitHub paid plan.

Cloudflare pages Jekyll build

I wanted to keep my files in the private repository so that's where Cloudflare comes into play.

Cloudflare page builds from a GitHub repository instructions are short, down to the point, and simple to follow.

Everything is automatic, and in case of an error delete a build, remove problematic files and make another commit.

From there on changes will sync.

Webmentions Bridgy commenting

For the comments, I decided to use Webmentions, because most of my discussions are happening on social media, and I want to keep them recorded.

In the first version I hosted a comment script over Utterances, but that is only available for Github members.

The rest of the commenting happens with various other websites.

I log in to Webmentions with a webpage link and install a code in the head. After that, I connected Bridgy with my social accounts on Mastodon, Reddit, and GitHub.

After this when a post from a page is shared or status is made with a post link on any of those services the comments will be attributed to that post on Webmentions.

Comments are presented under the post with a special script that has to be made in a post layout.

This takes some time but the results are satisfying.

Resources

Define Jekyll, Github pages, Cloudflare, Webmentions and Bridgy an each

Jekyll

For creating a static website I used Jekyll.

Jekyll is a static site generator that allows you to create websites using simple templates and markdown language. It's written in Ruby and widely used for blogs and other simple websites hosted on Github Pages.

Jekyll

Github Pages

Github Pages is a free web hosting service provided by Github for hosting static web pages, such as personal blogs, portfolio sites, and documentation. It integrates seamlessly with Jekyll, making it easy to host your Jekyll-powered site on Github.

I transferred all my files on Github with Github desktop application. .

Github Pages

Cloudflare

Cloudflare is a content delivery network (CDN) and web security company that provides various services such as DDoS protection, website acceleration, and domain name server (DNS) management. It helps to improve website performance, increase security and reduce website downtime.

For building a website I connected Github repository with the Cloudflare. In this way I can serve my private repository on Github as a website publically.

Cloudflare

Webmentions and Bridgy

Webmentions is a web standard for receiving notifications when someone mentions your website in a post on their own website. It enables websites to interact with each other, allowing for comments, replies, likes and reposts to be sent between them.

Bridgy is a service that connects web mentions to social media profiles, enabling you to receive notifications about mentions of your website on social media platforms. It acts as a bridge between the web and social media, allowing you to interact with your followers and keep track of your online presence.

Majority of the commenting for my content happens on social website so I integrated Mastodon, GitHub and Reddit with Webmentions, Bridgy and a comment script.

Webmentions Bridgy

COMMENTS

Comments