Using a Static Site Generators like Hexo gives a developer a very fast blogging workflow, using familiar tools and giving the ability to write offline. Content is written in markdown, keeping it portable between any blog generators and making it easy to version in Git. You can also use Git to deploy your site quickly, even over slow networks.

Static sites can be hosted anywhere and are fast to serve and easy to cache. For example, Github Pages offers a very fast way to host your site.

Lets take a look at Hexo, my favourite static site generator.

Read More

Adding images to a blog post helps the audience undersand what the will get from reading the article and if it will be relevant for the. Images also aid the understanding of the topic you are covering, especially if you are explaining something technical or more complicated.

The default theme for hexo only provides a single image style, so here I will create several styles of image to help convey the topic and details of every post.

Read More

The font that comes with the default hexo fault is quite nice, however, I like using the Ubuntu font especially for code. As the Hexo theme uses Google fonts in some places already, then it was really easy to change which one Hexo uses. Here I will show you how to change over to the Ubuntu font family for text and sorce code using Google Fonts.

Read More

Hexo has a bit of a refactor from version 2.6 onwards to make it a bit more flexible with regard to the node modules it uses. So when you create a new Hexo project you have to add some module to that project before you can generate your site. This is an easy step as its managed by the Node package manager (npm).

There are more details about migration steps on the Hexo Github project.

Here are the essential details and options for upgrading to Hexo 2.6 onwards.

Read More

The hexo theme shows code in a solid black box with syntax hightlghting to match. It gives a nice contrast to the rest of the content, however I wanted to add curves to the corner of the code boxes. I also wanted to add a margin / padding around the code box so it did not touch the edges of the post.

Read More

Whilst I like many aspects of the Hexo theme used to generate static websites, it does seem to have a lot of redundant space. So here are a few aspects of the them I have changes in order to get more of the actual content showing on the page.

Read More

FontAwesome provides a lot of icons you can use in your website instead of including image logos of various sizes. There are icons for twitter, linkedin, Github and RSS feeds. Using these icons keeps your website fast on any device or network.

I’ll explain how I configured the standard Hexo Landscape theme to add icons in my blog website navigation bar, each icon linking to the developer related sites I use such as Github and Twitter.

Read More

You can use Git to manage version of your content effectively. You can also use Git to manage any changes you make to the theme you use.

Rather than keep all these seperate changes in one repository, you can use Git submodules to manage your theme and content changes seperately.

Read More

I found writing articles with Blogger.com had become slow and a little frustrating. So I decided to switch to Hexo.io as I can write articles anywhere I have a text editor (usually Emacs). Hexo also creates a responsive and fast static website, so when people want to read the articles (including myself when I have forgotten something) then they can do so quickly and across multiple devices. As its a static site, I can deploy it anywhere.

So how do I get all of that content I created out of Blogger and into Hexo. Luckily Hexo has a migration tool to make things easier

Read More

Hexo displays posts in a summary format by default, showing the title and content of the article up to the point where the more marker is used:

Read More