About me
Blog
Analytics

Welcome to Jekyll!

1 mins read time


This is my first post using jekyll. I started to use it because I really like the idea of writing my own website in markdown language, with my favorite text editor and using git to control the version of my files. The result is a simple and fast static (though javascript-powered) website on a free server. In addition, I don’t have to log in to a (comparatively) slower, web browser based interface like Wordpress.

I started playing up with jekyll in local using the minima theme with the following commands:

$ gem install jekyll bundler
$ jekyll new my-awesome-site

I can build the site by running jekyll serve inside my site directory. This command launches a web server and auto-generate the site when a file is updated. I can easily add a new post by putting a file in the _posts directory, following the date convention (YYYY-MM-DD-name-of-post.ext).

To customize the default structure and style, I copied the files that define the theme. They can by found with the command bundle show minima. Then, I can modify the footer of my page with the file _includes/footer.html, add new icons and accounts.

Google analytics

I can also use Google analytics to track the traffic of my website (They are watching us!). Login to Google Analytics and create a new property to receive a Tracking ID for your website. You will find your Universal Analytics tracking code under Admin > Property > Tracking Info > Tracking Code.

Now you need to reference your Tracking ID in your _config.yml file. Replace UA—XXXXXXXX-X with your own unique Tracking ID:

# Google services
google_analytics: UA—XXXXXXXX-X

Disqus commments

Finally I can add comments inside the blog using disqus comment system. I create an account at disqus and then I can obtain a disqus_shorname. Remember to add your site to the trusted domains feature in your settings.

Then I open config.yml and add the following code. Remember to change my_disqus_shortname to your own Disqus shortname.

# Disqus Comments
disqus:
    # Leave shortname blank to disable comments site-wide.
    # Disable comments for any post by adding `comments: false` to that post's YAML Front Matter.
    shortname: my_disqus_shortname

Comments and analytics are not enable by default in local because it is a development environment. They are only available in production environment. To run Jekyll in production environment use the following command to view your site.

JEKYLL_ENV=production bundle exec jekyll serve

Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll’s GitHub repo. If you have questions, you can ask them on Jekyll Talk.

Update

I started using Emping theme. It offers a more aesthetic design and also includes Amp Page implementation to improve charging time, Pagination for the blog, a nice 404 Error Page, SEO Gems and the Share Button with different social networks.

In relation with 🏷️ jekyll:

Writing notes with Vimwiki and Hugo static generator

Vim is a simple and ubiquitous text editor that I use daily. In this article I show how to use Vim to take and publish diary notes using Vimwiki and Hugo.

Search posts functionality in AMP static website make with Jekyll

Good web reference is related with how fast your web page loads. Google works in a web format called AMP, which makes loading pages faster but also imposes some restrictions, like no external javascript. It's not simple to add API calls in AMP so this post shows how to implement a search fonctionality in a static page.

Algolia search engine in Jekyll static pages

This article shows how to implementent Algolia searching engine in a static website and update the entries using Github Actions.

Static AMP website creation with Bulma and Jekyll

This posts shows how to include bulma css classes inside a jekyll website but keeping good performance from AMP websites

Subscribe to my newsletter 📰

and share it with your friends: