Pulsanti
Il pulsante principale è utilizzato per la CTA principale di una pagina. Si implementa cercando "button" nei blocchi di Gutenberg e selezionando Button (non Buttons, che è un blocco diverso).
Il pulsante secondario è più piccolo del pulsante principale. Si usa quando si desidera una CTA più silenziosa (ad esempio, l'iscrizione alla newsletter nel piè di pagina). Si implementa aggiungendo il blocco Button Gutenberg come descritto sopra e poi aggiungendo "btn-secondary" al campo Additional CSS classes.
Il pulsante Alt si presenta come un link di testo con un elemento freccia :after. Si usa quando si desidera una CTA più silenziosa. Si implementa aggiungendo il blocco Button Gutenberg come descritto sopra e poi aggiungendo "btn-alt" al campo Additional CSS classes.
Giù le mani
I dropdown saranno implementati quasi esclusivamente dal team di sviluppo.
Possono essere utilizzati in modo autonomo o come parte di una struttura di navigazione interna più ampia (si usa l'elemento .wp-block-buttons
che centra anche il pulsante). Esempio dal vivo.
Input semplice + pulsante (modulo in linea)
Sarà implementato esclusivamente dal team di sviluppo. Può essere parte di un .wp-block-buttons
per centrare il blocco e avere uno stile aggiuntivo. Esempio dal vivo.
Scatole informative - 3 varietà
Standard
Tutti i riquadri informativi sono flottanti a destra. Si può implementare selezionando "Info Box" dai blocchi di Gutenberg.
Con immagine
Indirizzo di spedizione WBC
BA - WBC 2020 587 S. Taylor Avenue
Louisville, CO 80027
Aggiungere "with-image" al campo Classi CSS aggiuntive
Con testo più piccolo
Quando si ha molto contenuto da inserire in un riquadro informativo, si può desiderare che il testo abbia una dimensione di carattere più piccola. Per implementare questa varietà, aggiungere "with-smaller-text" al campo Classi CSS aggiuntive.
Fisarmonica
Implementare selezionando Accordion dai blocchi di Gutenberg.