[🛠] Cómo subir imágenes a un blog de GitHub Pages

✨ Resumen de GPT 　

Guía para añadir imágenes a un blog de GitHub Pages.

Quería añadir imágenes a mi blog de GitHub Pages, pero surgieron algunos problemas.

• Se me había olvidado cómo hacerlo.

• Recordé que cada repositorio tenía un límite de 1 GB.
  • Actualización del 2025.1.13
    • 1 GB es una recomendación, no un límite obligatorio.
    • Si supera los 5 GB, GitHub puede enviar un correo.
    • No hay un límite total de capacidad indicado por separado.
    • Un archivo individual tiene un límite de 100 MB. (Se puede resolver con Git LFS.)
    • Si el repositorio crece mucho, es muy probable que afecte la velocidad de clonación y push.
• Recordé que también existía la opción de usar hosting externo de imágenes.

… En una época como la actual, ¿cuál sería la mejor forma de hacerlo?

✨ Clic ✨

El texto de abajo fue escrito tomando como referencia una respuesta de GPT-4o.

1. Método general: usar la carpeta assets/images

Guarda las imágenes dentro de la carpeta assets/images del proyecto del blog y enlázalas desde ahí.

Ejemplo

• Ruta donde se guarda la imagen:

  assets/images/example.jpg
  

• Uso dentro de un post:

  ![Descripción de la imagen](/assets/images/example.jpg)
  

Este método es simple, pero puede causar problemas si el repositorio alcanza el tamaño recomendado de 1 GB.

---

2. Qué hacer cuando la capacidad se vuelve un problema

1) Hosting externo de imágenes

Usa un servicio externo en lugar de guardar las imágenes en el repositorio de GitHub.

• Imgur: sube la imagen y usa su URL.

  ![Descripción de la imagen](https://i.imgur.com/example.jpg)
  

• Google Photos/Dropbox: usa enlaces de almacenamiento en la nube.

---

2) Crear un repositorio independiente para imágenes

Crea un repositorio separado de GitHub Pages dedicado solo a gestionar imágenes.

1. Crea un repositorio nuevo. (Por ejemplo: blog-images)
2. Sube y haz push de las imágenes.

3. Usa el enlace de la imagen:

   ![Descripción de la imagen](https://username.github.io/blog-images/example.jpg)
   

---

3. Configuración para prepararse ante cambios de URL

Puedes reducir la carga de corregir enlaces configurando una ruta base para imágenes en _config.yml.

1. Añade esto a _config.yml:

   image_baseurl: "/assets/images"
   

2. Al escribir un post:

   ![Descripción de la imagen](/example.jpg)
   

3. Si cambias el repositorio de imágenes, modifica solo image_baseurl:

   image_baseurl: "https://username.github.io/blog-images"
   

---

4. Conclusión

Por ahora, guarda las imágenes en la carpeta assets/images. Si más adelante la capacidad se vuelve un problema, introduce hosting externo o un repositorio dedicado a imágenes.