Per impostazione predefinita, il link "Leggi tutto" non è possibile aggiungerlo in un articolo statico di Joomla!
Di solito viene utilizzato dopo una prima parte di testo introduttivo che rimanda alla lettura dell'articolo completo, in una pagina con voce di menu "Impostazione blog".
Il tutorial odierno, invece, mostra come ottenere il suddetto link per leggere il resto di un articolo. Va detto che è possibile raggiungere il nostro scopo avvalendoci di un plugin: Tabs and Slider.
Di questo plugin Tabs e Sliders per Joomla! me ne sono occupato tempo fa. Una rilettura all'articolo non sarebbe sbagliata. Infatti ho scritto il tutorial dal titolo Tabs e Sliders negli articoli Joomla!.
Evito di ritornare a riscrivere i passaggi per il download ed installazione. Sono scritti nel suddetto articolo. L'unica cosa di cui ci si deve preoccupare, una volta che l'estensione è stata scaricata ed installata, è quella che lo stesso plugin sia abilitato.
Portarsi in Estensioni ⇒ Plugin e cercare: Tabs and Sliders [for articles].
Creare o modificare un articolo statico ed aggiungere il "Leggi tutto"
- si apra, o si crei, un articolo statico in Joomla!
- nel punto in cui si desidera visualizzare il "Leggi tutto", digitare "slider = Leggi tutto" racchiuso tra parentesi graffe
- al termine del testo dell'articolo, posizionare il tag di chiusura "/slider. Il tutto deve essere uguale all'immagine che segue:
- fare clic su Salva oppure Salva e Chiudi
- aggiornare il front end del sito. Possiamo notare l'aggiunta del pulsante "Leggi tutto" al termine del testo di introduzione
Fare clic sul link "Leggi tutto" per vedere il resto dell'articolo.
Formattare il pulsante "Leggi tutto" del plugin Tabs and Slider
Come si può vedere dall'immagine qui su riportata, potrebbe non essere di nostro gradimento il colore del pulsante "Leggi tutto", oppure potrebbe non piacerci la piccola freccia posta a sinistra del link. Ebbene, è possibile formattarlo via CSS.
Aprire la pagina di front end in vista codice, nella quale è stato inserito il pulsante, ed individuare il richiamo al file .css del plugin:
<link href="/plugins/content/jw_ts/jw_ts/tmpl/Default/css/template.css" rel="stylesheet" />
Trasferirlo sul desktop. Una volta aperto il file template.css del plugin, nella parte inferiore, è presente il codice:
/* Sliders (accordion) */
div.jwts_toggleControlContainer {}è il contenitore generale dello sliderdiv.jwts_toggleControlContainer a.jwts_toggleControlè il pulsante al quale è stato assegnato come sfondo una immagine. Volendo eliminare il background, lo si può modificare in:
div.jwts_toggleControlContainer a.jwts_toggleControl {
background-image:none;
border:0px solid #fff;
}
div.jwts_toggleControlContainer a.jwts_toggleOn span.jwts_toggleControlTitlediv.jwts_toggleControlContainer a.jwts_toggleOff span.jwts_toggleControlTitle
sono le classi che mostrano la freccina a sinistra del link "Leggi tutto", nello stato "aperto" e "chiuso". Volendole eliminare, dovremo scrivere:
div.jwts_toggleControlContainer a.jwts_toggleOn span.jwts_toggleControlTitle,
div.jwts_toggleControlContainer a.jwts_toggleOff span.jwts_toggleControlTitle {
background-image:none;
}
div.jwts_toggleControlContainer a.jwts_toggleOn span.jwts_toggleControlNoticeè il testo, presente alla destra del pulsante: "Click to collapse"
Se non volessimo che appaia, basta semplicemente dichiarare:
div.jwts_toggleControlContainer a.jwts_toggleOn span.jwts_toggleControlNotice {
color:#fff;
}
Dove #fff è il colore di sfondo della pagina. Nel caso in cui alla pagina web fosse stato assegnato un colore differente, dichiarare un colore diverso dal bianco per il link "Click to collapse".