Da tempo cercavo un modo semplice per aggiungere una cosa semplicissima al mio sito realizzato con Joomla!, vale a dire aggiungere la foto di anteprima agli articoli correlati.
Ritenevo il plugin del core di Joomla per visualizzare gli articoli correlati molto essenziale, comodo e veloce, facile da configurare.
Tuttavia mancava una caratteristica che io considero fondamentale: cioè la visualizzazione dell’immagine di anteprima sotto il titolo dell’articolo correlato. Si tratta davvero di una cosa basica, che davo per scontato ci fosse; in altri CMS è naturale che nella sidebar di destra, oppure sotto alla fine dell’articolo, ci sia un plugin che mostra articoli correlati con foto di anteprima.
Prima di intervenire sul codice sorgente ho cercato senza successo in rete e nella JED, estensioni del plugin oppure altri plugin che svolgessero questa funzione. Trovai solo alcuni plugin a pagamento.
Così prima di pagare un plugin ho deciso di avventurarmi nel codice sorgente del plugin degli articoli correlati per vedere come poter intervenire. In una discussione sul forum Joomla.org trovai un paio di stringhe di codice già postate da altri utenti che potevano fare al caso mio.
Così mi sono messo al lavoro e alla fine sono riuscito facilmente nel mio intento.
Propongo ora due soluzioni per raggiungere questo intento:
Mettere mano al codice
Allora per ottenere la visualizzazione dell’immagine di anteprima degli articoli negli articoli correlati utilizzando il plugin del core di Joomla mettendo mano al codice quello che dovete fare è questo:
Dovete innanzitutto intervenire sul file default.php che trovate al seguente percorso:
vostrosito/modules/mod_related_items/tmpl/default.php
Dopodichè inserite queste due righe di codice nel file più o meno nella riga 20, l’importante è che sia all’interno dei tag list item, cioè <li>.
Qui sotto le righe di codice che ho utilizzato.
<?php $images = json_decode($item->images); ?>
<img src="/<?php echo htmlspecialchars($images->image_intro); ?>" alt="<?php echo htmlspecialchars($images->image_intro_alt); ?>"/>
Qui lo screenshot del file modificato.
Ed ecco qui il risultato finale.
IMPORTANTE! Fai un override della modifica!
Ora che avete provato che la modifica produce gli effetti desiderati sarebbe il caso da renderla permanente. Questa modifica, infatti, andrebbe persa al primo aggiornamento di Joomla!
Per proteggere la nostra modifica da successivi aggiornamenti basta davvero poco, bisogna infatti creare un override.
Quindi da backend del vostro sito Joomla! Seguite il seguente percorso: Estensioni → Template → Lista Template
Dopodichè dirigetevi verso il vostro template e cliccate sulla voce “Mio Template Dettagli e file”
A questo punto cliccate sul tab sotto il menù principale “Crea override”
Ora cercate la voce relativa al modulo che stiamo modificando, vale a dire “mod_related_items” e cliccateci sopra.
Ora l’override è stato automaticamente creato da Joomla!, andate dunque a cercare il file automaticamente generato da Joomla! e apporate lì la modifica desiderata come fatto in precedenza.
Sul menù verticale di sinistra cliccate su html → mod_related_items → default.php
A questo punto vi trovate dentro il file che dovete modificare tramite l’editor interno di Joomla!
Qui fate la stessa cosa fatta in precedenza, copiate ed incollate questa stringa di codice
<?php $images = json_decode($item->images); ?>
<img src="/<?php echo htmlspecialchars($images->image_intro); ?>" alt="<?php echo htmlspecialchars($images->image_intro_alt); ?>"/>
Nel punto indicato nello screenshot, intorno alla riga 19, prima della chisura del tag </li>
Ora la vostra modifica sarà permanente.
Installare un modulo da me implementato sulla base del modulo del core di Joomla
Se non avete voglia o competenze necessarie per mettere mano al codice allora vi consiglio di visitare l'area download del mio sito e scaricare il modulo Related Item with thumb.