[WordPress] Prima lettera del post come immagine

Il titolo del post è un po’ criptico, ma cerco di spiegarmi subito… Cazzeggianto con WordPress mi ero messo in testa di inserire una funzione in un template, che sostituisse la prima lettera di un post con una immagine che cambiasse in base alla prima lettera: ovviamente l’immagine in questione raffigura proprio la lettera da rimpiazzare, ma in formato più vivo. Oltretutto l’utilizzo di un file immagine mi permette di scegliere anche font non ben supportati dai browser, ottenendo un effetto grafico gradevole e non dipendente dal client che visualizza l’immagine.

La prima cosa che ho fatto è crearmi 26 immagini adeguate, dalla A alla Z… Sinceramente una vera rottura di zebedei, ma GIMP ti da una mano! .

La seconda fase era capire come WordPress gestisse la visualizzazione dei post. Mi sono accorto, con un po’ di stupore, che la paragrafazione dei contenuti non avviene in fase di posting e non viene salvata nel database.
Solo in fase di richiesta della pagina il programma processa il dato acquisito dal database aggiungendo dove necessario elementi di formattazione come <p> e sostituendo le emoticons dove necessario.

Tutte queste operazioni sono effettuate dalla funzione the_content(). E’ bastato modificarla leggermente (ovviamente ridefinendola nel file function.php del template, per evitare di andare a toccare file di sistema dell’applicazione) ed il tutto è stato possibile.

C’è da aggiungere un’altra cosa: se il post non comincia con del testo la funzione di replace non avrebbe avuto senso. Di conseguenza in quel caso avrebbe dovuto restituire una stringa senza rimpiazzo di lettere.

Di seguito la funzione:

Le immagini sono nella sottodirectory /alfa/ della directory /images/ del template. Le modifiche alla funzione originale partono dalla prima definizione di $contentz.
Dato che WP inserisce con apply_filters() la formattazione, e dato che, se il post comincia con del testo diverso da <blockquote> inserisce un <p> all’inizio, per facilitare in $contentz elimino tutti i <p>.

Dopo di che seleziono il primo carattere della variabile $contentz e la trasformo in maiuscola.

Adesso, se $contentz è una lettera (compresa nell’intervallo A-Z) trasformo la lettera nell’immagine inserendo anche il <p> che avevo tolto per facilitarmi il controllo.
Ma non è tutto, devo modificare anche $content togliendo i primi 4 caratteri. Perchè 4? Semplice: se $contentz è alfabetico, allora la funzione apply_filters() avrà piazzato un <p> come parte iniziale della stringa $content. Ma io quello devo toglierlo, perchè lo inserirò con $contentz.
Il quarto carattere che vado a togliere è ovviamente la prima lettera del post che ho sostituito con l’immagine.

Se $contentz non è numerico allora lo trasformo in una stringa vuota e lascio invariato anche $content. In questo modo se il post comincia con un’immagine (<img), con una citazione (<blockquote>), con del codice (<code>) o con qualsiasi atro tag diverso da <p> che esista già nel post salvato nel database, la funzione di replace non si eseguirà ed il post verrà mostrato per come è in origine.

Ovvio che il risultato della funzione debba essere un echo di $contentz e $content in sequenza .

Alla fine, nel template basta sostituire la funzione the_content() con the_contentz(). Il tutto è implementato nell’ultimo template che ho postato qui (usando il themes switcher selezionate "Clear Vision" e vedrete lo script all’opera).
Come sempre niente di eccezionale, però si potrebbero avere molti usi alternativi della cosa.