Author:
Aggiungere il link leggi tutto in articolo statico di Joomla!
Creare il link "Leggi tutto" in un articolo statico di Joomla! con il Plugin Tabs and Sliders
Extrowebsite Logo

Per impostazione predefinita, il pulsante, o link, "Leggi tutto" non è possibile aggiungerlo in un articolo statico di Joomla!

Di solito viene utilizzato dopo una prima parte di testo introduttiva, in una pagina con 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 per Joomla! me ne sono occupato tempo fa. Una rilettura all'articolo non sarebbe del tutto errata. Infatti ho scritto il tutorial dal titolo .

Evito di ritornare a scrivere 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 EstensioniPlugin e cercare: Tabs and Sliders [for articles].

Abilitare il plugin tabs and sliders per Joomla!

Creare o modificare un articolo statico nel quale 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:
Articolo Joomla! con i tag slider
  • 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
Pulsante leggi tutto in articolo statico di Joomla!

Fare clic sul link "Leggi tutto" per vedere tutto il resto dell'articolo.

Pulsante leggi tutto in articolo statico di Joomla!

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 slider
  • div.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_toggleControlTitle
  • div.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".