rm -rf /

Ho voluto rifare il look del blog e già che c'ero ho pensato a un nuovo inizio. I contenuti vecchi sono per ora archiviati.

Nuovo inizio nuovo blog. Sono passato da Wordpress a un generatore statico di html: Sculpin.
Nonostante sia poco attivo come progetto ha molti punti interessanti che mi hanno convinto a utilizzarlo.
Mi ha attirato soprattutto il fatto di poter scrivere in markdown e lanciare un comando per eseguire il deploy/pubblicare il post. Comodo anche avere sotto controllo di versione (git) i contenuti e quindi anche il loro backup automatico e poter pubblicare il blog anche solo su S3 (o simili) senza dover avere un web server. La cosa principale però è che è scritto in PHP e facilmente modificabile e personalizzabile.

Con Composer già installato, in pochi secondi, creando il progetto come da documentazione, avevo lo scheletro del blog.

composer create-project sculpin/blog-skeleton ilmioblog

Lanciando poi lo script per generare i contenuti e abilitare il server di sviluppo mi è bastato un click per guardare il risultato su http://localhost:8000

vendor/bin/sculpin generate --watch --server

Sculpin è scritto in PHP, componenti Symfony e i template sono basati su Twig, quindi rimango nella confort zone ed è stato molto semplice da personalizzare.

Come prima cosa ho rinominato i file di template da .html a .html.twig per coerenza con il formato dei file. Poi ho iniziato la personalizzazione dello stile partendo dallo scheletro appena creato che è basato su Bootstrap 4. Dopo aver installato le dipendenze per il frontend con yarn

yarn install

ho installato Fontawesome per le icone

yarn add @fortawesome/fontawesome-free

e lanciato il relativo comando di watch per il frontend

yarn encore dev --watch

Nonostante le mie discutibili doti estetiche mi sono impegnato a modificare i file in source/assets e in particolare gli stili in source/assets/css/app.scss dove ho configurato i colori e alcune spaziature di base di Bootstrap.

Nella homepage, il boilerplate stampa la lista dei blogpost. Visto che non mi piaceva il fatto che venisse stampato tutto il post e preferivo avere gli excerpt al posto dell'intero articolo (gusti), sono andato a modificare la index.html.twig e ho inserito al posto di

{{ post.blocks.content|raw }}

il seguente script per tagliare il blogpost quando trova un <!--more--> o nel caso non ci sia, dopo 200 caratteri.

{% set more_splitted = post.blocks.content|split('<!--more-->', 2) %}
{% if more_splitted|length > 1 %}
    {{ more_splitted[0]|raw }}
{% else %}
    {{ post.blocks.content|raw|striptags|slice(0, 300) }} &hellip;
{% endif %}

Nel caso in cui ci sia il separatore more dovrebbe essere sicuro lasciare gli eventuali tag. Nel secondo caso, non sapendo esattamente il punto di taglio è sicuramente meglio eliminare eventuali tag che potrebbero rompersi.

Dopo il taglio ho aggiunto un link (copiandolo dal titolo) al testo completo del post.

<a class="btn btn-dark" href="{{ site.url }}{{ post.url }}">Continua...</a>

Potete vedere il risultato nella homepage.