Cheatsheet for jekyll

https://devhints.io/jekyll

Catégories et menu

dans _includes/menu.html e.g.


{% for category in site.category-list %}
  <h4>{{category}}</h4>
  <ul class="site-nav">
    {% for item in site.pages %}
    {% if item.category == category%}
    <li><a href="{{ "" | relative_url }}{{ item.url }}" class="nav-link" >{{ item.title }} <small class="text-muted">{{item.categories}}</small></a></li>
    {% endif %}
    {% endfor %}
  </ul>
{% endfor %}

Dans le _config.yml, on une entrée category-list :

category-list: [ux, ui, ressources]

et, dans les méta-données des posts, nous reprenons ces catégories, qui seront affichées dans le menu que nous avons

---
title: Couleurs
layout: page
category: Design
---

Boucle avec une variable personnelle

https://www.throughthestack.com/blog/devbytes/customise-order-jekyll-post-loop/

On a un article qui contient ça

---
layout: post
title:  My post
post_weight: 3
---
My post content.

Dans le template, pour pouvoir récupérer les posts triés selon la variable post_weight

D’abord, on remplit un tableau avec les posts qui ont une variable post_weight.


{% assign postsArray = "" | split:"|"  %}

{% for item in site.posts %}
    {% if item.post_weight %}
        {% assign postsArray = postsArray | push: item %}
    {% endif %}
{% endfor %}

<!-- Après avoir rempli, on trie le tableau selon post_weight -->
{% assign postsArray = postsArray | sort: 'posts_weight' | reverse %}

Puis, un autre avec ceux qui n’en ont pas (de variable post_weight)


{% assign postsArrayNoWeight = "" | split:"|"  %}

{% for item in site.posts %}
    {% unless item.posts_weight %}
        {% assign postsArrayNoWeight = postsArrayNoWeight | push: item %}
    {% endunless %}
{% endfor %}

Puis, on boucle dans les deux tableaux pour afficher les articles. D’abord, ceux triés par post_weight, ensuite, par date, ceux sans variable post_weight


{% for p in postsArray %}
	<p>{{p.title}}</p>
{% endfor %}

{% for p in postsArrayNoWeight %}
	<p>{{p.title}}</p>
{% endfor %}

Deployment

SSH Framagit

Deploy on Gitlab CI

we need SSH keys for :

  • the gitlab account
  • the server

And we need ~/.ssh/authorized_keys to be filled on the server, with the Gitlab public key.

SSH Key entered on Gitlab Server public key, in Gitlab settings (Profile > Settings > SSH Key)

In the project : We add a variable SSH_PRIVATE_KEY, with the gitlab account SSH private key value.

keys in CI

Then, we can add the Gitlab CI yaml file:

# the ruby image used to build Jekyll
image: ruby:2.5.1

# Cache
cache:
  paths: 
    - vendor/

before_script:
  - bundle install --path vendor
# See 
  - 'which ssh-agent || ( apt-get update -y && apt-get install openssh-client -y )'
  - eval $(ssh-agent -s)
  - echo "$SSH_PRIVATE_KEY" | tr -d '\r' | ssh-add - > /dev/null
  - mkdir -p ~/.ssh
  - chmod 700 ~/.ssh
  - echo "$SSH_SERVER_HOSTKEYS" > ~/.ssh/known_hosts
  - chmod 644 ~/.ssh/known_hosts

build:
  only:
    - master
  stage: build
  script:
    - JEKYLL_ENV=production bundle exec jekyll build -d public # the ruby command to build the jekyll website to public/
  artifacts:
    name: "$CI_JOB_NAME"
    paths:
      - public # the path of the artifact (we will ned=ed this on the deploy stage)

# phase build : création d'un artifact public/, que l'on utilise dans le job deploy. Cet artifact public/ n'est utilisable que dans le contexte du build. On y accède, dans deploy, grâce à dependencies: - build
deploy:
  stage: deploy
  dependencies:
    - build # we need this, so we can use the artifact from the build stage
  script:
    - scp -rp ./public/* patjennings@86.229.179.47:/var/www/thomasguesnon.net # we copy over ssh from the public folder (artifacts) to the server
  only:
    - master # we only run the job on the master branch

# this prevents some problem @ converting sass in Jekyll (US ASCII error when converting)
variables:
  LC_ALL: "C.UTF-8"
  LANG: "en_US.UTF-8"
  LANGUAGE: "en_US.UTF-8"
  USERNAME: "patjennet"
  PASSWORD: "quRYNMFJu"
  HOST: "86.229.179.47"

Each time a commit will be pushed on origin/master, the build job will build the jekyll website, and push to the public folder, on the server. In 2 minutes, the website is up-do-date on its public side.

Problème de ré-écriture d’url

Les urls sans .html à la fin ne fonctionnaient pas. Avec un petit htaccess dans le dossier de sortie, c’est bon

ErrorDocument 404 /404.html

# Options -Indexes
# Options -FollowSymlinks
# Options -MultiViews
#
# RewriteEngine on
# RewriteBase /

# Remove the .html extension
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^([a-zA-Z0-9\-]+)\/?$ $1.html [NC,L]