Adobe Fonts (Ex Typekit) su RevasOS
Incorporare i font di Adobe Fonts nel tuo sito creato con RevasOS è semplice e ti consente di sfruttare una vasta collezione di font premium per migliorare il design del tuo sito. Segui i passaggi qui sotto.
Attenzione alla privacy
Ricorda che quando aggiungi risorse esterne, come Adobe Fonts, è importante assicurarti che il tuo sito rispetti le normative sulla privacy, come il GDPR. Assicurati di avere attiva la gestione dei consensi tramite una piattaforma come Iubenda.
Ottieni il Codice di Adobe Fonts
- Accedi ad Adobe Fonts: Vai su Adobe Fonts e accedi con il tuo account Adobe.
- Seleziona il font: Esplora la libreria di font disponibili e scegli quelli che desideri utilizzare.
- Crea un Kit di Font:
- Una volta scelto il font, clicca su Add to Web Project per creare un nuovo "Kit".
- Ottieni il codice embed: Dopo aver creato il Kit, copia il codice fornito che inizia con
<script>
(per i font web).
Inserisci il Codice su RevasOS
Per aggiungere il codice su RevasOS:
- Vai nella Dashboard del tuo sito web.
- Clicca su Impostazioni > Codice personalizzato.
- Incolla il codice copiato da Adobe Fonts nel campo Codice HEAD.
- Clicca su Salva per applicare le modifiche.
Se desideri usare il font in specifici blocchi, puoi anche aggiungere il codice nella sezione Nuovo blocco di codice e inserire la regola CSS per applicarlo.
Applicare i Font
Se desideri applicare il font a tutto il sito o a selettori specifici, puoi creare un tag <style>
che trasforma il font di tutto il sito, oppure solo dei titoli o di alcune sezioni specifiche.
Per aggiungere il tag <style>
:
- Vai nella Dashboard del tuo sito web.
- Clicca su Impostazioni > Codice personalizzato.
- Incolla il codice copiato da Google Fonts nel campo Codice HEAD.
- Clicca su Salva per applicare le modifiche.
Cambia il font a tutto il testo:
Per applicare il font a tutto il sito, puoi utilizzare l'asterisco (*
) per selezionare tutti gli elementi. Aggiungi il seguente codice nel blocco di codice HTML:
- Vai nella Dashboard del tuo sito web.
- Clicca su Impostazioni > Codice personalizzato.
- Inserisci il seguente codice nel campo Codice HEAD, sostituendo 'NomeDelFont' con il nome del font scelto da Google Fonts:
<style>
* {
font-family: 'NomeDelFont', sans-serif;
}
</style>
- Clicca su Salva per applicare le modifiche.
Cambia il font solo ai titoli
- Vai nella Dashboard del tuo sito web.
- Clicca su Impostazioni > Codice personalizzato.
- Inserisci il seguente codice nel campo Codice HEAD, sostituendo 'NomeDelFont' con il nome del font scelto da Google Fonts:
<style>
h1, h2, h3 {
font-family: 'NomeDelFont', sans-serif;
}
</style>
- Clicca su Salva per applicare le modifiche.
Cambia il font solo ad elementi specifici:
- Vai nella Dashboard del tuo sito web.
- Clicca su Impostazioni > Codice personalizzato.
- Inserisci il seguente codice nel campo Codice HEAD, sostituendo 'NomeDelFont' con il nome del font scelto da Google Fonts:
<style>
.DefaultBlock--title, .MainBlock--title {
font-family: 'NomeDelFont', sans-serif;
}
</style>