calcolalapercentuale.itFacciamo due conti
UN PICCOLO STRUMENTO, OVUNQUE SERVA

Le percentuali.
Anche sul tuo sito.

Un calcolatore utile ai tuoi lettori, pronto in due righe di codice.
Personalizza i colori, scegli il formato e fai spazio ai risultati.

Gratuito, anche per lavoroNessun iframeNessun cookie o tracker
01 · PERSONALIZZA

Un posto per i tuoi colori.

#c5441c

Facoltativa e discreta. Il widget resta gratuito anche senza attribuzione.

ANTEPRIMA LIVE

Prova i numeri: questa è la stessa versione che incorporerai sul tuo sito.

02 · COPIA E INCOLLA

Due righe. Fatto.

Incolla il codice dove vuoi mostrare il calcolatore.

PENSATO PER I TUOI LETTORI

Si adatta al sito. Semplifica i conti.

Subito utile

Risultati mentre scrivi, virgola italiana, formule leggibili e messaggi chiari quando un numero non è valido.

Il tuo stile, senza conflitti

Tema chiaro, scuro o automatico. Colore personalizzato, formato compatto e stili isolati nello Shadow DOM.

Solo quello che serve

Un solo file JavaScript. Nessuna libreria da installare, nessun foglio CSS esterno e calcoli eseguiti nel browser.

DALL’ANTEPRIMA AL TUO SITO

Come incorporare il calcolatore.

Su una pagina HTML

  1. Personalizza il widget e copia il codice dal configuratore.
  2. Incollalo nel corpo della pagina, nel punto in cui vuoi mostrare il calcolatore.
  3. Pubblica e verifica la pagina anche da smartphone.

Per più istanze ripeti soltanto il div, con le impostazioni desiderate. È sufficiente una sola inclusione dello script, che trova anche i contenitori aggiunti successivamente.

Su WordPress e altri CMS

  1. Apri la pagina o l’articolo e aggiungi un blocco HTML personalizzato.
  2. Incolla il codice, salva e verifica il risultato nella pagina pubblicata.
  3. Se lo script viene rimosso, chiedi all’amministratore di aggiungerlo nell’area codice del tema o tramite uno strumento autorizzato dal tuo CMS.

I permessi dipendono da ruolo, installazione e piano. Un blocco di testo o codice visuale non esegue necessariamente JavaScript: usa uno spazio che consenta HTML e script.

SE VUOI ANDARE UN PO’ PIÙ A FONDO

Attributi, compatibilità e sicurezza.

Ogni contenitore ha impostazioni indipendenti. Le modalità disponibili sono base, ratio, discount, increase, decrease, change e inverse. Il risultato viene mostrato fino a due decimali; gli importi sono arrotondati ai centesimi.

Opzioni del contenitore
AttributoValoriPredefinito
data-modeUna delle sette modalità indicate soprabase
data-themelight, dark, autolight
data-accentColore esadecimale di sei cifre, es. #2563eb#c5441c
data-variantstandard, compactstandard
data-show-brandingtrue o falsetrue
data-style-nonceNonce autorizzato dalla CSP del sito ospitanteNessuno

Il colore scelto viene usato come accento; il colore dei testi viene adattato quando necessario per mantenerli leggibili su sfondo chiaro o scuro. La larghezza segue il contenitore: puoi usarlo in un articolo o in una colonna laterale. Il CSS del sito ospitante deve comunque lasciare visibile e dimensionare correttamente il contenitore esterno.

Per siti con una CSP restrittiva

Autorizza https://calcolalapercentuale.it in script-src (e in script-src-elem, se presente). Autorizza un nonce per gli stili in style-src e style-src-elem, se presente. Il nonce deve essere generato dal server, diverso a ogni risposta, e coincidere con quello del codice:

<div data-calcola-percentuale data-style-nonce="NONCE_DELLA_RISPOSTA"></div>
<script src="https://calcolalapercentuale.it/widgets/percentuale.js" nonce="NONCE_DELLA_RISPOSTA" defer></script>

Il widget propaga il nonce dello script agli stili; data-style-nonce permette di indicarne uno specifico per ogni istanza. Non richiede unsafe-inline, unsafe-eval né autorizzazioni in connect-src. Se non puoi modificare la CSP o gli script vengono filtrati dal CMS, serve l’amministratore del sito.

Attribuzione trasparente, nessun tracciamento aggiunto

“Offerto da CalcolaLaPercentuale.it” è un normale collegamento visibile, con rel="nofollow noopener noreferrer", aperto in una nuova scheda. Puoi rimuoverlo tramite l’opzione dedicata. Non esistono link nascosti o obblighi di backlink. Il widget non incorpora il sistema di statistiche di questo sito: l’anteprima qui sopra è inserita in una pagina che segue la nostra privacy policy.

Per uso e redistribuzione del bundle è disponibile la licenza MIT. Il widget non impedisce agli altri script del sito ospitante di accedere al suo DOM: lo Shadow DOM isola gli stili e la struttura, ma non è un confine di sicurezza rispetto al gestore della pagina.

QUALCHE DUBBIO?

Le risposte, senza giri di parole.

Le domande più comuni sulle percentuali.

01Il widget è gratuito anche per siti commerciali?

Sì. Puoi incorporarlo su siti personali, didattici o commerciali senza abbonamenti, registrazione o chiavi API. Il bundle è distribuito con licenza MIT.

02Posso usarlo su WordPress?

Sì, se il tuo account e il piano consentono JavaScript personalizzato. Usa un blocco HTML personalizzato o lo spazio codice del tuo tema. Alcuni editor o ruoli rimuovono gli script: in quel caso serve l’intervento dell’amministratore del sito.

03Devo caricare lo script per ogni calcolatore?

No. Inserisci tutti i contenitori desiderati, ognuno con i propri attributi, e carica lo script una sola volta. Se viene incluso più volte, la libreria evita registrazioni e inizializzazioni duplicate.

04L’attribuzione è obbligatoria?

No. È un collegamento visibile e facoltativo, con rel="nofollow". Puoi disattivarlo nel configuratore o impostando data-show-branding="false". Non ci sono collegamenti nascosti o requisiti di backlink.

05Il widget usa cookie o raccoglie i numeri inseriti?

No. Il bundle esegue i calcoli nel browser e non contiene analytics, cookie, memoria persistente, richieste API o dipendenze esterne. Il primo caricamento dello script comporta la normale richiesta al server che lo distribuisce. Gli altri strumenti del sito ospitante restano indipendenti.

06Funziona con una Content Security Policy restrittiva?

Sì, consentendo lo script dal dominio calcolalapercentuale.it e uno style nonce per il CSS nello Shadow DOM. Non servono unsafe-eval, iframe, font esterni o connessioni API. Più sotto trovi l’esempio; una CSP che vieta ogni stile inline deve autorizzare esplicitamente questi stili con un nonce.

07Quali browser sono supportati?

I browser moderni con Web Components, Shadow DOM, BigInt e Object.hasOwn, per esempio Chrome ed Edge 105+, Firefox 103+ e Safari 16+. Non vengono caricati polyfill o librerie aggiuntive. Internet Explorer non è supportato.