Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JEKYLL #5

Open
petrosh opened this issue Sep 24, 2015 · 16 comments
Open

JEKYLL #5

petrosh opened this issue Sep 24, 2015 · 16 comments
Labels

Comments

@petrosh
Copy link
Owner

petrosh commented Sep 24, 2015

Build Time Articles

Liquid

Kill jekyll process

ps aux | grep jekyll
kill -9 :process_number

Links

I still like to use Compass for stylesheets, because it has so many other benefits. Because Compass can handle bundling, the plugin only needs to copy the file and add a fingerprint to the filename.

Files

URL

data-* in head tag

<head data-owner="{{ site.github.owner_name }}" data-project="{{ site.github.project_title }}" data-repo="{{ site.github.repository_url }}">

Canonical URL

  <link rel="canonical" href="{{ site.github.url }}{{ page.url }}" />

What's new in GitHub Pages with Jekyll 3.3

  • Use {{ "/about/" | absolute_url }}

User and Organizazion pages

  • baseurl:&nbsp;
  • page URL: http://user-org.github.io = {{ site.github.url }}
  • Repository name: user-org.github.io = {{ site.github.project_title }}

Project pages

  • baseurl: /project
  • page URL: http://user-org.github.io/project = {{ site.github.url }}
  • Repository name: project = {{ site.github.project_title }}

Selectors

{% if page.type === 'post' %} ... {% endif %}
{% if page.path contains '_posts' %} ... {% endif %}

Check current environment

There are a couple of ways to do this. If you’re hosting your site on GitHub then the best way is to wrap your code or HTML inside:

{% if jekyll.environment == 'production' %}

{% endif %}

GitHub creates this environment variable on its servers.

Code highlight syntax

@petrosh petrosh changed the title Jekyll configuration JEKYLL – Configuration Sep 29, 2015
@petrosh petrosh changed the title JEKYLL – Configuration JEKYLL Mar 10, 2016
@petrosh
Copy link
Owner Author

petrosh commented Mar 13, 2016

Test tags and Filters

{% assign posts_by_lang = site.posts | group_by: "lang" %}

Filters

Inspect {{ some_var | inspect }}
Convert an object into its String representation for debugging.

Jsonify {{ some_object | jsonify }}
Convert Hash or Array to JSON.
Convert only first var {% if forloop.index0 == 0 %}{{ r | jsonify }}{% endif %}

Operations

{{ product.price | minus: 15 }}
{{ product.price | plus: 15 }}
{{ product.price | times: 1.15 }}
{{ product.price | divided_by: 10.1 }}

The result is rounded down to the nearest integer (that is, the floor) if the divisor is an integer.

Modulo

Returns the remainder of a division operation.

{{ 0 | modulo: 2 }}
{{ 1 | modulo: 2 }}
{{ 2 | modulo: 2 }}
{{ 3 | modulo: 2 }}

Return 0 1 0 1

@petrosh
Copy link
Owner Author

petrosh commented Mar 19, 2016

Snippets

Switch/case

{% case d %}
  {% when '1' or '21' or '31' %}vai
  {% else %}zio
  {% endcase %}

Titlecase string

{% assign words = include.string | split: ' ' %}
{% capture titlecase %}{% for word in words %}{{ word | capitalize }} {% endfor %}{% endcapture %}
{{ titlecase }}

Page scripts
Load page script if exist on /assets/javascript/pagescripts/

{% capture pagescript_url %}/assets/javascript/pagescripts/{{ page.title }}.js{% endcapture %}
{% for static_file in site.static_files %}
  {% if static_file.path == pagescript_url %}
<script src="{{ pagescript_url | absolute_url }}" defer></script>
  {% endif %}
{% endfor %}

Table of contents

* U need some text here
{:toc}

Default value {{ nil | default: "hello" }}
Set a fallback in case a value doesn’t exist.

Loop real pages html_pages

A subset of site.pages listing those which end in .html (you will not see collections here)

{% for p in site.html_pages %}
  {{ p.path }}
{% endfor %}

Main navigation with active class

<nav>
	{% assign navigation_pages = site.html_pages | sort: 'navigation_weight' %}
	{% for p in navigation_pages %}
		{% if p.navigation_weight %}
			<a href="{{ p.url | absolute_url }}" {% if p.url == page.url %}class="active"{% endif %}>{{ p.title | upcase }}</a>
		{% endif %}
	{% endfor %}
	<a href="" class="float-right">Login</a>
</nav>

Escape entity {{ "<p>Jekyll</p>" | escape }}
Returns an escaped version of html.

Breadcrumb

Easy

{% if page.excerpt %}
  {{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}
{% else %}
  {{ site.description }}
{% endif %}

Not shown on root page.

{% unless site.show_breadcrumb == false %}
  {% unless page.url == '/' %}
    <nav><a href="{{ site.baseurl }}/">Home</a> &blacktriangleright; 
    {% if page.path contains '_posts' %}
      <a href="{{ site.baseurl }}/blog/">Blog</a> &blacktriangleright; 
    {% endif %}
    {% if page.parent %}
      {% for p in site.pages %}
        {% if p.title == page.parent %}
          <a href="{{ site.baseurl }}{{ p.url }}">{{ p.title }}</a> &blacktriangleright;
        {% endif %}
      {% endfor %}
    {% endif %}
    {{ page.title }}</nav>
  {% endunless %}
{% endunless %}

Collection folder hierarchy menu

{% assign url_parts = page.url | split: '/' %}
{% assign url_parts_size = url_parts | size %}
{% assign rm = url_parts | last %}
{% assign base_url = page.url | replace: rm %}

<ul>
{% for node in site.pages %}
  {% if node.url contains base_url %}
    {% assign node_url_parts = node.url | split: '/' %}
    {% assign node_url_parts_size = node_url_parts | size %}
    {% assign filename = node_url_parts | last %}
    {% if url_parts_size == node_url_parts_size and filename != 'index.html' %}
      <li><a href='{{node.url}}'>{{node.title}}</a></li>
    {% endif %}
  {% endif %}
{% endfor %}
</ul>

page object

{
	"layout": "default",
	"title": "Loop for i in (1..10) with forloop.",
	"content": "...",
	"dir": "/jekyll/loops/",
	"name": "loops.md",
	"path": "jekyll/loops.md",
	"url": "/jekyll/loops/"
}

@petrosh
Copy link
Owner Author

petrosh commented Oct 29, 2016

Arrays

Operators

https://gattiecani.github.io/renderizer/jekyll/array/

  • Add as first: {{ array | unshift: element }}
  • Add as last: {{ array | push: element }}
  • Take the last: {{ array | pop }}
  • Take the first: {{ array | shift }}

Check if array

{% if item.first %}
  Array
{% else %}
  String or empty Array
{% endif %}

var1 = "a" is a string

{% var1.first %} // return `nil`

var2 = [a,b,c] is array

{% var2.first %} // return a

Array size

{{ array.size }}

Define and populate an Array talk.jekyllrb, stackoverflow

{% assign myarray = "" | split: "" | push: "toto" %}

@petrosh
Copy link
Owner Author

petrosh commented Oct 29, 2016

Configuration

Do not use tabs in configuration files

This will either lead to parsing errors, or Jekyll will revert to the default settings.
Use spaces instead.

_config.yaml

# for repository
url: //username.github.io/repository
# or url:
# empty
baseurl: /repository
# for orgs and personal both empty

# gems
# Feed: <head>{% feed_meta %}</head>
# Github: Expose {{ site.github }} array: {% assign cosa = site.github.public_repositories[8] %}
repository: username/repository
gems:
  - jekyll-feed
  - jekyll-sitemap
  - jekyll-coffeescript
  - jekyll-github-metadata
  - jekyll-titles-from-headings # A Jekyll plugin to pull the page title from the first Markdown heading when none is specified.
  - jekyll-default-layout # Silently sets default layouts for Jekyll pages and posts
  - jekyll-readme-index # A Jekyll plugin to render a project's README as the site's index
  - jekyll-optional-front-matter #Any Markdown file in your site's source will be treated as a Page and rendered as HTML, even if it doesn't have YAML front matter.
  - jekyll-mentions # @mentionable support for your Jekyll site

# Timezone
# Expose {{ site.time }} at compile
timezone: Europe/Rome

permalink: pretty # or permalink: /:categories/:title/
markdown: kramdown
kramdown:
  auto_ids: true
sass:
  sass_dir: _sass
  # style: compressed

Default values with scope

defaults:
    -
        scope:
            path: "pages" # an empty string here means all files in the project
        values:
            layout: "default"
            navigation_weight: 0 # for navigation
            comments: false # for parliamone

@petrosh
Copy link
Owner Author

petrosh commented Dec 12, 2016

Jekyll GitHub metadata

gem:
  - jekyll-github-metadata

Available repository metadata

"NWO" stands for "name with owner." It is GitHub lingo for the username of the owner of the repository plus a forward slash plus the name of the repository, e.g. 'parkr/blog', where 'parkr' is the owner and 'blog' is the repository name.

{
    "versions": {
        "jekyll": <version>,
        "kramdown": <version>,
        "liquid": <version>,
        "maruku": <version>,
        "rdiscount": <version>,
        "redcarpet": <version>,
        "RedCloth": <version>,
        "jemoji": <version>,
        "jekyll-mentions": <version>,
        "jekyll-redirect-from": <version>,
        "jekyll-sitemap": <version>,
        "github-pages": <version>,
        "ruby": <version>"
    },
    "hostname": "github.com",
    "pages_hostname": "github.io",
    "api_url": "https://api.github.com",
    "environment": "dotcom",
    "public_repositories": [ Repository Objects ],
    "organization_members": [ User Objects ],
    "build_revision": "cbd866ebf142088896cbe71422b949de7f864bce",
    "project_title": "metadata-example",
    "project_tagline": "A GitHub Pages site to showcase repository metadata",
    "owner_name": "github",
    "owner_url": "https://github.com/github",
    "owner_gravatar_url": "https://github.com/github.png",
    "repository_url": "https://github.com/github/metadata-example",
    "repository_nwo": "github/metadata-example",
    "repository_name": "metadata-example",
    "zip_url": "https://github.com/github/metadata-example/zipball/gh-pages",
    "tar_url": "https://github.com/github/metadata-example/tarball/gh-pages",
    "clone_url": "https://github.com/github/metadata-example.git",
    "releases_url": "https://github.com/github/metadata-example/releases",
    "issues_url": "https://github.com/github/metadata-example/issues",
    "wiki_url": "https://github.com/github/metadata-example/wiki",
    "language": null,
    "is_user_page": false,
    "is_project_page": true,
    "show_downloads": true,
    "url": "http://username.github.io/metadata-example", // (or the CNAME)
    "contributors": [ User Object ],
    "releases": [ Release Objects ]
}

User Object

{
  "login": "petrosh",
  "id": 4997583,
  "avatar_url": "https://avatars.githubusercontent.com/u/4997583?v=3",
  "gravatar_id": "",
  "url": "https://api.github.com/users/petrosh",
  "html_url": "https://github.com/petrosh",
  "followers_url": "https://api.github.com/users/petrosh/followers",
  "following_url": "https://api.github.com/users/petrosh/following{/other_user}",
  "gists_url": "https://api.github.com/users/petrosh/gists{/gist_id}",
  "starred_url": "https://api.github.com/users/petrosh/starred{/owner}{/repo}",
  "subscriptions_url": "https://api.github.com/users/petrosh/subscriptions",
  "organizations_url": "https://api.github.com/users/petrosh/orgs",
  "repos_url": "https://api.github.com/users/petrosh/repos",
  "events_url": "https://api.github.com/users/petrosh/events{/privacy}",
  "received_events_url": "https://api.github.com/users/petrosh/received_events",
  "type": "User",
  "site_admin": false,
  "contributions": 1
}

Repository Object

{
  "id": 77236282,
  "name": "basic",
  "full_name": "fork-n-play/basic",
  "owner": {
    "login": "fork-n-play",
    "id": 13919820,
    "avatar_url": "https://avatars.githubusercontent.com/u/13919820?v=3",
    "gravatar_id": "",
    "url": "https://api.github.com/users/fork-n-play",
    "html_url": "https://github.com/fork-n-play",
    "followers_url": "https://api.github.com/users/fork-n-play/followers",
    "following_url": "https://api.github.com/users/fork-n-play/following{/other_user}",
    "gists_url": "https://api.github.com/users/fork-n-play/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/fork-n-play/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/fork-n-play/subscriptions",
    "organizations_url": "https://api.github.com/users/fork-n-play/orgs",
    "repos_url": "https://api.github.com/users/fork-n-play/repos",
    "events_url": "https://api.github.com/users/fork-n-play/events{/privacy}",
    "received_events_url": "https://api.github.com/users/fork-n-play/received_events",
    "type": "Organization",
    "site_admin": false
  },
  "private": false,
  "html_url": "https://github.com/fork-n-play/basic",
  "description": "Basic framework for development.",
  "fork": false,
  "url": "https://api.github.com/repos/fork-n-play/basic",
  "forks_url": "https://api.github.com/repos/fork-n-play/basic/forks",
  "keys_url": "https://api.github.com/repos/fork-n-play/basic/keys{/key_id}",
  "collaborators_url": "https://api.github.com/repos/fork-n-play/basic/collaborators{/collaborator}",
  "teams_url": "https://api.github.com/repos/fork-n-play/basic/teams",
  "hooks_url": "https://api.github.com/repos/fork-n-play/basic/hooks",
  "issue_events_url": "https://api.github.com/repos/fork-n-play/basic/issues/events{/number}",
  "events_url": "https://api.github.com/repos/fork-n-play/basic/events",
  "assignees_url": "https://api.github.com/repos/fork-n-play/basic/assignees{/user}",
  "branches_url": "https://api.github.com/repos/fork-n-play/basic/branches{/branch}",
  "tags_url": "https://api.github.com/repos/fork-n-play/basic/tags",
  "blobs_url": "https://api.github.com/repos/fork-n-play/basic/git/blobs{/sha}",
  "git_tags_url": "https://api.github.com/repos/fork-n-play/basic/git/tags{/sha}",
  "git_refs_url": "https://api.github.com/repos/fork-n-play/basic/git/refs{/sha}",
  "trees_url": "https://api.github.com/repos/fork-n-play/basic/git/trees{/sha}",
  "statuses_url": "https://api.github.com/repos/fork-n-play/basic/statuses/{sha}",
  "languages_url": "https://api.github.com/repos/fork-n-play/basic/languages",
  "stargazers_url": "https://api.github.com/repos/fork-n-play/basic/stargazers",
  "contributors_url": "https://api.github.com/repos/fork-n-play/basic/contributors",
  "subscribers_url": "https://api.github.com/repos/fork-n-play/basic/subscribers",
  "subscription_url": "https://api.github.com/repos/fork-n-play/basic/subscription",
  "commits_url": "https://api.github.com/repos/fork-n-play/basic/commits{/sha}",
  "git_commits_url": "https://api.github.com/repos/fork-n-play/basic/git/commits{/sha}",
  "comments_url": "https://api.github.com/repos/fork-n-play/basic/comments{/number}",
  "issue_comment_url": "https://api.github.com/repos/fork-n-play/basic/issues/comments{/number}",
  "contents_url": "https://api.github.com/repos/fork-n-play/basic/contents/{+path}",
  "compare_url": "https://api.github.com/repos/fork-n-play/basic/compare/{base}…{head}",
  "merges_url": "https://api.github.com/repos/fork-n-play/basic/merges",
  "archive_url": "https://api.github.com/repos/fork-n-play/basic/{archive_format}{/ref}",
  "downloads_url": "https://api.github.com/repos/fork-n-play/basic/downloads",
  "issues_url": "https://api.github.com/repos/fork-n-play/basic/issues{/number}",
  "pulls_url": "https://api.github.com/repos/fork-n-play/basic/pulls{/number}",
  "milestones_url": "https://api.github.com/repos/fork-n-play/basic/milestones{/number}",
  "notifications_url": "https://api.github.com/repos/fork-n-play/basic/notifications{?since,all,participating}",
  "labels_url": "https://api.github.com/repos/fork-n-play/basic/labels{/name}",
  "releases_url": "https://api.github.com/repos/fork-n-play/basic/releases{/id}",
  "deployments_url": "https://api.github.com/repos/fork-n-play/basic/deployments",
  "created_at": "2016-12-23 16:06:38 UTC",
  "updated_at": "2016-12-23 16:06:38 UTC",
  "pushed_at": "2016-12-23 16:06:39 UTC",
  "git_url": "git://github.com/fork-n-play/basic.git",
  "ssh_url": "[email protected]:fork-n-play/basic.git",
  "clone_url": "https://github.com/fork-n-play/basic.git",
  "svn_url": "https://github.com/fork-n-play/basic",
  "homepage": null,
  "size": 0,
  "stargazers_count": 0,
  "watchers_count": 0,
  "language": null,
  "has_issues": true,
  "has_downloads": true,
  "has_wiki": true,
  "has_pages": true,
  "forks_count": 0,
  "mirror_url": null,
  "open_issues_count": 0,
  "forks": 0,
  "open_issues": 0,
  "watchers": 0,
  "default_branch": "master"
}

Release object

{
  "url": "https://api.github.com/repos/fork-n-play/basic/releases/5043998",
  "assets_url": "https://api.github.com/repos/fork-n-play/basic/releases/5043998/assets",
  "upload_url": "https://uploads.github.com/repos/fork-n-play/basic/releases/5043998/assets{?name,label}",
  "html_url": "https://github.com/fork-n-play/basic/releases/tag/v0.1",
  "id": 5043998,
  "tag_name": "v0.1",
  "target_commitish": "master",
  "name": "Login and Fork updates working",
  "draft": false,
  "author": {
    "login": "petrosh",
    "id": 4997583,
    "avatar_url": "https://avatars.githubusercontent.com/u/4997583?v=3",
    "gravatar_id": "",
    "url": "https://api.github.com/users/petrosh",
    "html_url": "https://github.com/petrosh",
    "followers_url": "https://api.github.com/users/petrosh/followers",
    "following_url": "https://api.github.com/users/petrosh/following{/other_user}",
    "gists_url": "https://api.github.com/users/petrosh/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/petrosh/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/petrosh/subscriptions",
    "organizations_url": "https://api.github.com/users/petrosh/orgs",
    "repos_url": "https://api.github.com/users/petrosh/repos",
    "events_url": "https://api.github.com/users/petrosh/events{/privacy}",
    "received_events_url": "https://api.github.com/users/petrosh/received_events",
    "type": "User",
    "site_admin": false
  },
  "prerelease": true,
  "created_at": "2016-12-31 17:00:42 UTC",
  "published_at": "2016-12-31 17:08:27 UTC",
  "assets": [],
  "tarball_url": "https://api.github.com/repos/fork-n-play/basic/tarball/v0.1",
  "zipball_url": "https://api.github.com/repos/fork-n-play/basic/zipball/v0.1",
  "body": ""
}

@petrosh petrosh removed the yaml label Dec 21, 2016
@petrosh
Copy link
Owner Author

petrosh commented Dec 22, 2016

Images

Extract the first image from a post Max Glenister

{% assign images = post.content | split:"<img " %}
{% for image in images %}
  {% if image contains 'src=' %}
    {% assign imageMarkup = image | split:">" | first %}
    <img {{ imageMarkup }}>
    {% break %}
  {% endif %}
{% endfor %}

Images talk.jekyllrb

{% include image.html file="filename" type="jpg" url="image-url" alt="alt-text" caption="the-caption" border="true" %}

Parameters:

  • file: The name of the file (without the file extension)
  • type: The type of file (png, svg, and so on)
  • url: Whether to link the image to a URL
  • alt: Alternative image text for accessibility and SEO
  • caption: A caption for the image
  • border: A border around the image. If you want the border, set this equal to true. Otherwise omit the parameter.
<figure>
  {% if {{include.url}} %}<a target="_blank" href="{{include.url}}">{% endif %}
  <img class="docimage {% if {{include.border}} == "true" %}border{% endif %}" src="{{site.image_path}}{{include.file}}.{{include.type}}" alt="{{include.alt}}" />
  {% if {{include.url}} %}</a>{% endif %}
  <figcaption>{{include.caption}}</figcaption>
</figure>

Then add two classes to your stylesheet: img.docimage and img.border

Also, in your configuration file, image_path should define the basepath to your image assets folder.

For translated images, store your images in a different folder and change the basepath to that translated image folder appropriately in the translated project's config file.

@petrosh
Copy link
Owner Author

petrosh commented Jan 18, 2017

Tags and categories

Scan all pges for tags and cats

{% assign every_page = '' | split: '' %}
{% for p in site.html_pages %}{% assign every_page = every_page | push: p %}{% endfor %}
{% for d in site.documents %}{% assign every_page = every_page | push: d %}{% endfor %}

`group_by: 'tags'`

{% assign tags = every_page | group_by: 'tags' %}
{% for t in tags %}- {{t.name|remove:'['|remove:']'|remove:'"'|remove:' '|split:','|inspect}} {% for d in t.items %}
  - title: {{d.title}}, url: {{d.url}}, collection: {{d.collection}}, cat: {{d.categories}}{% endfor %}
{% endfor %}

`group_by: 'categories'`
{% assign categories = every_page | group_by: 'categories' %}
{% for c in categories %}- {{c.name|remove:'['|remove:']'|remove:'"'|remove:' '|split:','|inspect}}{% for d in c.items %}
  - title: {{d.title}}, url: {{d.url}}, collection: {{d.collection}}, tags: {{d.tags}}
{% endfor %}
{% endfor %}

Articles by tags

<h1>Articles by tag: {{ page.tag }}</h1>
<div>
    {% if site.tags[page.tag] %}
        {% for post in site.tags[page.tag] %}
            <a href="{{ post.url }}/">{{ post.title }}</a>
        {% endfor %}
    {% else %}
        <p>There are no posts for this tag.</p>
    {% endif %}
</div>

Search categories

{% for category in site.categories %}
  {% assign nposts = category | last | size %}
  <div class="collection" data-name="{{ category | first | escape }}" hidden>
    <h1>{{ category | first }}</h1>
    <h2>{{ nposts }} post{% if nposts != 1 %}s{% endif %}</h2>
    <ul>
      {% for posts in category %}
        {% for post in posts %}
          {% if post.title %}
            <li><a href="{{ post.url }}">{{ post.title }}</a></li>
          {% endif %}
        {% endfor %}
      {% endfor %}
    </ul>
  </div>
{% endfor %}
  1. The user searches for something, visiting /search.html?tag=foo for example;
  2. Some JavaScript parses the GET parameters for either a tag or a category parameter, storing the value;
  3. The list of .collection containers is searched, and a container is showed (remove hidden attribute) if it’s data-name property match the value of the search parameter.

@petrosh
Copy link
Owner Author

petrosh commented Jan 27, 2017

Submodules

Examples

git submodule add https://github.com/petrosh/submodules-posts _posts
git submodule update --remote --merge
git commit -am "ok" && git push

@petrosh
Copy link
Owner Author

petrosh commented Feb 28, 2017

For loops

Reverse loop

{% assign array = include.file_name | split: '/' | reverse %}

Indexes

{% for i in (1..10) %}
- `i` – {{ i }}
- `length` – {{ forloop.length }}
- `index` – {{ forloop.index }}
- `index0` – {{ forloop.index0 }}
- `rindex` – {{ forloop.rindex }}
- `rindex0` – {{ forloop.rindex0 }}
- `first` – {{ forloop.first }}
- `last` – {{ forloop.last }}
{% endfor %}

Display unless last item

{% unless forloop.last %}something{% endunless %} 

Optionals arguments

  • limit:<INTEGER> lets you restrict how many items you get.
  • offset:<INTEGER> lets you start the collection with the nth item.
  • reversed iterates over the collection from last to first.

Index for nested loops

{% assign marker_index = 0 %}
{% for m in markers %}
    {% for l in m.locations %}
	{% capture marker_index %}{{ marker_index | plus: 1 }}{% endcapture %}
    {% endfor %}
{% endfor %}

No items

{% for item in items %}
  {{ item.title }}
{% else %}
  There are no items!
{% endfor %}

@petrosh
Copy link
Owner Author

petrosh commented Mar 3, 2017

Dates

Updated page date and time

Updated {{ site.time | date_to_rfc822 }}
timezone: Europe/Rome

Updated Thu, 05 Apr 2018 12:58:55 +0200

Updated repository

{% assign updated = site.github.public_repositories | where: "html_url", site.github.repository_url | first | map: "updated_at" | first | date_to_xmlschema %}
{{ updated }}

2020-04-13T11:51:25+00:00

Assign a date

{% assign default_date = 'now' | date: '%FT%X' %}

site.time

The current time (when you run the jekyll command).

  • online: 2017-01-20 13:30:33 +0000
  • local: 2017-01-20 14:30:33 +0100

jekyll-liquid-date-formatting-examples

<!-- Whitespace added for readability -->
{% assign d = page.date | date: "%-d"  %}
{{ page.date | date: "%B" }} 
{% case d %}
  {% when '1' or '21' or '31' %}{{ d }}st
  {% when '2' or '22' %}{{ d }}nd
  {% when '3' or '23' %}{{ d }}rd
  {% else %}{{ d }}th
  {% endcase %}, 
{{ page.date | date: "%Y" }}

Article minutes read

{{ content | number_of_words | divided_by: 225 | round }} minute read

Date format

  • %a - Abbreviated weekday Sun
  • %A - Full weekday name Sunday
  • %b - Abbreviated month name Jan
  • %B - Full month name January
  • %c - Preferred local date and time representation Fri Jan 29 11:16:09 2016
  • %d - Day of the month, zero-padded 05
  • %-d - Day of the month 5
  • %D - Formats the date 29/01/16
  • %e - Day of the month 3
  • %F - Returns the date in ISO 8601 format 2016-01-29
  • %H - Hour of the day, 24-hour clock 07
  • %I - Hour of the day, 12-hour clock 04
  • %j - Day of the year 017
  • %k - Hour of the day, 24-hour clock 7
  • %m - Month of the year 04
  • %M - Minute of the hour 09
  • %p - Meridian indicator uppercase AM
  • %P - Meridian indicator lowercase pm
  • %r - 12-hour time 01:31:43 PM
  • %R - 24-hour time 18:09
  • %T - 24-hour time with seconds 18:09:13
  • %s - Number of seconds since 1970-01-01 00:00:00 UTC 1452355261
  • %S - Second of the minute 05
  • %U - Week number of the current year, starting with the first Sunday as the first day of the first - week 03
  • %W - Week number of the current year, starting with the first Monday as the first day of the first - week 09
  • %w - Day of the week. Sunday is 0 4
  • %x - Preferred representation for the date 05/11/15
  • %X - Preferred representation for the time 17:15:31
  • %y - Year without a century 16
  • %Y - Year with a century 2016
  • %Z - Time zone name PST
  • %% - Literal - % character %

@petrosh
Copy link
Owner Author

petrosh commented Jun 14, 2017

CSS

<style media="screen" type="text/css">
  {%- capture inline_css -%}{% include page/inline.sass %}{%- endcapture -%}
  {{ inline_css | sassify }}
</style>

Set CSS styles in configuration

_config.yaml

colors:
  - link_color: "#4078c0"

style.sass

---

---
$links_color: {% for c in site.colors %}{{c.link_color}}{% endfor %}

Include and sassify

<!--
	Include SASS from _inculdes and sassify to CSS
-->
<style type="text/css">
{% capture include_to_sassify %}{% include maps/2d.sass %}{% endcapture %}
{{ include_to_sassify | sassify }}
</style>

@petrosh
Copy link
Owner Author

petrosh commented Aug 26, 2017

Themes

Remote theme

Remote themes in the form of OWNER/REPOSITORY must represent a GitHub-hosted, Gem-based Jekyll theme.

Options

If you don't specify a Git ref, the master branch will be used.
You may also optionally specify the Git ref to use by appending an @.

  1. branch
  2. tag
  3. commit

Examples

Issues

  1. No _data folder
    • navbar: No navbar and no login use collections or _config
    • examples like calendars or objects: use front matter?
  2. assets/pages is present
    • Use collections? But in config you need collections and defaults
    • README.md has permalink: / but still see assets/pages/index.md
  3. Theme switcher seems not working
    • Can't find http://petrosh.it/assets/css/basic_light_serif.css
  4. _config is bloated
    • Can we find another place for assets-versions?
remote_theme: owner/name

Create new

You will pack these files: (assets|_layouts|_includes|_sass|LICENSE|README)

jekyll new-theme jekyll-any-theme

Css

_sass
├── jekyll-theme-awesome.scss
@import "{{ site.theme }}";

Screenshot

/screenshot.png You can also include this screenshot within your theme’s documentation where it can be retrieved programmatically.

Push

  1. Push on GitHub to preview
  2. gem build jekyll-any-theme.gemspec
    and got
    WARNING:  no description specified
    WARNING:  See http://guides.rubygems.org/specification-reference/ for help
    Successfully built RubyGem
    Name: jekyll-any-theme
    Version: 0.1.0
    File: jekyll-any-theme-0.1.0.gem
    
    then added spec.description = "Jekyll any theme – Customizable Bootstrap 4"
    Just wow
    WARNING:  description and summary are identical
    WARNING:  See http://guides.rubygems.org/specification-reference/ for help
    Successfully built RubyGem
    Name: jekyll-any-theme
    Version: 0.1.1
    File: jekyll-any-theme-0.1.1.gem
    
  3. gem push jekyll-any-theme-*.gem
    and got
    Signed in.
    Pushing gem to https://rubygems.org...
    Successfully registered gem: jekyll-any-theme (0.1.0)
    
    and then gem push jekyll-any-theme-0.1.1.gem and got
    Pushing gem to https://rubygems.org...
    Successfully registered gem: jekyll-any-theme (0.1.1)
    
    because description = "Much longer explanation of the example!" with %q{ ... } too.

To release a new version of your theme, update the version number in the gemspec file jekyll-any-theme.gemspec

Links

Examples

  • minima
  • minimal mistake
  • whiteglass
    • Need mobile check
    .wrapper { max-width: calc(1200px - (30px * 2)); }
    site-header, .site-footer {
      background: antiquewhite;
    }
    aside.sidebar {
      overflow: hidden;
      width: 260px;
      padding: 1.2em 20px 20px;
      background: none;
      clear: none;
      float: right;
      margin: 0 0 0 -100%;
    }
    article.post {
      margin-right: 300px;
      overflow: visible;
    }
    <div class="wrapper">
      <aside class="sidebar"></aside>
      <article class="post"></article>
    </div>
    schermata 2017-08-26 alle 16 37 03
  • marat
  • bootstrap
  • octopress flat

@petrosh petrosh mentioned this issue Nov 7, 2017
@petrosh
Copy link
Owner Author

petrosh commented Nov 30, 2017

JSONIFY

---
layout: nil
---
[
{% for post in site.posts %}
  {
    "title"    : "{{ post.title }}",
    "url"     : "{{ post.url }}",
    "date"     : "{{ post.date | date: "%B %d, %Y" }}",
    "content"  : "{{ post.content | escape }}"
  }{% unless forloop.last %},{% endunless %}
{% endfor %}
] 

API

List

<h1 class="page-heading">Products</h1>
<ul class="post-list">
    {% for p in site.data.products %}
    <li>{{ p.name }} at {{p.price}}</li>
    {% endfor %}      
</ul>

products.json

---
layout: null
---
{{ site.data.products | jsonify }}

Filter

products.qty.json supports a sorted by qty list, with highest first:

---
layout: null
---
{{ site.data.products | sort: "qty" | reverse | jsonify }}

@petrosh
Copy link
Owner Author

petrosh commented Feb 25, 2018

Update

  • If you aren’t running the latest version, run this command gem update jekyll.

Today

  1. Update rvm
    rvm get stable
  2. Update all gemsrvm
    rvm gemset update > Error ruby_dep requires Ruby version >= 2.2.5, ~> 2.2
  3. Update Ruby
    rvm upgrade 2.5.0 > Are you sure you wish to upgrade from ruby-2.1.0 to ruby-2.4.1? (Y/n): y
    😴
  4. Back to point 2.
  5. sudo gem update

Then the golden moment

  1. rvm use ruby-2.4.1
  2. bundle install
  3. jekyll s

Autoprefixer drama

  1. Add gem 'jekyll-autoprefixer' in Gemfile
  2. Run bundle
  3. Add plugins: jekyll-autoprefixer in _config
  4. jekyll s

@trasparente
Copy link
Collaborator

trasparente commented Jan 5, 2022

CSV and Tables

Table from CSV data files.

{%- if include.file == nil or include.file == '' -%}
Missing `file="..."`
{%- else -%}
{%- if site.data[include.file].first == nil -%}
`{{ include.file }}` is not CSV
{%- else -%}
{% for item in site.data[include.file] %}{% if forloop.first %}|{% for head in item %}{{ head[0] }}|{% endfor %}
|{% for head in item %}:---|{% endfor %}
{% endif %}|{% for value in item %}{{ value[1] }}|{% endfor %}
{% endfor %}
{%- endif -%}
{%- endif -%}

Table from Page Front Matter

---
title: Home
table:
  -
    date: 2020-01-02
    header: value
    num: 3
    "%": 3
  -
    date: 2023-01-02
    header: ciro
    num: 54
    "%": 54
---

@trasparente
Copy link
Collaborator

trasparente commented Jan 13, 2023

Posts properties

site.posts:
  "date": "2023-01-13 00:00:00 +0100",
  "id / url": "/2023/01/13/colors",
  "title": "Colors",
  "slug": "colors",
  "ext": ".md",
  "collection": "posts",
  "layout": "default",
  "categories": [],
  "tags": [],
  "draft": false,
  "excerpt": "{html}",
  "content": "{html}"
  "relative_path / path": "_posts/2023-01-13-colors.md"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants