Per poter rendere più interessante il contenuto dell'articolo che si vuole pubblicare o per qualsiasi altro tipo di necessità, il CMS mette a disposizione delle funzionalità extra che permettono di gestire strutture complesse come: caroselli, slider, accordion, ecc.

Queste strutture HTML necessitano sempre del supporto di un codice JavaScript e CSS specifici che non sempre l'utilizzatore finale è in grando di gestire. Per questo motivo sarà quindi sufficiente occuparsi dell'HTML relativo alla funzionalità che si vuole applicare e includere spuntandola, la "funzione speciale" di riferimento.

Funzionalità speciali

Carosello

Ecco un esempio di codice HTML necessario per la creazione del carosello

<div class="owl-carousel owl-theme">
    <div class="item">
        <a href="/booking/availabilityV2.php" target="_blank">
            <img src="[url_immagine_da_personalizzare]">
        </a>
    </div>
    <div class="item">
        <img src="[url_immagine_da_personalizzare]">
    </div>
    <div class="item">
        <img src="[url_immagine_da_personalizzare]">
    </div>
    <div class="item">
        <img src="[url_immagine_da_personalizzare]">
    </div>
    <div class="item">
        <img src="[url_immagine_da_personalizzare]">
    </div>
</div>

È necessario che un div con class="owl-carousel owl-theme" faccia da contenitore ad ogni div con class="item" che conterrà o una sola immagine, o in link con un immagine o altro.


È possibile gestire alcune opzioni avanzate inserendo un elemento <input type="hidden" class="owl-carousel-settings"> in cima all'articolo.
Le opzioni, gestibili tramite data-attributes, sono le seguenti:

  • numero di immagini da visualizzare (data-items="1")
  • margine tra un'immagine e l'altra (data-margin="30")
  • presenza dei pulsanti di navigazione (data-nav="true")
  • presenza dei "pallini" di navigazione (data-dots="false")

Esempio: <input type="hidden" class="owl-carousel-settings" data-items="4" data-margin="60" data-nav="false">


Di seguito un breve video tutorial su come gestire un carosello.

Mailchimp

Selezionando la funzionalità MAILCHIM è possibile aggiungere il widget di iscrizione alla newsletter che viene generato da MailChimp stesso. Essendo inibito l'aggiunta di link a CSS e JS da editor è necessario selezionare la funzionalità speciale, che si occuperà di aggiungere il codice necessario ad eccezione dell'HTML vero e proprio che dovrà esser presente nell'articolo. Sostanzialmente nell'articolo deve esser inserito solo l'HTML del contenitore

<div id="mc_embed_signup">
  <form action="https://.....
  ...
</div>