Consideracións

Neste caso non quero facer moito cambio, xa que non son deseñador. Así que polo momento so vou engadir un par de elementos que boto en falla e facer algún pequeno cambio estético.

Procedemento

Copiar unha prantilla

Para comezar o que fixen foi copiar os ficheiros da prantilla por defecto de Jekyll, minima, os cartafoles dos includes, dos layouts, assets e sass. Para modificar a partires de aí. Ben é certo que puiden buscar outra prantilla máis complexa, pero non quero perder tempo con isto. Trátase de escribir artigos, non de maquetar a web. Así que como dixen, busquei onde se gardan estes ficheiros e metinos dentro da miña carpeta do blog. A ruta na que se atopan é /usr/local/bundle/gems, aí estaba a carpeta minima-2.5.1 cuxos contidos son os que quero meter no proxecto.

Editando o que nos interesa

A partires de aquí xa só temos que modificar o que nos interesa. No meu caso para comezar editei o header.html que se atopa nos includes. Retireille a parte dos paths. Xa que como ía engadir etiquetas e categorías estas aparecerían aí, sobrecargando a cabeceira. Tamén modifiquei na carpeta de layout o ficheiro home.html, para que os títulos dos posts amosen as categorías ás que pertencen xusto embaixo. No pé da páxina mudei a orde dos elementos, paréceme máis natural que primeiro saia o texto e despois as formas de contacto. Borrei algús elementos na parte do social.html xa que eran redes que nin uso, nin vou usar. Quitei toda referencia a google analytics, xa que non me interesa usar este servizo.

E aquí xa engadín algunha cousa que botaba en falta da prantilla básica. Por exemplo editei post.html para engadir ao pé do artigo dúas seccións. Na primeira amosarase un listado cos artigos relacionados e na seguinte os enlaces ao artigo seguinte e ao anterior, por orde cronolóxica. Seguramente chegará o momento no que terei que mudar a orde para que os links, ao seguinte e anterior, non queden tan abaixo. Este é o fragmento que engadín para esta funcionalidade:


  {%- if page.tags -%}
  <br/>
  <h3>Artigos Relacionados:</h3>
  <ul>
    {%- for tag in page.tags -%}
      {%- for related_post in site.tags[tag] -%}
        {%- if related_post.url != page.url -%}
          <li><a href="{{ related_post.url }}">{{ related_post.title }}</a></li>
        {%- endif -%}
      {%- endfor -%}
    {%- endfor -%}
  </ul>
  {%- endif -%}

  <div class="other-posts">
    {%- if page.previous -%}
      <span class="previous-post">Artigo anterior <a href="{{ page.previous.url }}">{{ page.previous.title }}</a></span>
    {%- endif -%}

    {%- if page.next and page.next.url != nil -%}
      <span class="next-post">Seguinte artigo <a href="{{ page.next.url }}">{{ page.next.title }}</a></span>
    {%- endif -%}
  </div>
  </div>

Como podedes ver neste caso uso as etiquetas para relacionar os artigos, xa que por categoría igual é un termo demasiado amplo.

Xa por último no ficheiro _sass/minima/_layout.css modifiquei un pouco os estilos para dar algunha cor de fondo, engadir as categorías de xeito horizontal na portada e algunha cousiña máis.

Etiquetas e categorías

Unha das cousas que tiña sen configurar e á que non lle estaba a tirar proveito ningún eran as categorías e ás etiquetas, estas últimas nin as estaba a usar. Ata ese momento os artigos tiñan indicada a categoría, pero tan só servía como parte do URL, pero non permitían navegar nin facer nada. Así pois buscando información o que fixen foi engadir na parte dos layouts un ficheiro category_tag_page.html para darlles máis potencia. Este ficheiro será o encargado de cando cliquemos nunha categoría ou nunha etiqueta de amosarnos os artigos relacionados. Este é o contido do ficheiro:


---
layout: default
---

<h1>{{ page.title }}</h1>
<ul>
    {%- for post in site[page.taxonomy][page.term] -%}
      <li><a href="{{ post.url }}">{{ post.title }}</a></li>
    {%- endfor -%}
</ul>

Como podemos ver, ten un bucle que irá cargando os links aos artigos que teñan o termo adecuado. E vale tanto para as etiquetas como para as categorías.

O seguinte será engadir esas categorías e etiquetas, para o que é preciso crear as carpetas de categories e tags. Agora para cada unha delas crearemos un ficheiro co seu nome, son todos iguais. Este é o exemplo da categoría Libros, dentro da carpeta categories e co nome libros.html

---
layout: category_tag_page
title: Artigos da categoría Libros
taxonomy: categories
term: libros
permalink: /categories/libros/
---

Por último para usalas modificaremos o front matter dos artigos para incluílas. Así queda por exemplo o deste mesmo artigo:

---
layout: post
title:  "Mudando o aspecto de Jekyll"
date:   2023-12-06 11:03:27 +0000
categories: [desenvolvemento]
permalink: /:categories/:year/:month/:title
author: Código Morrazo
tags: [jekyll]
---

Pois ata aquí serían os cambios que fixen, pouca cousa pero de momento chégame. Tal vez máis adiante bote en falla algunha cousa máis que engadir.