Andamios Jekyll para iniciar nuevos sitios web. https://marcanuy.github.io/jekyll-skeleton/
Tabla de contenido
Este es un sitio Jekyll básico creado con jekyll new --blank
(sin temas ni publicaciones de ejemplo) para que sirva como punto de partida para cualquier sitio web.
Su propósito es iniciar rápidamente nuevos sitios web clonando este repositorio y personalizándolo según sus necesidades, teniendo ya todas las funciones que agregaba y configuraba cada vez que creaba una nueva instancia de Jekyll.
La demostración en vivo parece tan " minimalista " porque no utiliza ningún tema y su único objetivo es mostrar el diseño de navegación del sitio web y cómo agregar publicaciones/categorías.
Su estructura utiliza el diseño descrito en los artículos Cómo agregar Bootstrap 4 a Jekyll de la manera correcta, Jekyll multilingüe sin complementos y Cómo implementar rutas de navegación en un sitio Jekyll con categorías anidadas aplicados en una instancia de Jekyll en blanco con las sugerencias proporcionadas por los complementos a continuación.
Simplemente clona este repositorio y comienza a construir el tuyo.
git clone [email protected]:marcanuy/jekyll-skeleton.git
Genera automáticamente en cada compilación jekyll :
/sitemap.xml
/feed.xml
. SASS y fácil personalización de las variables de Bootstrap 4 en /assets/main.scss
y /_sass/_variables.scss
.
Agrega automáticamente etiquetas de metadatos para Motores de Búsqueda y Redes Sociales
Título de la página, con título del sitio o descripción adjunta
<head>
<title>...</title>
</head>
Descripción de la página
<head>
<meta name="description" content="..."/>
</head>
URL canónica
<link rel="canonical" href="..."/>
URL siguientes y anteriores en páginas paginadas
Sitio JSON-LD y metadatos de publicaciones para una indexación más rica
<meta property="fb:app_id" content="1822851531277021"/>
<script type="application/ld+json">
{"@context": "http://schema.org",
"@type": "WebPage",
"headline": "...",
"description": "...",
"url": "..."}</script>
Título, descripción, título del sitio y URL de Open Graph (para Facebook, LinkedIn, etc.)
<meta property="og:title" content="..."/>
<meta name="description" content="..."/>
<meta property="og:description" content="..."/>
<meta property="og:url" content="..."/>
<meta property="og:site_name" content="..."/>
<meta property="og:type" content="..."/>
<meta property="article:published_time" content="..."/>
<meta property="fb:app_id" content="..."/>
Metadatos de la tarjeta de resumen de Twitter
<meta name="twitter:card" content="summary"/>
<meta name="twitter:site" content="..."/>
<meta name="twitter:creator" content="..."/>
Multilenguaje
Menú de navegación de idiomas para cada página a todas las demás versiones de traducción.
<a hreflang="es" href="http://example.com/es/foobar" />
<a hreflang="de" href="http://example.com/de/foobar" />
<a hreflang="en" href="http://example.com/en/foobar" />
Elementos de enlace alternativos en la sección head
de HTML
<link rel="alternate" hreflang="es" href="http://example.com/es" />
<link rel="alternate" hreflang="de" href="http://example.com/de" />
<link rel="alternate" hreflang="en" href="http://example.com/en" />
Redirige desde la subcarpeta de idioma predeterminado a la página de inicio del sitio ( /en
-> /
)
Rutas de navegación para páginas y publicaciones
<!-- url: /jekyll-skeleton/en/example-post -->
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/jekyll-skeleton/"><i class="fa fa-home" aria-hidden="true"></i></a></li>
<li class="breadcrumb-item ">
<a href="/jekyll-skeleton/en">en</a>
</li>
<li class="breadcrumb-item active">
Example Post
</li>
</ol>
jekyll-skeleton se ha construido teniendo en cuenta los siguientes principios:
jekyll-seo-tag
.git clone https://github.com/marcanuy/jekyll-skeleton
cd jekyll-seleton
make install
make serve
Agregue el idioma a _config.yml
:
defaults:
#languages
-
scope:
path: ""
values:
lang: "en"
layout: default
-
scope:
path: "es"
values:
lang: "es"
Su nombre es _data/locales.yml
y un equivalente a cada página en el idioma en /_data/map.yml
:
-
en: index.html
es: es/index.html
-
en: about.html
es: es/acerca.html
Agrega una publicación en cada idioma ubicada en el subdirectorio de idioma: /en
, es
, etc.
Se utilizan las siguientes propiedades en las publicaciones preliminares:
---
title: # jekyll-seo-tag - The title of the post, page, or document
description: # jekyll-seo-tag - A short description of the page's content
image: # jekyll-seo-tag - URL to an image associated with the post, page, or document (e.g., /assets/page-pic.jpg)
author: # jekyll-seo-tag - Page-, post-, or document-specific author information (see below)
lang: # jekyll-seo-tag - Page-, post-, or document-specific language information
---
Jekyll-skeleton utiliza los siguientes complementos:
Si desea alojar un sitio derivado de este repositorio en Github, puede seguir esta guía: Implementación automatizada de sitios web Jekyll en páginas de Github con un Git Push To Github.
$ hacer construir rm -fr _sitio/ rm -fr activos/proveedor/ #de hilo rm -fr activos/fuentes #fontawesome dependencia rm -es .sass_cache instalación del paquete: proveedor de ruta/paquete Advertencia: la versión en ejecución de Bundler (1.13.6) es anterior a la versión que creó el archivo de bloqueo (1.15.0). Le sugerimos que actualice a la última versión de Bundler ejecutando "gem install bundler". Usando concurrente-ruby 1.0.5 Usando i18n 0.8.1 Usando minitest 5.10.2 Usando thread_safe 0.3.6 Usando public_suffix 2.0.5 Usando colorador 1.1.0 Usando color 1.2 Usando ffi 1.9.18 Usando 2.6.0 extendido hacia adelante Usando mercenario 0.3.6 Usando mini_portile2 2.1.0 Usando paralelo 1.11.2 Usando grito 2.0.7 Usando descaro 3.4.24 Usando rb-fsevent 0.9.8 Usando kramdown 1.13.2 Usando líquido 3.0.6 Usando colorete 1.11.1 Usando safe_yaml 1.0.4 Usando el paquete 1.13.6 Usando tzinfo 1.2.3 Usando direccionable 2.5.1 Usando ethon 0.10.1 Usando rb-inotify 0.9.8 Usando pathutil 0.14.0 Usando nokogiri 1.7.2 Usando jekyll-sass-converter 1.5.0 Usando soporte activo 5.1.1 Usando tifoidea 0.8.0 Usando escuchar 3.0.8 Usando jekyll-toc 0.2.1 Usando HTML-proofer 3.7.2 Usando jekyll-watch 1.5.0 Usando jekyll 3.4.3 Usando jekyll-feed 0.9.2 Usando jekyll-redirect-desde 0.12.1 Usando jekyll-seo-tag 2.2.3 Usando jekyll-sitemap 1.1.1 ¡Paquete completo! 7 dependencias de Gemfile, 38 gemas ahora instaladas. Las gemas empaquetadas se instalan en ./vendor/bundler. instalación de hilo instalación de hilo v0.24.5 [1/4] Resolviendo paquetes... Éxito Ya actualizado. Hecho en 0,38 s. mkdir -p activos/proveedor/ cp node_modules/font-awesome/css/font-awesome.min.css activos/vendor/ cp -r node_modules/font-awesome/fuentes activos cp node_modules/jquery/dist/jquery.min.js activos/vendor/ cp node_modules/tether/dist/js/tether.min.js activos/vendor/ cp node_modules/bootstrap/dist/js/bootstrap.min.js activos/vendor/ paquete ejecutivo jekyll build Archivo de configuración: /tmp/jekyll-skeleton/_config.yml Fuente: /tmp/jekyll-skeleton Destino: /tmp/jekyll-skeleton/_site Construcción incremental: deshabilitada. Habilitar con --incremental Generando... hecho en 5.474 segundos. Auto-regeneración: deshabilitada. Utilice --watch para habilitar. $ árbol -L 3 _sitio/ _sitio/ ├── activos │ ├── fuentes │ │ ├── FontAwesome.otf │ │ ├── fontawesome-webfont.eot │ │ ├── fontawesome-webfont.svg │ │ ├── fontawesome-webfont.ttf │ │ ├── fontawesome-webfont.woff │ │ └── fontawesome-webfont.woff2 │ ├── principal.css │ └── vendedor │ ├── bootstrap.min.js │ ├── fuente-awesome.min.css │ ├── jquery.min.js │ └── tether.min.js ├── de │ ├── beispiel-post.html │ ├── índice.html │ └── categoría1 │ ├── índice.html │ └── post-in-unterkategorie.html ├── implementar_key.enc ├── es │ ├── ejemplo-post.html │ ├── índice.html │ └── subcategoría1 │ ├── índice.html │ └── publicación-en-subdirectorio.html ├──es │ ├── índice.html │ ├── post-ejemplo.html │ └── subcategoría1 │ ├── índice.html │ └── post-en-subdirectorio.html ├── feed.xml ├── índice.html ├── LICENCIA ├── paquete.json ├── LÉAME.md ├── robots.txt ├── mapa del sitio.xml └── hilo.lock 9 directorios, 32 archivos $ hacer cheque paquete ejecutivo jekyll doctor Archivo de configuración: /tmp/jekyll-skeleton/_config.yml Los resultados de su prueba están disponibles. Todo se ve bien. paquete ejecutivo htmlproofer --check-html --http-estado-ignorar 999 --dominios-internos marcanuy.github.io,localhost:4000 --asume-extensión _sitio Ejecutando ["ScriptCheck", "LinkCheck", "HtmlCheck", "ImageCheck"] en ["_site"] en *.html... Comprobando 14 enlaces externos... ¡Se ejecutó en 13 archivos! HTML-Proofer finalizó exitosamente.
¡Siéntete libre de abrir incidencias y/o contribuir!