14 |
--------------------------------------------------------------------------------
/_data/map.yml:
--------------------------------------------------------------------------------
1 | -
2 | en: index.html
3 | es: es/index.html
4 | de: de/index.html
5 | -
6 | en: en/_posts/2017-05-09-example-post.md
7 | es: es/_posts/2017-05-09-post-ejemplo.md
8 | de: de/_posts/2017-05-09-beispiel-post.md
9 | -
10 | en: en/subcategory1/index.md
11 | es: es/subcategoria1/index.md
12 | de: de/unterkategorie1/index.md
13 | -
14 | en: en/subcategory1/_posts/
15 | es: es/subcategoria1/_posts/
16 | de: de/unterkategorie1/_posts/
17 | -
18 | en: en/subcategory1/_posts/2017-05-10-post-in-subdirectory.md
19 | es: es/subcategoria1/_posts/2017-05-10-post-en-subdirectorio.md
20 | de: de/unterkategorie1/_posts/2017-05-10-post-in-unterkategorie.md
21 |
--------------------------------------------------------------------------------
/_includes/alternate.html:
--------------------------------------------------------------------------------
1 | {%comment%} check for the presence of the path in an array of paths. {%endcomment%}
2 |
3 | {% for block in site.data.map %}
4 | {% for item in block[page.lang] %}
5 | {% if item == page.path %}
6 | {% for trans in block %}
7 | {% assign trans_path = trans[1] %}
8 |
9 | {% assign posts = site.posts | where:"path",trans_path %}
10 | {% for item in posts %}
11 |
12 | {% endfor %}
13 |
14 | {% assign pages = site.pages | where:"path",trans_path %}
15 | {% for item in pages %}
16 |
17 | {% endfor %}
18 | {% endfor %}
19 | {% endif %}
20 | {% endfor %}
21 | {% endfor %}
22 |
--------------------------------------------------------------------------------
/en/_posts/2017-05-09-example-post.md:
--------------------------------------------------------------------------------
1 | ---
2 | description: The meta description of the post.
3 | ---
4 |
5 | This is an example post.
6 |
7 | > A "Hello, World!" program is a computer program that outputs or
8 | > displays "Hello, World!" to a user. Being a very simple program in
9 | > most programming languages, it is often used to illustrate the basic
10 | > syntax of a programming language for a working program.[1] It is often
11 | > the very first program people write when they are new to a language.
12 | >
13 | >
14 | {: class="blockquote" cite="https://en.wikipedia.org/wiki/%22Hello,_World!%22_program"}
15 |
16 |
--------------------------------------------------------------------------------
/de/_posts/2017-05-09-beispiel-post.md:
--------------------------------------------------------------------------------
1 | ---
2 | description: Die Meta-Beschreibung der Post.
3 | ---
4 |
5 | Dies ist ein Beispielpfosten.
6 |
7 | > Ein Hallo-Welt-Programm ist ein kleines Computerprogramm, das auf
8 | > möglichst einfache Weise zeigen soll, welche Anweisungen oder
9 | > Bestandteile für ein vollständiges Programm in einer
10 | > Programmiersprache benötigt werden, und somit einen ersten Einblick
11 | > in die Syntax gibt. Aufgabe des Programms ist, den Text Hallo Welt!
12 | > oder auf Englisch Hello World! auszugeben. Wegen der einfachen
13 | > Aufgabenstellung eignen sich solche Programme insbesondere für
14 | > didaktische Zwecke. Deshalb wird es in vielen
15 | > Programmier-Lehrbüchern als Einsteigerprogramm verwendet.
16 | >
17 | >
18 | {: class="blockquote" cite="https://de.wikipedia.org/wiki/Hallo-Welt-Programm"}
19 |
--------------------------------------------------------------------------------
/es/_posts/2017-05-09-post-ejemplo.md:
--------------------------------------------------------------------------------
1 | ---
2 | description: La meta descripción de la publicación.
3 | ---
4 |
5 | Post de ejemplo
6 |
7 | > En informática, un programa Hola mundo es el que imprime el texto «¡Hola, mundo!» en un dispositivo de visualización, en la mayoría de los casos una pantalla de monitor. Este programa suele ser usado como introducción al estudio de un lenguaje de programación, siendo un primer ejercicio típico, y se considera fundamental desde el punto de vista didáctico.
8 | >
9 | > En algunos lenguajes, configurar un conjunto de herramientas básicas completo desde cero hasta el punto en que los programas triviales puedan ser compilados y ejecutados involucra una cantidad de trabajo sustancial. Por esta razón, generalmente es usado un programa muy simple para probar un nuevo conjunto de herramientas.
10 | >
11 | >
12 | {: class="blockquote" cite="https://es.wikipedia.org/wiki/Hola_mundo"}
13 |
--------------------------------------------------------------------------------
/_includes/breadcrumbs.html:
--------------------------------------------------------------------------------
1 | {% assign categories = include.path | split:"/" %}
2 | {% assign filename_without_extension = categories | last | split:"." | first %}
3 | {% if categories contains "_posts" or filename_without_extension == "index" %}
4 | {% comment %} posts are like /docs/python/_posts/2016-06-06-foobar.md {% endcomment %}
5 | {% comment %} OR pages are index.* i.e.: like /docs/python/index.md or index.html {% endcomment %}
6 | {% assign categories = categories | pop %}
7 | {% endif %}
8 |
9 | {% assign route="" %}
10 |
11 |
12 |
68 |
69 |
83 |
84 |
85 |
86 |
87 |
88 |
89 |
90 |
--------------------------------------------------------------------------------
/docs/feed.xml:
--------------------------------------------------------------------------------
1 | Jekyll2019-06-26T19:05:27-03:00https://marcanuy.github.io/jekyll-skeleton/feed.xmlmarcanuyPost In Unterkategorie2017-05-10T00:00:00-03:002017-05-10T00:00:00-03:00https://marcanuy.github.io/jekyll-skeleton/de/unterkategorie1/post-in-unterkategorie{"picture"=>"/assets/img/marcanuy.png", "twitter"=>"marcanuy"}Post In Subdirectory2017-05-10T00:00:00-03:002017-05-10T00:00:00-03:00https://marcanuy.github.io/jekyll-skeleton/en/subcategory1/post-in-subdirectory{"picture"=>"/assets/img/marcanuy.png", "twitter"=>"marcanuy"}Post En Subdirectorio2017-05-10T00:00:00-03:002017-05-10T00:00:00-03:00https://marcanuy.github.io/jekyll-skeleton/es/subcategoria1/post-en-subdirectorio{"picture"=>"/assets/img/marcanuy.png", "twitter"=>"marcanuy"}Beispiel Post2017-05-09T00:00:00-03:002017-05-09T00:00:00-03:00https://marcanuy.github.io/jekyll-skeleton/de/beispiel-post<p>Dies ist ein Beispielpfosten.</p>
2 |
3 | <blockquote class="blockquote" cite="https://de.wikipedia.org/wiki/Hallo-Welt-Programm">
4 | <p>Ein Hallo-Welt-Programm ist ein kleines Computerprogramm, das auf
5 | möglichst einfache Weise zeigen soll, welche Anweisungen oder
6 | Bestandteile für ein vollständiges Programm in einer
7 | Programmiersprache benötigt werden, und somit einen ersten Einblick
8 | in die Syntax gibt. Aufgabe des Programms ist, den Text Hallo Welt!
9 | oder auf Englisch Hello World! auszugeben. Wegen der einfachen
10 | Aufgabenstellung eignen sich solche Programme insbesondere für
11 | didaktische Zwecke. Deshalb wird es in vielen
12 | Programmier-Lehrbüchern als Einsteigerprogramm verwendet.</p>
13 |
14 | <footer class="blockquote-footer"> <cite>Hallo-Welt-Programm <a href="https://de.wikipedia.org/wiki/Hallo-Welt-Programm">Wikipedia</a></cite></footer>
15 | </blockquote>{"picture"=>"/assets/img/marcanuy.png", "twitter"=>"marcanuy"}Dies ist ein Beispielpfosten.Example Post2017-05-09T00:00:00-03:002017-05-09T00:00:00-03:00https://marcanuy.github.io/jekyll-skeleton/en/example-post<p>This is an example post.</p>
16 |
17 | <blockquote class="blockquote" cite="https://en.wikipedia.org/wiki/%22Hello,_World!%22_program">
18 | <p>A “Hello, World!” program is a computer program that outputs or
19 | displays “Hello, World!” to a user. Being a very simple program in
20 | most programming languages, it is often used to illustrate the basic
21 | syntax of a programming language for a working program.[1] It is often
22 | the very first program people write when they are new to a language.</p>
23 |
24 | <footer class="blockquote-footer"> <cite>"Hello, World!" program <a href="https://en.wikipedia.org/wiki/%22Hello,_World!%22_program">from Wikipedia</a></cite></footer>
25 | </blockquote>{"picture"=>"/assets/img/marcanuy.png", "twitter"=>"marcanuy"}This is an example post.Post Ejemplo2017-05-09T00:00:00-03:002017-05-09T00:00:00-03:00https://marcanuy.github.io/jekyll-skeleton/es/post-ejemplo<p>Post de ejemplo</p>
26 |
27 | <blockquote class="blockquote" cite="https://es.wikipedia.org/wiki/Hola_mundo">
28 | <p>En informática, un programa Hola mundo es el que imprime el texto «¡Hola, mundo!» en un dispositivo de visualización, en la mayoría de los casos una pantalla de monitor. Este programa suele ser usado como introducción al estudio de un lenguaje de programación, siendo un primer ejercicio típico, y se considera fundamental desde el punto de vista didáctico.</p>
29 |
30 | <p>En algunos lenguajes, configurar un conjunto de herramientas básicas completo desde cero hasta el punto en que los programas triviales puedan ser compilados y ejecutados involucra una cantidad de trabajo sustancial. Por esta razón, generalmente es usado un programa muy simple para probar un nuevo conjunto de herramientas.</p>
31 |
32 | <footer class="blockquote-footer"> <cite>Hola mundo <a href="https://en.wikipedia.org/wiki/%22Hello,_World!%22_program">en Wikipedia</a></cite></footer>
33 | </blockquote>{"picture"=>"/assets/img/marcanuy.png", "twitter"=>"marcanuy"}Post de ejemplo
--------------------------------------------------------------------------------
/docs/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
82 |
83 |
84 |
85 | Homepage example | Jekyll Skeleton
86 |
87 |
88 |
89 |
Dies ist eine einfache Heldeneinheit, eine einfache Jumbotron-Komponente Um zusätzliche Aufmerksamkeit auf vorgestellten Inhalt oder Informationen zu rufen.
149 |
150 |
Es nutzt Gebrauchsklassen für Typografie und Abstand zum Raum Inhalt innerhalb des größeren Containers.
Se trata de una unidad de héroe simple, un componente simple jumbotron-estilo para llamar la atención adicional al contenido ofrecido o a la información.
149 |
150 |
Utiliza clases de utilidad para la tipografía y espaciamiento al espacio contenido en el contenedor más grande.
A “Hello, World!” program is a computer program that outputs or
160 | displays “Hello, World!” to a user. Being a very simple program in
161 | most programming languages, it is often used to illustrate the basic
162 | syntax of a programming language for a working program.[1] It is often
163 | the very first program people write when they are new to a language.
Ein Hallo-Welt-Programm ist ein kleines Computerprogramm, das auf
160 | möglichst einfache Weise zeigen soll, welche Anweisungen oder
161 | Bestandteile für ein vollständiges Programm in einer
162 | Programmiersprache benötigt werden, und somit einen ersten Einblick
163 | in die Syntax gibt. Aufgabe des Programms ist, den Text Hallo Welt!
164 | oder auf Englisch Hello World! auszugeben. Wegen der einfachen
165 | Aufgabenstellung eignen sich solche Programme insbesondere für
166 | didaktische Zwecke. Deshalb wird es in vielen
167 | Programmier-Lehrbüchern als Einsteigerprogramm verwendet.
En informática, un programa Hola mundo es el que imprime el texto «¡Hola, mundo!» en un dispositivo de visualización, en la mayoría de los casos una pantalla de monitor. Este programa suele ser usado como introducción al estudio de un lenguaje de programación, siendo un primer ejercicio típico, y se considera fundamental desde el punto de vista didáctico.
160 |
161 |
En algunos lenguajes, configurar un conjunto de herramientas básicas completo desde cero hasta el punto en que los programas triviales puedan ser compilados y ejecutados involucra una cantidad de trabajo sustancial. Por esta razón, generalmente es usado un programa muy simple para probar un nuevo conjunto de herramientas.
271 |
272 |
359 |
360 |
361 |
362 |
363 |
364 |
365 |
366 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | jekyll-skeleton
2 | ===============
3 |
4 | [](https://travis-ci.org/marcanuy/jekyll-skeleton)
5 |
6 | Jekyll scaffolding to start new websites.
7 |
8 |
9 | **Table of Contents**
10 |
11 | - [jekyll-skeleton](#jekyll-skeleton)
12 | - [Overview](#overview)
13 | - [Features](#features)
14 | - [Design Philosophy](#design-philosophy)
15 | - [Commands](#commands)
16 | - [Install](#install)
17 | - [Serve](#serve)
18 | - [Usage](#usage)
19 | - [Adding a new language](#adding-a-new-language)
20 | - [Adding posts](#adding-posts)
21 | - [Plugins](#plugins)
22 | - [Final structure](#final-structure)
23 | - [Questions](#questions)
24 | - [Screenshots](#screenshots)
25 | - [English homepage](#english-homepage)
26 | - [Spanish homepage](#spanish-homepage)
27 | - [German post](#german-post)
28 |
29 |
30 |
31 | # Overview
32 |
33 | This is a basic Jekyll site created with `jekyll new --blank` (without
34 | themes, or example posts) to serve as a starting point for any
35 | website.
36 |
37 | Its purpose is to quickly start new websites cloning this repo and
38 | customizing to your needs, having already all the features I was
39 | adding and configuring every time I created a new Jekyll instance.
40 |
41 | Live demo looks so "*minimalistic*" because it does not use any theme
42 | and its only goal is to show the design of the website navigation and
43 | how to add posts/categories.
44 |
45 | Its structure uses the design described
46 | in
47 | [How To Add Bootstrap 4 To Jekyll The Right Way](https://simpleit.rocks/how-to-add-bootstrap-4-to-jekyll-the-right-way/),
48 | [Multilingual Jekyll Without Plugins](https://simpleit.rocks/multilingual-jekyll-without-plugins/) and
49 | [How To Implement Breadcrumbs On A Jekyll Site With Nested Categories](https://simpleit.rocks/how-to-create-breadcrumbs-with-hierarchical-categories-in-jekyll/)
50 | articles
51 | applied on a blank Jekyll instance with the suggestions provided by
52 | the plugins below.
53 |
54 | Just clone this repo and start building yours.
55 |
56 | git clone git@github.com:marcanuy/jekyll-skeleton.git
57 |
58 | # Features
59 |
60 | - Automatically generates at each jekyll build:
61 | - compliant sitemap at `/sitemap.xml`
62 | - [Atom](https://tools.ietf.org/html/rfc4287) feed at
63 | `/feed.xml`.
64 | - [SASS](http://sass-lang.com/) and easy customization of Bootstrap 4
65 | variables in `/assets/main.scss` and `/_sass/_variables.scss`.
66 | - Automatically adds metadata tags for Search Engines and Social
67 | Networks
68 | - Page title, with site title or description appended
69 |
70 |
71 | ...
72 |
73 |
74 | - Page description
75 |
76 |
77 |
78 |
79 |
80 | - Canonical URL
81 |
82 |
83 |
84 | - Next and previous URLs on paginated pages
85 | - JSON-LD Site and post metadata for richer indexing
86 |
87 |
88 |
94 |
95 | - Open Graph title, description, site title, and URL (for Facebook,
96 | LinkedIn, etc.)
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 | - Twitter Summary Card metadata
108 |
109 |
110 |
111 |
112 |
113 | - Multilanguage
114 | - Language navigation menu for each page to all the other
115 | translation versions
116 |
117 |
118 |
119 |
120 |
121 | - [Alternate link elements](https://www.w3.org/TR/html5/links.html#rel-alternate) in the `head` section of HTML
122 |
123 |
124 |
125 |
126 |
127 | - Redirects from default language subfolder to site homepage (`/en` -> `/`)
128 | - [Breadcrumbs](https://www.w3.org/TR/html5/common-idioms.html#rel-up) for pages and posts
129 |
130 |
131 |
132 |
139 |
140 |
141 | # Design Philosophy
142 |
143 | **jekyll-skeleton** has been built with the following principles in
144 | mind:
145 |
146 | - Uses [Yarn](https://github.com/yarnpkg/yarn) to manage libraries, assets, and utilities.
147 | - Bootstrap 4.
148 | - Font Awesome.
149 | - Gem theme independent.
150 | - Optimized for multilanguage.
151 | - Follows `jekyll-seo-tag` usage suggestions.
152 |
153 | # Commands
154 |
155 | ## Install
156 |
157 | ~~~ bash
158 | git clone https://github.com/marcanuy/jekyll-skeleton
159 | cd jekyll-seleton
160 | make install
161 | ~~~
162 |
163 | ## Serve
164 |
165 | ~~~ bash
166 | make serve
167 | ~~~
168 |
169 | # Usage
170 |
171 | ## Adding a new language
172 |
173 | Add the language to `_config.yml`:
174 |
175 | defaults:
176 | #languages
177 | -
178 | scope:
179 | path: ""
180 | values:
181 | lang: "en"
182 | layout: default
183 | -
184 | scope:
185 | path: "es"
186 | values:
187 | lang: "es"
188 |
189 | Its name to `_data/locales.yml` and an equivalent to each page in the
190 | language in `/_data/map.yml`:
191 |
192 | -
193 | en: index.html
194 | es: es/index.html
195 | -
196 | en: about.html
197 | es: es/acerca.html
198 |
199 | ## Adding posts
200 |
201 | Add a post in each language located in the language subdirectory:
202 | `/en`, `es`, etc.
203 |
204 | The following properties in posts front-matter are used:
205 |
206 | ---
207 | title: # jekyll-seo-tag - The title of the post, page, or document
208 | description: # jekyll-seo-tag - A short description of the page's content
209 | image: # jekyll-seo-tag - URL to an image associated with the post, page, or document (e.g., /assets/page-pic.jpg)
210 | author: # jekyll-seo-tag - Page-, post-, or document-specific author information (see below)
211 | lang: # jekyll-seo-tag - Page-, post-, or document-specific language information
212 | ---
213 |
214 | # Plugins
215 |
216 | *Jekyll-skeleton* uses the following plugins:
217 |
218 | - A liquid filter plugin
219 | for Jekyll which generates a table of contents.
220 | - Jekyll plugin to silently
221 | generate a sitemaps.org compliant sitemap for your Jekyll site.
222 | - Test your rendered HTML
223 | files to make sure they're accurate.
224 | - A Jekyll plugin to generate
225 | an Atom (RSS-like) feed of your Jekyll posts
226 | - Specify multiple
227 | redirections URLs for pages and posts.
228 |
229 | If you want to host a site derived from this repo in Github, you can
230 | follow this guide: [Automated Deployment Of Jekyll Websites To Github Pages With A Git Push To Github ](https://simpleit.rocks/automated-deployment-of-jekyll-websites-to-github-pages-with-a-git-push-to-github/).
231 |
232 | # Final structure
233 |
234 |
235 |
236 | $make build
237 | rm -fr _site/
238 | rm -fr assets/vendor/ #from yarn
239 | rm -fr assets/fonts #fontawesome dependency
240 | rm -fr .sass_cache
241 | bundle install --path vendor/bundler
242 | Warning: the running version of Bundler (1.13.6) is older than the version that created the lockfile (1.15.0). We suggest you upgrade to the latest version of Bundler by running `gem install bundler`.
243 | Using concurrent-ruby 1.0.5
244 | Using i18n 0.8.1
245 | Using minitest 5.10.2
246 | Using thread_safe 0.3.6
247 | Using public_suffix 2.0.5
248 | Using colorator 1.1.0
249 | Using colored 1.2
250 | Using ffi 1.9.18
251 | Using forwardable-extended 2.6.0
252 | Using mercenary 0.3.6
253 | Using mini_portile2 2.1.0
254 | Using parallel 1.11.2
255 | Using yell 2.0.7
256 | Using sass 3.4.24
257 | Using rb-fsevent 0.9.8
258 | Using kramdown 1.13.2
259 | Using liquid 3.0.6
260 | Using rouge 1.11.1
261 | Using safe_yaml 1.0.4
262 | Using bundler 1.13.6
263 | Using tzinfo 1.2.3
264 | Using addressable 2.5.1
265 | Using ethon 0.10.1
266 | Using rb-inotify 0.9.8
267 | Using pathutil 0.14.0
268 | Using nokogiri 1.7.2
269 | Using jekyll-sass-converter 1.5.0
270 | Using activesupport 5.1.1
271 | Using typhoeus 0.8.0
272 | Using listen 3.0.8
273 | Using jekyll-toc 0.2.1
274 | Using html-proofer 3.7.2
275 | Using jekyll-watch 1.5.0
276 | Using jekyll 3.4.3
277 | Using jekyll-feed 0.9.2
278 | Using jekyll-redirect-from 0.12.1
279 | Using jekyll-seo-tag 2.2.3
280 | Using jekyll-sitemap 1.1.1
281 | Bundle complete! 7 Gemfile dependencies, 38 gems now installed.
282 | Bundled gems are installed into ./vendor/bundler.
283 | yarn install
284 | yarn install v0.24.5
285 | [1/4] Resolving packages...
286 | success Already up-to-date.
287 | Done in 0.38s.
288 | mkdir -p assets/vendor/
289 | cp node_modules/font-awesome/css/font-awesome.min.css assets/vendor/
290 | cp -r node_modules/font-awesome/fonts assets
291 | cp node_modules/jquery/dist/jquery.min.js assets/vendor/
292 | cp node_modules/tether/dist/js/tether.min.js assets/vendor/
293 | cp node_modules/bootstrap/dist/js/bootstrap.min.js assets/vendor/
294 | bundle exec jekyll build
295 | Configuration file: /tmp/jekyll-skeleton/_config.yml
296 | Source: /tmp/jekyll-skeleton
297 | Destination: /tmp/jekyll-skeleton/_site
298 | Incremental build: disabled. Enable with --incremental
299 | Generating...
300 | done in 5.474 seconds.
301 | Auto-regeneration: disabled. Use --watch to enable.
302 |
303 | $tree -L 3 _site/
304 | _site/
305 | ├── assets
306 | │ ├── fonts
307 | │ │ ├── FontAwesome.otf
308 | │ │ ├── fontawesome-webfont.eot
309 | │ │ ├── fontawesome-webfont.svg
310 | │ │ ├── fontawesome-webfont.ttf
311 | │ │ ├── fontawesome-webfont.woff
312 | │ │ └── fontawesome-webfont.woff2
313 | │ ├── main.css
314 | │ └── vendor
315 | │ ├── bootstrap.min.js
316 | │ ├── font-awesome.min.css
317 | │ ├── jquery.min.js
318 | │ └── tether.min.js
319 | ├── de
320 | │ ├── beispiel-post.html
321 | │ ├── index.html
322 | │ └── unterkategorie1
323 | │ ├── index.html
324 | │ └── post-in-unterkategorie.html
325 | ├── deploy_key.enc
326 | ├── en
327 | │ ├── example-post.html
328 | │ ├── index.html
329 | │ └── subcategory1
330 | │ ├── index.html
331 | │ └── post-in-subdirectory.html
332 | ├── es
333 | │ ├── index.html
334 | │ ├── post-ejemplo.html
335 | │ └── subcategoria1
336 | │ ├── index.html
337 | │ └── post-en-subdirectorio.html
338 | ├── feed.xml
339 | ├── index.html
340 | ├── LICENSE
341 | ├── package.json
342 | ├── README.md
343 | ├── robots.txt
344 | ├── sitemap.xml
345 | └── yarn.lock
346 |
347 | 9 directories, 32 files
348 |
349 | $make check
350 | bundle exec jekyll doctor
351 | Configuration file: /tmp/jekyll-skeleton/_config.yml
352 | Your test results are in. Everything looks fine.
353 | bundle exec htmlproofer --check-html \
354 | --http-status-ignore 999 \
355 | --internal-domains marcanuy.github.io,localhost:4000 \
356 | --assume-extension \
357 | _site
358 | Running ["ScriptCheck", "LinkCheck", "HtmlCheck", "ImageCheck"] on ["_site"] on *.html...
359 |
360 |
361 | Checking 14 external links...
362 | Ran on 13 files!
363 |
364 |
365 | HTML-Proofer finished successfully.
366 |
367 |
368 |
369 |
370 | # Questions
371 |
372 | Feel free to open issues and/or contributing!
373 |
374 | # Screenshots
375 |
376 | ## English homepage
377 |
378 | 
379 |
380 | ## Spanish homepage
381 |
382 | 
383 |
384 | ## German post
385 |
386 | 
387 |
--------------------------------------------------------------------------------
/docs/README.md:
--------------------------------------------------------------------------------
1 | jekyll-skeleton
2 | ===============
3 |
4 | [](https://travis-ci.org/marcanuy/jekyll-skeleton)
5 |
6 | Jekyll scaffolding to start new websites.
7 |
8 |
9 | **Table of Contents**
10 |
11 | - [jekyll-skeleton](#jekyll-skeleton)
12 | - [Overview](#overview)
13 | - [Features](#features)
14 | - [Design Philosophy](#design-philosophy)
15 | - [Commands](#commands)
16 | - [Install](#install)
17 | - [Serve](#serve)
18 | - [Usage](#usage)
19 | - [Adding a new language](#adding-a-new-language)
20 | - [Adding posts](#adding-posts)
21 | - [Plugins](#plugins)
22 | - [Final structure](#final-structure)
23 | - [Questions](#questions)
24 | - [Screenshots](#screenshots)
25 | - [English homepage](#english-homepage)
26 | - [Spanish homepage](#spanish-homepage)
27 | - [German post](#german-post)
28 |
29 |
30 |
31 | # Overview
32 |
33 | This is a basic Jekyll site created with `jekyll new --blank` (without
34 | themes, or example posts) to serve as a starting point for any
35 | website.
36 |
37 | Its purpose is to quickly start new websites cloning this repo and
38 | customizing to your needs, having already all the features I was
39 | adding and configuring every time I created a new Jekyll instance.
40 |
41 | Live demo looks so "*minimalistic*" because it does not use any theme
42 | and its only goal is to show the design of the website navigation and
43 | how to add posts/categories.
44 |
45 | Its structure uses the design described
46 | in
47 | [How To Add Bootstrap 4 To Jekyll The Right Way](https://simpleit.rocks/how-to-add-bootstrap-4-to-jekyll-the-right-way/),
48 | [Multilingual Jekyll Without Plugins](https://simpleit.rocks/multilingual-jekyll-without-plugins/) and
49 | [How To Implement Breadcrumbs On A Jekyll Site With Nested Categories](https://simpleit.rocks/how-to-create-breadcrumbs-with-hierarchical-categories-in-jekyll/)
50 | articles
51 | applied on a blank Jekyll instance with the suggestions provided by
52 | the plugins below.
53 |
54 | Just clone this repo and start building yours.
55 |
56 | git clone git@github.com:marcanuy/jekyll-skeleton.git
57 |
58 | # Features
59 |
60 | - Automatically generates at each jekyll build:
61 | - compliant sitemap at `/sitemap.xml`
62 | - [Atom](https://tools.ietf.org/html/rfc4287) feed at
63 | `/feed.xml`.
64 | - [SASS](http://sass-lang.com/) and easy customization of Bootstrap 4
65 | variables in `/assets/main.scss` and `/_sass/_variables.scss`.
66 | - Automatically adds metadata tags for Search Engines and Social
67 | Networks
68 | - Page title, with site title or description appended
69 |
70 |
71 | ...
72 |
73 |
74 | - Page description
75 |
76 |
77 |
78 |
79 |
80 | - Canonical URL
81 |
82 |
83 |
84 | - Next and previous URLs on paginated pages
85 | - JSON-LD Site and post metadata for richer indexing
86 |
87 |
88 |
94 |
95 | - Open Graph title, description, site title, and URL (for Facebook,
96 | LinkedIn, etc.)
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 | - Twitter Summary Card metadata
108 |
109 |
110 |
111 |
112 |
113 | - Multilanguage
114 | - Language navigation menu for each page to all the other
115 | translation versions
116 |
117 |
118 |
119 |
120 |
121 | - [Alternate link elements](https://www.w3.org/TR/html5/links.html#rel-alternate) in the `head` section of HTML
122 |
123 |
124 |
125 |
126 |
127 | - Redirects from default language subfolder to site homepage (`/en` -> `/`)
128 | - [Breadcrumbs](https://www.w3.org/TR/html5/common-idioms.html#rel-up) for pages and posts
129 |
130 |
131 |
132 |
139 |
140 |
141 | # Design Philosophy
142 |
143 | **jekyll-skeleton** has been built with the following principles in
144 | mind:
145 |
146 | - Uses [Yarn](https://github.com/yarnpkg/yarn) to manage libraries, assets, and utilities.
147 | - Bootstrap 4.
148 | - Font Awesome.
149 | - Gem theme independent.
150 | - Optimized for multilanguage.
151 | - Follows `jekyll-seo-tag` usage suggestions.
152 |
153 | # Commands
154 |
155 | ## Install
156 |
157 | ~~~ bash
158 | git clone https://github.com/marcanuy/jekyll-skeleton
159 | cd jekyll-seleton
160 | make install
161 | ~~~
162 |
163 | ## Serve
164 |
165 | ~~~ bash
166 | make serve
167 | ~~~
168 |
169 | # Usage
170 |
171 | ## Adding a new language
172 |
173 | Add the language to `_config.yml`:
174 |
175 | defaults:
176 | #languages
177 | -
178 | scope:
179 | path: ""
180 | values:
181 | lang: "en"
182 | layout: default
183 | -
184 | scope:
185 | path: "es"
186 | values:
187 | lang: "es"
188 |
189 | Its name to `_data/locales.yml` and an equivalent to each page in the
190 | language in `/_data/map.yml`:
191 |
192 | -
193 | en: index.html
194 | es: es/index.html
195 | -
196 | en: about.html
197 | es: es/acerca.html
198 |
199 | ## Adding posts
200 |
201 | Add a post in each language located in the language subdirectory:
202 | `/en`, `es`, etc.
203 |
204 | The following properties in posts front-matter are used:
205 |
206 | ---
207 | title: # jekyll-seo-tag - The title of the post, page, or document
208 | description: # jekyll-seo-tag - A short description of the page's content
209 | image: # jekyll-seo-tag - URL to an image associated with the post, page, or document (e.g., /assets/page-pic.jpg)
210 | author: # jekyll-seo-tag - Page-, post-, or document-specific author information (see below)
211 | lang: # jekyll-seo-tag - Page-, post-, or document-specific language information
212 | ---
213 |
214 | # Plugins
215 |
216 | *Jekyll-skeleton* uses the following plugins:
217 |
218 | - A liquid filter plugin
219 | for Jekyll which generates a table of contents.
220 | - Jekyll plugin to silently
221 | generate a sitemaps.org compliant sitemap for your Jekyll site.
222 | - Test your rendered HTML
223 | files to make sure they're accurate.
224 | - A Jekyll plugin to generate
225 | an Atom (RSS-like) feed of your Jekyll posts
226 | - Specify multiple
227 | redirections URLs for pages and posts.
228 |
229 | If you want to host a site derived from this repo in Github, you can
230 | follow this guide: [Automated Deployment Of Jekyll Websites To Github Pages With A Git Push To Github ](https://simpleit.rocks/automated-deployment-of-jekyll-websites-to-github-pages-with-a-git-push-to-github/).
231 |
232 | # Final structure
233 |
234 |
235 |
236 | $make build
237 | rm -fr _site/
238 | rm -fr assets/vendor/ #from yarn
239 | rm -fr assets/fonts #fontawesome dependency
240 | rm -fr .sass_cache
241 | bundle install --path vendor/bundler
242 | Warning: the running version of Bundler (1.13.6) is older than the version that created the lockfile (1.15.0). We suggest you upgrade to the latest version of Bundler by running `gem install bundler`.
243 | Using concurrent-ruby 1.0.5
244 | Using i18n 0.8.1
245 | Using minitest 5.10.2
246 | Using thread_safe 0.3.6
247 | Using public_suffix 2.0.5
248 | Using colorator 1.1.0
249 | Using colored 1.2
250 | Using ffi 1.9.18
251 | Using forwardable-extended 2.6.0
252 | Using mercenary 0.3.6
253 | Using mini_portile2 2.1.0
254 | Using parallel 1.11.2
255 | Using yell 2.0.7
256 | Using sass 3.4.24
257 | Using rb-fsevent 0.9.8
258 | Using kramdown 1.13.2
259 | Using liquid 3.0.6
260 | Using rouge 1.11.1
261 | Using safe_yaml 1.0.4
262 | Using bundler 1.13.6
263 | Using tzinfo 1.2.3
264 | Using addressable 2.5.1
265 | Using ethon 0.10.1
266 | Using rb-inotify 0.9.8
267 | Using pathutil 0.14.0
268 | Using nokogiri 1.7.2
269 | Using jekyll-sass-converter 1.5.0
270 | Using activesupport 5.1.1
271 | Using typhoeus 0.8.0
272 | Using listen 3.0.8
273 | Using jekyll-toc 0.2.1
274 | Using html-proofer 3.7.2
275 | Using jekyll-watch 1.5.0
276 | Using jekyll 3.4.3
277 | Using jekyll-feed 0.9.2
278 | Using jekyll-redirect-from 0.12.1
279 | Using jekyll-seo-tag 2.2.3
280 | Using jekyll-sitemap 1.1.1
281 | Bundle complete! 7 Gemfile dependencies, 38 gems now installed.
282 | Bundled gems are installed into ./vendor/bundler.
283 | yarn install
284 | yarn install v0.24.5
285 | [1/4] Resolving packages...
286 | success Already up-to-date.
287 | Done in 0.38s.
288 | mkdir -p assets/vendor/
289 | cp node_modules/font-awesome/css/font-awesome.min.css assets/vendor/
290 | cp -r node_modules/font-awesome/fonts assets
291 | cp node_modules/jquery/dist/jquery.min.js assets/vendor/
292 | cp node_modules/tether/dist/js/tether.min.js assets/vendor/
293 | cp node_modules/bootstrap/dist/js/bootstrap.min.js assets/vendor/
294 | bundle exec jekyll build
295 | Configuration file: /tmp/jekyll-skeleton/_config.yml
296 | Source: /tmp/jekyll-skeleton
297 | Destination: /tmp/jekyll-skeleton/_site
298 | Incremental build: disabled. Enable with --incremental
299 | Generating...
300 | done in 5.474 seconds.
301 | Auto-regeneration: disabled. Use --watch to enable.
302 |
303 | $tree -L 3 _site/
304 | _site/
305 | ├── assets
306 | │ ├── fonts
307 | │ │ ├── FontAwesome.otf
308 | │ │ ├── fontawesome-webfont.eot
309 | │ │ ├── fontawesome-webfont.svg
310 | │ │ ├── fontawesome-webfont.ttf
311 | │ │ ├── fontawesome-webfont.woff
312 | │ │ └── fontawesome-webfont.woff2
313 | │ ├── main.css
314 | │ └── vendor
315 | │ ├── bootstrap.min.js
316 | │ ├── font-awesome.min.css
317 | │ ├── jquery.min.js
318 | │ └── tether.min.js
319 | ├── de
320 | │ ├── beispiel-post.html
321 | │ ├── index.html
322 | │ └── unterkategorie1
323 | │ ├── index.html
324 | │ └── post-in-unterkategorie.html
325 | ├── deploy_key.enc
326 | ├── en
327 | │ ├── example-post.html
328 | │ ├── index.html
329 | │ └── subcategory1
330 | │ ├── index.html
331 | │ └── post-in-subdirectory.html
332 | ├── es
333 | │ ├── index.html
334 | │ ├── post-ejemplo.html
335 | │ └── subcategoria1
336 | │ ├── index.html
337 | │ └── post-en-subdirectorio.html
338 | ├── feed.xml
339 | ├── index.html
340 | ├── LICENSE
341 | ├── package.json
342 | ├── README.md
343 | ├── robots.txt
344 | ├── sitemap.xml
345 | └── yarn.lock
346 |
347 | 9 directories, 32 files
348 |
349 | $make check
350 | bundle exec jekyll doctor
351 | Configuration file: /tmp/jekyll-skeleton/_config.yml
352 | Your test results are in. Everything looks fine.
353 | bundle exec htmlproofer --check-html \
354 | --http-status-ignore 999 \
355 | --internal-domains marcanuy.github.io,localhost:4000 \
356 | --assume-extension \
357 | _site
358 | Running ["ScriptCheck", "LinkCheck", "HtmlCheck", "ImageCheck"] on ["_site"] on *.html...
359 |
360 |
361 | Checking 14 external links...
362 | Ran on 13 files!
363 |
364 |
365 | HTML-Proofer finished successfully.
366 |
367 |
368 |