ItaliaPA Visite: 87

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vitae congue elit. Mauris et nibh dolor. Praesent maximus cursus nisi et lacinia. Nulla aliquet rhoncus lacinia. In suscipit dui et ultrices ultrices. Etiam orci leo, iaculis vitae scelerisque in, porta in lorem. Morbi id consectetur massa. Fusce aliquam felis ac ultrices consectetur. Nullam mollis felis in neque pulvinar, nec fermentum velit tincidunt. Pellentesque vitae varius mauris.

Aliquam erat volutpat. Mauris feugiat libero quam, sit amet condimentum eros sodales nec. Pellentesque nec est vitae nunc porttitor pretium eu id tortor. Vivamus vitae purus sit amet velit elementum gravida. Fusce sodales tempus vehicula. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent pulvinar, orci sed bibendum fermentum, neque massa molestie dui, vitae finibus ante leo bibendum nisi. In hac habitasse platea dictumst. Curabitur volutpat lorem at magna rhoncus, quis laoreet lorem ultricies. Nunc euismod urna a nibh scelerisque iaculis. Sed convallis aliquam turpis, dignissim finibus mi commodo in. Integer mattis risus libero, ac dapibus nisl blandit eget. Quisque vestibulum enim mollis, fermentum turpis eu, ultricies nibh. In congue nibh et tristique lobortis. Nunc cursus nec orci sed imperdiet.

Nullam nec dolor suscipit, vulputate nisl semper, rutrum orci. Quisque tincidunt eleifend fringilla. Fusce feugiat tellus vitae gravida dapibus. Phasellus tincidunt est enim, ut imperdiet libero rhoncus id. Quisque nunc ante, ullamcorper id urna eget, dictum porttitor nibh. Nunc tincidunt purus a viverra hendrerit. Aliquam quis justo semper, consequat ante dapibus, molestie elit.


Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Cras ipsum sem, vestibulum id ultricies eget, tristique dignissim arcu. Nam convallis, sem a semper mattis, leo nibh interdum nisl, at ultricies quam justo ut ligula. Nulla interdum felis id vestibulum condimentum. Ut egestas hendrerit venenatis. Aliquam non lacinia nunc, sit amet tempor diam. Nullam id velit ut neque blandit ullamcorper convallis vel diam. Pellentesque ac imperdiet orci, id finibus urna. Fusce aliquam leo sed tortor dignissim, in dapibus nisi tempus.

Cras sed vestibulum magna. Ut ac eros metus. Nullam vel risus eros. Morbi sodales vestibulum justo, ac convallis mauris ultrices eu. Aliquam molestie fermentum dignissim. Morbi malesuada id tellus vel iaculis. Aenean a feugiat arcu, non dictum libero. Donec arcu sapien, pretium a orci a, tincidunt faucibus turpis. Etiam eu enim dignissim, egestas orci malesuada, ultrices enim. Suspendisse ac volutpat mauris.

ItaliaPA Visite: 70

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vitae congue elit. Mauris et nibh dolor. Praesent maximus cursus nisi et lacinia. Nulla aliquet rhoncus lacinia. In suscipit dui et ultrices ultrices. Etiam orci leo, iaculis vitae scelerisque in, porta in lorem. Morbi id consectetur massa. Fusce aliquam felis ac ultrices consectetur. Nullam mollis felis in neque pulvinar, nec fermentum velit tincidunt. Pellentesque vitae varius mauris.

Aliquam erat volutpat. Mauris feugiat libero quam, sit amet condimentum eros sodales nec. Pellentesque nec est vitae nunc porttitor pretium eu id tortor. Vivamus vitae purus sit amet velit elementum gravida. Fusce sodales tempus vehicula. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent pulvinar, orci sed bibendum fermentum, neque massa molestie dui, vitae finibus ante leo bibendum nisi. In hac habitasse platea dictumst. Curabitur volutpat lorem at magna rhoncus, quis laoreet lorem ultricies. Nunc euismod urna a nibh scelerisque iaculis. Sed convallis aliquam turpis, dignissim finibus mi commodo in. Integer mattis risus libero, ac dapibus nisl blandit eget. Quisque vestibulum enim mollis, fermentum turpis eu, ultricies nibh. In congue nibh et tristique lobortis. Nunc cursus nec orci sed imperdiet.

Nullam nec dolor suscipit, vulputate nisl semper, rutrum orci. Quisque tincidunt eleifend fringilla. Fusce feugiat tellus vitae gravida dapibus. Phasellus tincidunt est enim, ut imperdiet libero rhoncus id. Quisque nunc ante, ullamcorper id urna eget, dictum porttitor nibh. Nunc tincidunt purus a viverra hendrerit. Aliquam quis justo semper, consequat ante dapibus, molestie elit.


Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Cras ipsum sem, vestibulum id ultricies eget, tristique dignissim arcu. Nam convallis, sem a semper mattis, leo nibh interdum nisl, at ultricies quam justo ut ligula. Nulla interdum felis id vestibulum condimentum. Ut egestas hendrerit venenatis. Aliquam non lacinia nunc, sit amet tempor diam. Nullam id velit ut neque blandit ullamcorper convallis vel diam. Pellentesque ac imperdiet orci, id finibus urna. Fusce aliquam leo sed tortor dignissim, in dapibus nisi tempus.

Cras sed vestibulum magna. Ut ac eros metus. Nullam vel risus eros. Morbi sodales vestibulum justo, ac convallis mauris ultrices eu. Aliquam molestie fermentum dignissim. Morbi malesuada id tellus vel iaculis. Aenean a feugiat arcu, non dictum libero. Donec arcu sapien, pretium a orci a, tincidunt faucibus turpis. Etiam eu enim dignissim, egestas orci malesuada, ultrices enim. Suspendisse ac volutpat mauris.

ItaliaPA Visite: 1033

Benvenuto nella sezione dedicata a Template ItaliaPA4, implementazione delle Linee Guida di Design per i siti web della Pubblica Amministrazione basato su Bootstrap Italia.

ItaliaPA Visite: 211

Il modulo permette la visualizzazione del Carousel, un pannello orizzontale che contiene a sua volta vari box che scorrono a rotazione in maniera ciclica.

Ogni box può contenere una o più immagini, fino a 6, anch'esse disposte orizzontalmente.

Funzionalità

  • Semplice da personalizzare
  • Supporta tutti i browser moderni
  • Pausa automatica quando si passa il mouse sopra
  • Supporto ai pulsanti di navigazione
  • Possibilità di impostare l'intervallo per lo scorrimento automatico delle diapositive
  • Supporto alla localizzazione

Opzioni

Mostra controlli

Aggiunge un pulsante a sinistra e uno a destra al Carousel, che consentono all'utente di andare avanti e indietro tra le diapositive.

Mostra indicatori

L'attivazione di questo parametro consente di visualizzare gli indicatori a puntini, posti nella parte inferiore della diapositiva, che indicano il numero complessivo di diapositive presenti nel carousel; il puntino bianco indica quale slide si sta visualizzando.

Scorrimento automatico

Se abilitato, il carousel sarà animato al caricamento della pagina.

Intervallo

Specifica il ritardo (in millisecondi) tra due diapositive.

# di immagini

Indica il numero di immagini presenti in ogni diapositiva, fino ad un massimo di 6.

Immagine

Download

Modulo Carousel 3.8.2

Icone

Il modulo utilizza il set di icone proprio di Joomla!  J3.x: I font Icomoon Standard di Joomla. Va utilizzato il nome delle icone senza in prefisso icon-.

Nel caso si utilizzi il template ItaliaPA il set di icone è it WebToolkit - Icone. In questo caso va omesso il prefisso Icon-.

Nel caso si utilizzi il template ItaliaPA4 il set di icone è Bootstrap Italia - Icone. In questo caso va omesso il prefisso it-.

ItaliaPA Visite: 2384

L'inserimento dei componenti previsti da it web toolkit, quali accordion, alert, callout, sottoforma di codice HTML è una operazione abbastanza laboriosa e complessa per i redattori dei testi. Questo potrebbe scoraggiare o impegnare oltre misura chi deve creare e aggiornare i contenuti del sito web. Per semplificare l'inserimento dei contenuti ci viene in aiuto IPA Toolbar for TinyMCE, la toolbar Joomla! specifica per TinyMCE.

L'installazione avviene tramite procedura standard Joomla!, sincerarsi che il plugin System - ItaliaPA Toolbar sia abilitato.

La configurazione invece va fatta direttamente da plugin TinyMCE.

Download

ItaliaPA - it Web Toolkit - TinyMCE Toolbar 3.8 Alpha 2

Troubleshooting

  • Dopo aver configurato il plugin TinyMCE invece di vedere la barra degli strumenti con i nuovi pulsanti ItaliaPA nell'editor TinyMCE ricevo il messaggio di errore: 
    Failed to load plugin: ipa from url https://www.eshiol.it/media/editors/tinymce/plugins/ipa/plugin.min.js

    Verificare che il plugin System - ItaliaPA Toolbar sia abilitato

Il pulsante Tooltip fa riferimento al componente tooltip del web toolkit.

Eum reprehenderit fuga facilis qui. Magni quas molestias delectus. Quidem eos consequatur dignissimos adipisci architecto nesciunt veritatis dolor. Libero id quos iste voluptatem vel sunt nihil. Et nisi fugit. Temporibus error debitis totam cumque. Asperiores nihil iste sint recusandae soluta dolorum excepturi. Esse ab repudiandae aut. Eveniet unde minima possimus harum esse. Necessitatibus ullam voluptatem tempore. Et aliquid totam voluptas. Saepe aut id. Illo eos consectetur dolorem ipsam consequuntur. Minus esse expedita et dolor blanditiis repudiandae ratione. exQuod voluptatibus sapiente dolorem omnis possimus odit quod consequatur. Delectus ex et corporis. Sed minima ea. Et maiores pariatur illum voluptatem est nam fugit non blanditiis. Esse eaque veritatis et eaque autem et dolorem fugit nobis. Incidunt error vel culpa sed assumenda unde. Incidunt et minima tempore omnis sequi iure et sed enim. Laboriosam et in et veniam placeat aliquid quos quasi ut. Qui molestiae ea quibusdam. Sunt ut nobis aut quam asperiores incidunt voluptatem omnis saepe. Et nam commodi minima. Iste esse dolores distinctio. Rerum nemo ipsa voluptate. Sed ut et repellendus et et et ut similique. Et dolorem corrupti dolore quis qui voluptatem.

Il codice di riferimento del tooltip è il seguente:

<a href="#tooltip" class="Tooltip-toggle u-textClean u-padding-right-xs u-padding-left-xs
 u-background-teal-50 u-color-black" data-menu-trigger="tooltip">ex</a>
<span id="tooltip" data-menu class="Dropdown-menu u-borderShadow-m u-background-teal-70 u-color-white u-layout-prose u-padding-r-all u-borderRadius-l">
<span class="Icon-drop-down Dropdown-arrow u-color-teal-70"></span>
<span class="u-layout-prose u-text-r-xs">
Quod voluptatibus sapiente dolorem omnis possimus odit quod consequatur. Delectus ex et corporis. Sed minima ea. Et maiores pariatur illum voluptatem est nam fugit non blanditiis. Esse eaque veritatis et eaque autem et dolorem fugit nobis.
Incidunt error vel culpa sed assumenda unde. Incidunt et minima tempore omnis sequi iure et sed enim. Laboriosam et in et veniam placeat aliquid quos quasi ut.
Qui molestiae ea quibusdam. Sunt ut nobis aut quam asperiores incidunt voluptatem omnis saepe. Et nam commodi minima. Iste esse dolores distinctio.
</span>
</span>

Utilizzando la nuova barra degli strumenti l'inserimento risulta particolarmente semplificato


Disponibile presto il pulsante Dialog basato sul componente dialog del web toolkit.

Il codice di riferimento del tooltip è il seguente:

<button class="Button Button--default js-fr-dialogmodal-open" aria-controls="modal">
  Apri
</button>

<div class="Dialog js-fr-dialogmodal" id="modal">
    <div class="
      Dialog-content
      Dialog-content--centered
      u-background-white
      u-layout-prose
      u-margin-all-xl
      u-padding-all-xl
      js-fr-dialogmodal-modal
    " aria-labelledby="modal-title">
        <div role="document" class="Prose">
            <h2 class="u-cf u-text-h2 u-borderHideFocus" id="modal-title" tabindex="0">Sit et cum iure illum ducimus dignissimos fuga iste.</h2>
            <p>
                Quod voluptatibus sapiente dolorem omnis possimus odit quod consequatur. Delectus ex et corporis. Sed minima ea. Et maiores pariatur illum voluptatem est nam fugit non blanditiis. Esse eaque veritatis et eaque autem et dolorem fugit nobis. Incidunt error
                vel culpa sed assumenda unde. Incidunt et minima tempore omnis sequi iure et sed enim. Laboriosam et in et veniam placeat aliquid quos quasi ut. Qui molestiae ea quibusdam. Sunt ut nobis aut quam asperiores incidunt voluptatem omnis saepe.
                Et nam commodi minima. Iste esse dolores distinctio.
            </p>
            <button class="Button Button--danger js-fr-dialogmodal-close u-floatRight">Chiudi</button>
        </div>
    </div>
</div>

Di seguito è mostrata la finestra di inserimento attivabile con il pulsante Dialog

Torna all'inizio del contenuto