Based on Lagrange, this is a minimalist Jekyll theme for running a personal blog. This flavour contains all original Lagrange features with some additional as:
- Fork of Lagrange
- Modern and minimal design
- Responsive template for pages and posts
- Google Analytics
- 404 page
- Sitemap
- RSS feed
- Pagination
- Blogging functionality
- Archive page
- Discus comments
- Related posts
- Reading time
- Author signature
- Social sharing
- Additional features
- Algolia
- Donation page (PayPal, Bitcoins)
- Tags page
- Categories page
- Posts series
- Improvements in related posts
- More sharing options
- Travis CI integration
- Algolia indexing
- HTML-Proofer validation
- Scripts
- Add post
- Add draft
- Publish draft
To start using this repository right away,
fork the Way of the Developer repository on GitHub.
From there, you can rename the repository to USERNAME.github.io
, where USERNAME
is your GitHub username,
and edit the _config.yml
file to your liking. Ensure that you have a branch named gh-pages
.
Your website should be ready immediately at http://USERNAME.github.io
.
Head over to the _posts
directory to view all the posts that are currently on the website,
and to see examples of what post files generally look like. You can simply just duplicate the
template post and start adding your own content.
For a full local installation,
download your own copy
and unzip it into its own directory. From there, open up your favorite command line tool,
and enter jekyll serve
. Your site should be up and run locally at
http://localhost:4000. If you do not have installed jekyll
command
follow the next instructions:
- Check Ruby installation in command line
ruby --version
. If you do not have Ruby then download and install it using RubyInstaller (in this case rubyinstaller-2.4.1-2-x64.exe was selected). In case that you already have Ruby, the output must be similar to:
ruby 2.4.1p111 (2017-03-22 revision 58053) [x64-mingw32]
- Install Bundler via command line (maybe you need to run as Administrator mode):
gem install bundler
- Install Jekyll and all dependencies.
bundle install
- Check Jekyll installation in command line
jekyll --version
, output must be similar to:
jekyll 3.5.2
- Jekyll is already to use.
- Check Ruby installation in command line
ruby --version
. If you do not have Ruby you can follow this guide for installing Ruby on Ubuntu (remember choice the best setup based on Ubuntu version usinglsb_release -a
). In case that you already have Ruby, the output must be similar to:
ruby 2.4.1p111 (2017-03-22 revision 58053) [x86_64-linux]
- Install Bundler via command line:
gem install bundler
- Install Jekyll and all dependencies.
bundle install
- Check Jekyll installation in command line
jekyll --version
, output must be similar to:
jekyll 3.5.2
- Jekyll is already to use.
You will find the blog posts in your _posts
directory. Go ahead, edit and re-build the site to
see your changes. You can rebuild the site in many different ways, but the most common way is to
run jekyll serve
, which launches a web server and auto-regenerates your site when a file is updated.
To add new posts, simply add a file in the _posts
directory that follows the convention
YYYY-MM-DD-name-of-post.ext
and includes the necessary front matter. Take a look at the source
for this post to get an idea about how it works. If you already have a website built with Jekyll,
simply copy over your posts.
To change site settings, edit the _config.yml
file found in the root of your repository.
Anything under 'Site Settings' can be tweaked to your liking.
If you are hosting your site on GitHub Pages, then committing a change to the _config.yml
file will force a rebuild of your site with Jekyll. Any changes made should be viewable soon after.
If you are hosting your site locally, then you must run jekyll serve
again for the changes to take place.
In the _config.yml
file, you'll be able to change the title of your site along with any tagline you want,
which shows up in the site header, as well as the description of your site for SEO purposes.
You can also change the social media information, and add your own social media icons.
It is a really bad practice to include images inside the main code of the project. So, in orther to avoid
that practice just read this useful article
Posting Images on Github's Wiki.
Basically you need to put your images under Wiki's project repository, after that the images will be
accesible using this root https://raw.githubusercontent.com/wiki/<github-username>/<github-repository>
.
The file _data/settings.yml
contains a property assets-img
with the root path and whatever part
you want to show an image, just put the resource like
{{ site.data.settings.assets-img }}/any_image_you_already_push_to_wiki.png
.
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.
Your contact information edit in the _data/authors.yml
(name, email, Twitter and GitHub,
or whatever you need to include). Current listed fields are used in several parts during Jekyll building.
If you don't have any, no problem, respective links will be broken 😅.
primary:
name: <author-name>
email: <author-email>
envelope: <author-email>
keybase: <author-keybase-username>
github: <author-github-username>
twitter: <author-twitter-username>
# linkedin: <author-linkedin-username>
# facebook: <author-facebook-username>
# google-plus: <author-google-plus-community-username>
# stack-overflow: <author-stackoverflow-username>
In the _data/settings.yml
are listed the social links that you want to share. The list is
matched with accounts' primary
author using icon
field, and if you do not have any social,
just comment primary
author account. On the other hand, the list is used both in menu and footer,
you can hide any link in menu part using head: false
field. Available social icons are powered
by Font Awesome, so you can use any icon that they offer.
social:
- {icon: 'github', link: 'https://github.com/', head: true}
- {icon: 'twitter', link: 'https://twitter.com/', head: false}
- {icon: 'linkedin', link: 'http://www.linkedin.com/in/', head: false}
- {icon: 'facebook', link: 'https://facebook.com/', head: false}
- {icon: 'google-plus', link: 'https://plus.google.com/communities/', head: false}
- {icon: 'stack-overflow', link: 'https://stackoverflow.com/users/', head: false}
- {icon: 'envelope', link: 'mailto:', head: true}
In order to add the next information you are going to need a few suscriptions:
Account | Function | File | Configuration |
---|---|---|---|
GitHub | Edit page | _data/settings.yml |
github-repository: <github-repository-name> github-branch: <github-repository-branch> assets-img: https://raw.githubusercontent.com/wiki/<github-username>/<github-repository-name> |
Google Analytics | Analytics | _data/settings.yml | google-tracking-id: <google-analytics-tracking-id> |
Disqus | Comments | _data/settings.yml |
disqus: disqus-shortname: <disqus-site-shortname> |
Algolia | Indexing | _config.yml |
algolia: application_id: <algolia-application-ip> index_name: <algolia-index-name> |
Searching | _data/settings.yml | algolia-search: <algolia-search-api-key> | |
PayPal | Donation | _data/settings.yml | donate-paypal: <paypal-donation-id> |
Blockchain | Donation | _data/settings.yml | donate-blockchain: <blockchain-payment-address> |
Before to put your site into production, maybe you should complete the next list:
- Remove post from
_posts
- Edit the
_config.yml
for: Algolia indexing, pagination and related posts settings. - Edit the
_data/settings.yml
for: Title/tagline, source code repository, accounts related and social links. - Describe in
about.md
the purpose of your site. - Describe in
contact.md
how people can reach you. - Edit
README.md
(at least for license signature). - Change all what you need.
The file names .travis.yml
contains a little Travis Ci pipeline.
This pipeline executes:
a) site indexation, b) site building and c) HTML validation.
language: ruby
cache: bundler
branches:
only:
- gh-pages
script:
- bundle exec jekyll algolia push
- bundle exec jekyll build
- bundle exec htmlproofer ./_site --disable-external --empty-alt-ignore
rvm:
- 2.2.2
.travis.yml
uses aGemfile
to install build dependencies. Don't worry it's already defined to this project.
If you need Travis CI, create/open your dashboard, configure a new repository, switch on Build pushes
in settings and add an environment variable
also in settings.
ALGOLIA_API_KEY=<Algolia-Admin-API-Key>
All push to your branch (e.g. gh-pages
) Travis will catch them and then trigger pipeline for you.
You can generate a new draft file by running:
_scripts/newdraft.rb "Title of your post"
After pass all post reviews, you can promote your draft to post by running:
_scripts/publishdraft.rb _draft/Title-of-your-post.md
If you are going to write a coffee post, you can generate a new post by running:
_scripts/newpost.rb "Title of your post"
Copyright © 2018, Giovanni Farfán B. Released under the MIT License.