Come aggiungere caratteri personalizzati nel sito Web di WordPress [2022]

Pubblicato: 2022-05-05

Sai qual è la parte centrale del tuo web design? L'aggiunta di un carattere personalizzato a un sito Web WordPress è l'ultimo passo che puoi compiere per mantenere i visitatori del tuo sito Web sul tuo sito e migliorare la leggibilità del sito Web. Il carattere che scegli per il sito web rappresenta l'immagine del tuo marchio. Immergiamoci per conoscere i caratteri personalizzati con pro e contro.

custom fonts

Anche se troverai font gratuiti online, sarai limitato a usarli in base alla compatibilità del tuo tema. Ecco perché spiegheremo come aggiungere caratteri personalizzati in WordPress utilizzando metodi manuali e plugin di WordPress.

Perché usare caratteri personalizzati e dove trovarli?

Come accennato in precedenza, troverai numerosi siti da cui puoi scaricare facilmente i caratteri. Ad esempio, Font Squirrel include fino a tre font gratuiti che puoi utilizzare. Google Fonts è un'altra fantastica opzione in cui troverai più di 900 caratteri tra cui scegliere. Oltre a questo, Edge Web Fonts può offrirti anche un'enorme varietà di caratteri. Per uso personale, puoi optare per Fonts.com o 1001 font gratuiti .

DaFont è la più antica libreria di font che ha oltre 60.000 caratteri da cui puoi filtrare i font che desideri. Devi scaricare i caratteri scelti e non sono come l'integrazione di Google Font. Un tipo simile di libreria di caratteri è UrbanFont con una vasta gamma di caratteri creativi e redditizi.

custom fonts

Adobe Fonts o Typekit è una libreria di font molto utile per tutti i web designer perché ha più di 1900 font disponibili. Anche se ti abboni all'account gratuito, offre comunque oltre 200 caratteri web.

Se vuoi noleggiare i font su base mensile e pagare una quota di abbonamento, puoi scegliere Fontstand . Offre circa 2000 fantastici caratteri e ti addebita su base mensile. Proprio come questo Type Network è un'altra libreria di font self-hosted in cui otterrai più di 400 famiglie di font alla volta ed esplorerai con facilità.

Come scegliere il miglior carattere personalizzato per un sito Web?

Poiché conosci già le risorse per trovare i caratteri personalizzati desiderabili per WordPress, devi sapere come scegliere i caratteri migliori ora. Filtrare i caratteri casuali renderà il tuo processo di selezione lungo e goffo. Invece, puoi provare i seguenti passaggi mentre scegli il miglior font personalizzato per un sito Web WordPress. In questo blog esploreremo Google Fonts per scegliere i caratteri migliori e vedere le migliori pratiche filtrando tutti i caratteri.

custom fonts

Elenco dei caratteri che ti piacciono : nel carattere di Google puoi cercare facilmente il carattere desiderato nella casella di ricerca e impostare la categoria. Il risultato della ricerca verrà modificato in base alla tua regolazione. Puoi vedere i caratteri in alfabeti, numeri numerici e altri formati.

Controlla i dettagli dei caratteri: controllare i dettagli dei caratteri è importante perché vedrai tutti gli stili e le dimensioni dei caratteri disponibili a colpo d'occhio. Un vantaggio straordinario che troverai con Google Fonts è che mostra abbinamenti popolari con quel font.

custom fonts

Mentre controlli i dettagli del carattere, tieni d'occhio anche il formato del carattere. Perché non tutti i caratteri supportano tutti i sistemi browser. Ecco l'ultimo elenco di browser e l'elenco dei formati dei caratteri supportati.

custom fonts

Fonte – https://www.w3schools.com/Css/css3_fonts.asp

Arricchisci la tua raccolta di caratteri : quando hai finito di filtrare i caratteri giusti, puoi aggiungere questi caratteri alla tua raccolta semplicemente facendo clic sul pulsante " Seleziona questo carattere" .

Metodi semplici per aggiungere caratteri personalizzati al sito Web di WordPress

Abbiamo raccolto alcuni dei modi più semplici per aggiungere caratteri personalizzati al tuo sito web in un formato passo dopo passo. Entriamo e vediamo come farlo.

Come aggiungere manualmente caratteri personalizzati in WordPress

L'aggiunta manuale di caratteri personalizzati è il modo più saggio per non rallentare il tuo sito web. Poiché hai già esplorato alcune delle dimensioni dei caratteri per trovare il carattere desiderato, scarica prima il carattere. Ora devi caricare il carattere sul tuo account di hosting del sito web. Scopri quale tema stai utilizzando per il tuo sito Web WordPress. Carica il file CSS del tuo font sul tuo account. Durante il download del font, ricordarsi di estrarre i file dal file .zip.

Per caricare il file dei font, vai alla directory wp-content/themes/your-theme/fonts. Puoi creare una cartella di caratteri separata per tua comodità. Carica il file utilizzando File Manager su hPanel. Ora vai al tuo account WordPress e fai clic sull'opzione Aspetto . Scegli l'editor del tema in cui ti verrà mostrato il file style.css. Aggiungi il codice seguente in fondo al codice.

@font-face {

famiglia di caratteri: Aguafina Script-Regular;

src: url ( http ://test-site.com/wp-content/themes/twentynineteen/fonts/AguafinaScript-Regular.ttf);

font-weight: normale;

}

Ora fai clic sul pulsante "Aggiorna file" per salvare le modifiche. Tieni presente che il codice del carattere carica il carattere ogni volta che un visitatore arriva al tuo sito. Il carattere tipografico, tuttavia, deve ancora essere applicato a nessun elemento. È necessario modificare lo stesso file style.css per assegnare un carattere a un elemento specifico. Il codice seguente, ad esempio, fa sì che il titolo del nostro sito Web utilizzi lo script del carattere.

.sito-titolo {

famiglia di caratteri: “Aguafina Script-Regular” , Arial, sans-serif;

}

Come impostare caratteri personalizzati utilizzando i plugin di WordPress

Per tutti gli utenti di WordPress, l'utilizzo di plug-in di font è il modo più semplice per impostare font personalizzati. Qui abbiamo presentato alcuni dei plugin di font più semplici e utili per aggiungere font personalizzati sul sito Web di WordPress.

WP Google Fonts

custom fonts

Puoi utilizzare caratteri personalizzati e applicarli a determinati elementi CSS utilizzando il plug -in WP Google Fonts . Installa il plug-in WP Google Fonts dalla directory dei plug-in di WordPress e utilizza la dashboard di WordPress per accedere al pannello di controllo dei caratteri di Google. Puoi scegliere i caratteri tipografici e regolare opzioni come lo stile del carattere, gli elementi allocati e altro.

Plugin di caratteri

custom fonts

Fonts Plugin è un'alternativa freemium a Easy Google Fonts che funziona in modo simile, consentendoti di integrare facilmente Google Fonts nelle tue pagine senza dover cambiare il tema. Funziona anche con Customizer, consentendoti di provare opzioni di carattere alternative prima di pubblicarle. Fonts Plugin ha anche l'integrazione con Adobe Fonts, che è un bonus. Font Plugin ti consente di utilizzare anche la libreria di caratteri di Adobe nel tuo materiale.

Crea un sito Web accattivante utilizzando caratteri personalizzati

La leggibilità e l'eleganza del tuo testo hanno un impatto su quanto i tuoi visitatori si divertono a navigare nel tuo sito. Chiunque può ora scegliere tra un gran numero di caratteri tipografici da utilizzare sul proprio sito web. Non c'è motivo per cui al giorno d'oggi dovresti utilizzare qualsiasi vecchio font sul tuo sito web. La personalizzazione della tipografia di WordPress è ora completamente sotto il tuo controllo.

Se trovi questo blog interessante e utile, iscriviti al nostro blog per leggere altri blog come questo. Unisciti alla nostra community per condividere anche i tuoi pensieri.