Per impostazione predefinita, è possibile costruire pagine e creare contenuti all’interno di WordPress senza dover caricare file HTML personalizzati. Questo perché il core di WordPress include già dei tipi di contenuto. Inoltre, il tema di WordPress che decidete di usare avrà probabilmente il proprio set di template di pagina pre-progettati: li potete sfruttare per creare un sito web unico che soddisfi tutte le vostre esigenze.

Oltre a questo, esistono moltissimi plugin per landing page di WordPress che potete usare per creare template di pagina personalizzati per i visitatori che arriveranno sul vostro sito dai motori di ricerca, dalle campagne email e persino dai social media.

Quindi, in realtà, raramente avrete bisogno di caricare file HTML su WordPress perché, di solito, tutto il necessario per dare forma al vostro sito è già disponibile. Detto questo, ci sono alcune ragioni per cui potreste voler sapere come caricare un file HTML su WordPress, alcune delle quali vanno oltre l’upload di un template per il design web.

Ecco perché in questo post, vi mostrerò come caricare i file HTML su WordPress. Vedremo anche nel dettaglio perché vi servirà imparare questo procedimento ed essere pronti per ogni evenienza.

Che cos’è un file HTML?

L’acronimo HTML sta per Hypertext Markup Language ed è stato progettato per la prima volta da Tim Berners-Lee nel 1990. In pratica, l’HTML è il codice utilizzato per creare documenti elettronici su Internet, meglio conosciuti come pagine web. Ogni pagina web che vedete su internet è stata scritta usando codice HTML.

Il codice HTML delle pagine web del vostro sito si assicura che tutti i vostri testi e le immagini siano formattati nel modo giusto.

Senza l’HTML, i browser non capirebbero in che modo riprodurre visivamente la struttura del vostro sito web per gli utenti. Con il giusto codice HTML che crea la base per le vostre pagine web, e un pizzico di codice CSS per aggiungere gli elementi di design, il vostro sito web appare esattamente come dovrebbe.

Che cos’è un template HTML?

Abbiamo quindi assodato che l’HTML è il codice responsabile della creazione della struttura delle singole pagine web su internet.

Ma cos’è un template HTML?

Un template HTML è un set pre-progettato di file HTML che include elementi testo, immagini e file di supporto per stili di font e Javascript. In altre parole, un template HTML è un pacchetto pre-costituito di codice HTML che potete facilmente caricare e utilizzare sul vostro sito web.

Quando usate un template HTML sul vostro sito WordPress, caricate il file e inserite il testo e le immagini che il template deve visualizzare sul front end del vostro sito.

È importante ricordare che i template HTML sono diversi dai temi WordPress:

  • Temi WordPress: anche se si inseriscono testi e immagini nei temi di WordPress, questi sono responsabili dell’aspetto e dell’atmosfera dell’intero sito web. Molti dei cambiamenti che coinvolgono elementi del tema del vostro sito sono globali, cioè si applicano a tutto il sito web.
  • Template HTML: sono file zip indipendenti da caricare individualmente sul vostro sito. Essi hanno a che vedere solo con il look and feel di una singola pagina web del sito web. In altre parole, le modifiche apportate a un template HTML già caricato interesseranno solo quella pagina web.

Purtroppo molte persone non capiscono le differenze tra temi e template HTML e usano i termini ‘tema’ e ‘template’ in modo intercambiabile.

Perché potrebbe essere necessario caricare un file HTML su WordPress

Ci sono alcune ragioni specifiche per cui potreste desiderare di caricare un file HTML su WordPress:

  1. Avete i vostri preferiti: se stavate usando un bellissimo template HTML su un vecchio sito web e volete usarlo sul nuovo sito, potreste volerlo caricare piuttosto che ripetere l’intera operazione. In questo modo risparmiate tempo e vi assicurate che abbiano esattamente lo stesso aspetto.
  2. Desiderate un layout di pagina personalizzato: se il tema WordPress corrente non supporta un layout di pagina specifico, potete caricare un file HTML con il design desiderato e personalizzarlo a vostro piacimento.

Infine, potreste aver necessità di verificare il vostro sito WordPress con Google Search Console e volete usare il metodo che richiede il caricamento di un file HTML di verifica di Google.

Il modo in cui il vostro sito appare nei motori di ricerca, soprattutto se si tratta di Google, gioca un ruolo fondamentale nel vostro successo come proprietari di un sito web.

Ecco perché esistono strumenti come Google Search Console. Con Google Search Console, vi assicurate che Google indicizzi e classifichi il vostro sito nei risultati di ricerca pertinenti, il tutto nella speranza di arrivare alla prima pagina.

Google Search Console vi fornisce anche informazioni sulle vostre SERP attuali (pagine dei risultati dei motori di ricerca), in modo da poter migliorare i tuoi sforzi di SEO e guadagnare più clickthrough al tuo sito.

Il fatto è che, per utilizzare Google Search Console, dovrete per forza verificare il vostro sito WordPress. E uno dei modi migliori per farlo è caricare un file HTML di verifica di Google.

Ora, diamo un’occhiata ai diversi modi per caricare un file HTML su WordPress.

Metodo 1: Come caricare file HTML su WordPress dalla bacheca

Il primo metodo che vedremo per caricare un file HTML su WordPress riguarda la bacheca di WordPress.

Per completare questo processo non avrete bisogno di nient’altro che del backend del vostro sito web e di un template HTML: caricherete infatti il file HTML direttamente attraverso un post, una pagina o la libreria dei media.

Per caricare un file HTML attraverso un post o una pagina, inserite un blocco ‘File’ nell’Editor Gutenberg. Quindi, fate clic su Upload per caricare il file HTML.

Caricare il file HTML in Gutenberg
Caricare il file HTML in Gutenberg

Ecco invece come fare se avete disattivato Gutenberg e state usando il Classic Editor. Per caricare il file HTML, vi basterà fare clic su Add Media e poi Upload.

Scegliete il file HTML che volete caricare e quindi fate clic su Insert into post. In questo il link del file verrà inserito nel post o nella pagina e verrà salvato automaticamente nella libreria dei media.

Caricare il file HTML nel Classic Editor
Caricare il file HTML nel Classic Editor

In alternativa, potete saltare l’upload del file HTML in un post o pagina in WordPress e caricarlo direttamente nella vostra libreria dei media. Fate clic su Libreria Media nella dashboard WordPress, quindi su Aggiungi Nuovo e scegliete il file HTML dalla posizione in cui lo avete salvato (ad esempio, il computer, il disco rigido o la memoria esterna).

Tenete presente che potreste incorrere in un errore quando caricate il vostro file HTML e usate Gutenberg. Ecco come apparirà:

Tipo di file non consentito
Tipo di file non consentito

Fate clic qui per leggere le istruzioni dettagliate su come correggere l’errore “Sorry, This File Type Is Not Permitted for Security Reasons” in WordPress.

Metodo 2: Come caricare file HTML su WordPress utilizzando un client FTP

Caricare file HTML tramite la dashboard di WordPress è il metodo più semplice. Tuttavia, per template di grandi dimensioni composti da più file, è meglio usare un client FTP come FileZilla.

L’utilizzo di un client FTP è utile anche per quando volete lavorare localmente su un sito di prova prima di lanciare qualsiasi modifica nel vostro sito live. In questo modo eviterete inutili tempi di inattività, se qualcosa va storto.

Per iniziare, create sempre prima un backup del vostro sito perché non sapete mai che effetti potrebbe provocare il file HTML quando lo caricate sul sito.

Aprite poi il vostro client FTP.

Ora dovrete connettervi all’account del vostro web host inserendo le vostre credenziali FTP. Queste informazioni si trovano solitamente nel vostro account di web hosting. Se avete problemi a trovarle, contattate il vostro host e fatevi aiutare da loro.

Se utilizzate l’hosting Kinsta, accedete prima al vostro account MyKinsta e fate clic suSiti nel cruscotto e poi su Info per ottenere le credenziali necessarie.

Ottenere i dettagli SFPT in MYKinsta
Ottenere i dettagli SFPT in MYKinsta

A questo punto dovreste vedere le vostre credenziali sotto la voce SFTP/SSH. Avrete bisogno del vostro nome utente, password e numero della porta.

Dettagli SFTP
Dettagli SFTP

Ecco le informazioni di cui avete bisogno per entrare in FileZilla:

  • Host: il nome di dominio del vostro sito preceduto da “sftp://”. Ad esempio, dovrete inserire sftp://www.mysite.com.
  • Nome utente: lo trovate nel vostro cruscotto MyKinsta
  • Password: lo trovate nel cruscotto MyKinsta
  • Porta: lo trovate nel cruscotto MyKinsta

Questo è ciò che apparirà nella parte superiore dello schermo di FileZilla:

Accedere a FileZilla
Accedere a FileZilla

Dopo aver inserito le credenziali, fate clic su Quickconnect.

Ora è il momento di caricare il file HTML dal vostro computer a WordPress. Iniziate a navigare fino alla cartella principale del vostro sito (quella che contiene la cartella wp-content, il file wp-config.php, ecc.

Poi, andate a sinistra e cercate il file HTML che avete salvato. Quando lo trovate, fate clic con il tasto destro del mouse e selezionate Upload per aggiungerlo al vostro sito web. Per vedere tutti i file nascosti in Filezilla seguite questo breve tutorial.

 

File HTML caricato
File HTML caricato

Vedrete che il file è stato caricato con successo su WordPress. Per verificare che sia visibile sul vostro sito, digitate l’URL del sito web nel vostro browser e aggiungete il nome del file HTML alla fine. Per esempio, potrebbe essere qualcosa come: www.mywebsite.com/html-file.

In questo modo, verrete reindirizzati alla nuova pagina web che avete creato con il file HTML.

Metodo 3: Come caricare file HTML in WordPress utilizzando cPanel

L’ultimo metodo che condivideremo con voi prevede l’utilizzo di cPanel e del File Manager per caricare un file HTML su WordPress.

Iniziate accedendo al cPanel del vostro account di hosting e accedendo al File Manager.

FileManager nel cPanel
FileManager nel cPanel

Una volta che vi trovate nel File Manager, avete due opzioni:

    1. Creare una nuova cartella: creare una nuova cartella nella directory principale del vostro sito per caricare il vostro file HTML.
    2. Caricare direttamente nella cartella principale: invece di creare una nuova cartella, potete caricare l’HTML direttamente su WordPress. Se scegliete questa opzione, decomprimete il file HTML nel punto in cui è stato salvato, cambiate il nome della cartella index.html, e poi comprimete di nuovo il file per continuare a caricarlo su WordPress. Se non lo fate, il template HTML sovrascriverà la homepage del vostro sito.

Per questo esempio, creeremo una nuova cartella poiché ci sono alcuni passaggi extra da tenere in conto quando si esegue questa operazione.

Creare una nuova cartella e caricare un file HTML su WordPress

Per prima cosa, andate sulla cartella principale del vostro sito web (quella che contiene la cartella wp-content, il file wp-config.php, ecc.) Quindi fate clic su New Folder.

Assegnate un nome alla nuova cartella e fate clic su Create New Folder.

Creazione di una nuova cartella nel cPanel
Creazione di una nuova cartella nel cPanel

Fate doppio clic sulla cartella appena creata, quindi clic su Upload per selezionare il file HTML.

Pulsante Upload
Pulsante Upload

Una volta fatto questo, vedrete il vostro file HTML zippato nella cartella.

File HTML zippato
File HTML zippato

Ora è necessario decomprimere il file HTML facendo clic con il tasto destro del mouse e selezionando Extract.

Estrai file HTML
Estrai file HTML

Quando si aprirà la finestra modale, fate clic su Extract Files per completare il processo di decompressione. Quando il file HTML sarà decompresso, vedrete tutti i diversi file inclusi nel template. Questo significa che vedrete elementi come CSS, file di stile del font, immagini e JavaScript.

File HTML estratti
File HTML estratti

Ora tutto quello che dovete fare per assicurarvi che il template HTML e i file siano stati caricati è digitare l’URL del vostro sito nel browser e aggiungere il nome della nuova cartella alla fine.

Se si verifica un errore 404, non preoccupatevi. Si tratta di un errore comune di WordPress e può essere risolto facilmente.

Se il server non supporta il reindirizzamento, e il file index.php non viene reindirizzato durante il caricamento dell’URL nel browser, vedrete un errore 404 dopo aver caricato i file HTML.

Per risolvere il problema, rimanete all’interno del File Manager e accedete al vostro file .htaccess facendo doppio clic su di esso. Quindi, aggiungete il seguente codice e salvate le modifiche:

RewriteRule ^(.*)index\.(php|html?)$ /$1 [R=301,NC,L]

Questo codice reindirizzerà il file index.php e lo caricherà nel browser.

Riepilogo

WordPress è il CMS più utilizzato in circolazione perché offre ai proprietari di siti web la flessibilità necessaria per creare siti unici che si distinguono dalla concorrenza. Riuscire a caricare un file HTML su WordPress utilizzando uno qualsiasi dei suddetti metodi, è solo un altro esempio di come WordPress soddisfi le esigenze dei proprietari dei siti e dia loro la libertà di personalizzarli secondo necessità.

Inoltre, sapere come caricare un file HTML su WordPress può sempre tornare utile in caso di necessità. Dopo tutto, in qualsiasi momento potreste imbattervi in un template HTML che vi piace o aver bisogno di un certo tipo di layout di pagina che il vostro tema non supporta.