Widget festività per il tuo sito web
Mostra un calendario delle festività sul tuo blog o sito web — nessuna competenza di programmazione richiesta. Scegli un paese, una regione o una città, configura l'aspetto, poi copia e incolla il codice sul tuo sito.
Guarda un esempio
Ecco come appare il widget incorporato in un vero articolo di blog. Leggi l'articolo completo →
Aggiungilo al tuo sito in 30 secondi
Scegli un paese. Abbina i colori. Copia il codice. Fatto.
14px
Festività#dc2626
Giorni ponte#059669
Intestazione mese#f9fafb
Anteprima dal vivo
Seleziona un paese per visualizzare il widget
Parametri
Tutta la configurazione avviene tramite gli attributi data-* nel tag script.
| Attributo | Predefinito | Descrizione | |
|---|---|---|---|
data-country | obbligatorio | — | Slug URL del paese (es. "croatia", "france", "united-states") |
data-region | opzionale | — | Slug URL della regione o dello stato per le festività regionali |
data-city | opzionale | — | Slug URL della città (richiede data-region) |
data-view | opzionale | list | "list", "calendar" o "infographic" |
data-year | opzionale | Anno corrente | Anno da visualizzare (anno corrente -1 a +3) |
data-lang | opzionale | en | Lingua: en, hr, fr, de, it, es, pt, tr, pl |
data-ref | opzionale | — | Dominio del tuo sito web per il tracciamento analitico |
Personalizzazione dei colori
Adatta il widget alla combinazione di colori del tuo sito usando codici colore esadecimali. Una variante di sfondo più chiara viene generata automaticamente per ogni colore.
| Attributo | Predefinito | Influenza |
|---|---|---|
data-color-holiday | #dc2626 (red) | Evidenziazione dei giorni festivi, etichette delle date, campioni della legenda |
data-color-bridge | #059669 (green) | Evidenziazione dei giorni ponte, badge, testo informativo |
data-color-month | #f9fafb (light gray) | Sfondo dell'intestazione del mese nella vista calendario |
Esempio con colori personalizzati
<script src="https://www.beevago.com/widgets/beevago-widget.js" data-country="france" data-view="calendar" data-lang="fr" data-color-holiday="#2563eb" data-color-bridge="#7c3aed" data-color-month="#e0f2fe" ></script>