Latest Showcase Sites

Article Count on upper-right corner
Contentful 10 Github Pages 17 Hugo 58 Jekyll 251 Metalsmith 40 Middleman 46
Serverless Post Scheduler 1 Isso Disqus 2 Directus ABE CMS Butter CMS
  • Replacing Disqus with Github Comments
    by Don Williamson Tutorial
    Apr 23, 17

    I’ve been considering removing comments from this blog for a while; mainly because the site doesn’t trigger much discussion and I didn’t like keeping the overhead of Disqus around. After looking into Disqus load-time behaviour I was pretty shocked what I was forcing on people loading the site

  • Hugulp, a Hugo + Gulp toolchain
    by Juan B. Rodriguez Tutorial
    Apr 20, 17

    Having decided on Hugo, I created a workflow that would allow me to replicate the famous Ruby on Rails Asset Pipeline. The basic premise of the Asset Pipeline is to minify, concatenate and fingerprint the assets used in your blog (images, stylesheets, scripts) so that less (and smaller in size) network requests are made by the browser.

  • Switching from WordPress to Nikola
    by Alan Pope Tutorial
    Apr 18, 17

    For a long while my personal blog has been running WordPress. Every so often I’ve looked at other options but never really been motivated to change it, because everything worked, and it was not too much effort to manage. Then I got ‘hacked’

  • Getting Hugo running on Netlify
    by Richard Littauer Tutorial
    Apr 17, 17

    Running Hugo on Netlify is satisfyingly great. You can get a static website running with almost no operating costs (unless you’re at major scale), and you’re also able to quickly deploy by pushing to GitHub, as well as getting SSL through LetsEncrypt automatically at the push of a button.

  • Powering a Website Publishing workflow with Forestry CMS and Aerobatic
    by Aerobatic Tutorial
    Apr 11, 17

    Fortunately a new breed of CMS tools that are emerging that bridge the gap — providing a slick interface for content editors but utilizing Git as the storage repository rather than a proprietary database. As we’ll see, this enables a universal deployment pipeline where changes from developers and changes from content contributors follow the same flow to production.

  • Generating static AMP pages
    by Paul D'ambra Tutorial
    Mar 22, 17

    AMP or Accelerated Mobile Pages is a Google-backed project that allows you to use restricted HTML to delivery static content quickly. Since AMP HTML is restricted it isn’t a fit for every site. Since this blog is published as static HTML artiles it is a good candidate for publishing an AMP version. An open source AMP jekyll plugin was amended to add AMP versions of pages.

  • Draft Blog Posts in Middleman
    by Rubyletter Tutorial
    Mar 15, 17

    The RubyLetter site — the one you’re reading right now — is built using the static site generator, Middleman. I really like Middleman because it feels much more fully-featured that Jekyll. However one thing that I missed from Jekyll was the drafts folder. You can put draft blog posts in _drafts and you’ll see them in development but not in production.

  • Go static: 5 reasons to try JAMstack on your next project.
    by Tom Bennet, Builtvisible Article
    Mar 13, 17

    Whether you’re building a blog, setting up an ecommerce site, or developing a JavaScript-powered single page app, the days of defaulting to WordPress for all but the simplest projects are over. Static site generators and ultra-fast CDN-based distribution are powering a new generation of websites, and the time to embrace this is now. Before diving into the why, let’s quickly look at the what.

  • Enabling offline usage of a Hugo site (PWA)
    by Michel Racic Tutorial
    Mar 12, 17

    PWA (Progressive Web Apps) are pretty cool for certain use cases like users having flaky connections (e.g. from mobiles) or just to reduce the initial loading time (after the first visit to the page). I document my exercise adding offline capability to a small single page site with no frequent updates that I built with Hugo and the Dimension theme.

  • Twitter cards partials for Hugo
    by GoHugoHQ Tutorial
    Mar 10, 17

    With Twitter Cards, you can attach rich photos, videos and media experiences to Tweets, helping to drive traffic to your website. Simply add a few lines of markup to your webpage, and users who Tweet links to your content will have a “Card” added to the Tweet that’s visible to their followers. Here we will build a partial that shows you how to embedd this with ease in Hugo.

  • Gatsbygram Case Study
    by Kyle Mathews Case Study
    Mar 09, 17

    Gatsby is a JavaScript web framework that let’s you build fast, very dynamic, mobile-ready websites without an advanced degree in JavaScript wizardry.

    It combines the fast performance of static websites with the powerful abstractions, tools, and client capabilities of the React.js world.

  • Autolinking shortcode through articles
    by GoHugoHQ Tutorial
    Mar 09, 17

    Sometimes its hard to crawl through all your articles and link them with specific keywords. What if you could just define the keywords you would like to have linked and Hugo finds the proper keywords and link them automatically with the actual page.

  • Go offline! Service Worker and Hugo
    by gohugohq Tutorial
    Mar 08, 17

    After mobile first, offline first and progressive web apps (PWA) are the current trend at the moment. Service Workers are crucial for both of them. A service worker is basically a script acting like a proxy between the browser and the network. You will find a simple example how to install a service worker for your Hugo satic site to make it blazing fast.

  • Activity Calendar Partial
    by GoHugoHQ Tutorial
    Mar 06, 17

    An activity calendar-widget is well known from content management systems like Wordpress. Users can see the activities/posts written in a calendar view and navigate through the archive. In this article, I show you one possible approach to achieve this with Hugo.