pages - jekyll url

Activos de correos locales con Jekyll.

Question

Me preguntaba cómo otras personas están organizando sus activos para publicaciones individuales cuando usan Jekyll. Por ejemplo, si una publicación tiene una imagen, ¿simplemente la descarga en una carpeta de imágenes compartidas? Realmente no me gusta la idea de hacer esto; significa que una imagen está completamente separada de una publicación, cuando creo que deberían estar emparejadas.

Answer 1

Ahora he logrado desarrollar un complemento Jekyll que ayuda a mantener los activos de las publicaciones junto con el archivo de Markdown: https://nhoizey.github.io/jekyll-postfiles/

Answer 2

Al igual que usted, realmente odio tener todas las imágenes en una sola carpeta compartida.

La mayoría, si no todas, de mis imágenes son útiles en una sola publicación, y mantenerlas junto con el archivo Markdown es realmente mejor para la administración de publicaciones:

• Puedo dejar una nueva publicación como una sola subcarpeta de /_posts/ en un paso, sin tener que colocar el Markdown en un lugar y las imágenes en otro
• Cuando quiero editar la (s) imagen (es) de una publicación existente, no tengo que encontrar la imagen correcta en una enorme carpeta /assets/ asset /assets/ , ya que está ubicada cerca del archivo Markdown.
• En mi Markdown, puedo usar el nombre del archivo de imagen directamente, sin ninguna ruta
• Si quiero usar cualquier editor de Markdown con vista previa en vivo, funciona, no es necesario configurar una carpeta de activos específica

Traté de tener esto para mi blog ( ejemplo de publicación aquí ).

Para las imágenes receptivas, utilicé el plugin Jekyll Picture Tag , pero tuve que bifurcarlo, porque no se aceptó la Solicitud de extracción para tratar con tales caminos.

Ahora que Jekyll 3 está allí, me gustaría que pudiéramos usar imágenes en una carpeta de publicaciones Y en /assets/ one, buscando una imagen marcada con ![alt](image-file-without-path.jpg) en ambos, en ese orden.

Answer 3

Escribí un complemento para que me permitiera organizar los activos en subdirectorios fácilmente:
https://github.com/samrayner/jekyll-asset-path-plugin

{% asset_path my-image.png %}

en post 2013-01-01-post-title saldría:

/assets/posts/post-title/my-image.png

en la página mi-primera página saldría:

/assets/my-first-page/my-image.png

Answer 4

Para JavaScript y CSS, es posible que desee considerar una canalización de activos. Puede obtener una buena mejora de rendimiento a través de agrupación y compresión. También uso CoffeeScript y Sass, por lo que necesitaba un preprocesador para convertir mis activos. Utilizo Jekyll Asset Pipeline para administrar todo este proceso automáticamente cuando ejecuto el comando jekyll .

Para imágenes / video, te recomiendo que desarrolles una convención para nombrar carpetas en tu proyecto. Por lo general, tengo una carpeta de "activos" y luego subcarpetas con la fecha de cada publicación que contiene las imágenes relacionadas con esas publicaciones. Si tienes varias publicaciones por día, puedes considerar incluir el nombre de la publicación.

Answer 5

Prefiero pensar en las imágenes como activos independientes que se incluyen en cero o más páginas. La mayoría de las veces, mis imágenes aparecen en una sola página. Hay ocasiones en las que quiero tenerlas en varias páginas y en otros casos no vinculo una imagen en absoluto. Si su flujo de trabajo consiste en colocar cada imagen en un directorio con una publicación, encontrarlas comienza a requerir una cantidad significativa de búsqueda y debe crear algo diferente para las imágenes que no pertenecen a una publicación específica.

El enfoque que utilizo está en el lado opuesto del espectro. Tengo un solo directorio de imágenes (servido desde "/ images") y el 100% de mis imágenes se encuentran allí. Los beneficios de esto son:

1. Cuando agrego una imagen a una publicación, es fácil saber qué ruta usar. Siempre es:

   /images/{image-name}

   Por ejemplo: http://alanwsmith.com/i/aws-20111017--0906-02 . Esto hace posible escribir un complemento, de modo que todo lo que tiene que ingresar es el nombre de la imagen y el resto de la ruta conocida se completará automáticamente.

2. Con una aplicación como Photo Mechanic , es increíblemente fácil explorar el directorio único localmente y ver cada imagen. Si quiero incluir una imagen en otra página, esto reduce drásticamente el tiempo para encontrarla.

3. No hay una ubicación / proceso separado si deseo enviar una imagen a alguien sin incluirla en una página (es decir, enviarles un enlace directo al archivo de imagen). Acabo de lanzar la imagen en el directorio estándar y enviar el enlace directo.

Si desea avanzar un poco más, al mantener todas sus imágenes en un solo directorio también se pueden hacer algunos ajustes agradables. Por ejemplo, aunque las URL de mis imágenes comienzan con "/ images", las imágenes se almacenan en un directorio fuera de los que usa Jekyll. En mi caso, la parte superior de mi árbol fuente se ve así:

./html
./source-files
./image-files

Todas mis imágenes se almacenan en el directorio "./image-files". En mi configuración de apache, he configurado un alias para que la URL "/ images" apunte al directorio "./image-files". Por ejemplo:

Alias /images /webroot/image-files

Cuando ejecuto jekyll, procesa todo en "./source-files" y lo suelta en "./html". Debido a que todas las imágenes están fuera de esos dos directorios, jekyll nunca las ve / toca. A medida que su biblioteca de imágenes crezca, esto ayudará a acelerar las cosas y evitará una enorme cantidad de copias innecesarias de archivos.

Otro truco que me gusta en Apache es encender:

Options +MultiViews

Esto le permite llamar a sus imágenes sin tener que usar la extensión de archivo (por ejemplo, no ''.jpg'', ''.png'', etc ...). Puedes ver eso en el enlace de ejemplo que proporcioné arriba. Realmente no importa para el rendimiento. Simplemente me gusta su apariencia y me evita tener que escribir la extensión cada vez que llamo una imagen.

MultiViews también hace posible reemplazar una imagen de un formato por otro sin tener que recodificar nada más. Por ejemplo, si elimina "some-image.gif" y lo reemplaza por "some-image.png", no tendría que tocar ningún HTML. Todavía se serviría de la forma "/ images / some-image". Necesitar hacer cambios como ese es probablemente extremadamente raro. Solo creo que es algo interesante poder hacer.

Finalmente, puede tomar una decisión única sobre permitir o no permitir que se navegue por su directorio de imágenes. Personalmente, solo quiero que mis imágenes se muestren donde las coloco. Por lo tanto, he establecido el archivo .htaccess en mi directorio de imágenes para:

Options -Indexes

Si va a trabajar en un sitio con muchos miles o decenas de miles de páginas e imágenes, esto podría no escalar. Para un sitio personal de tamaño normal, encuentro que este enfoque facilita el mantenimiento de las imágenes.