6 modi per caricare file HTML su WordPress senza errori

Pubblicato: 2022-12-12

Caricare file HTML su WordPress non è un'attività di routine per la maggior parte degli utenti di WordPress. Poiché WordPress ti consente di creare contenuti senza modificare il codice, non è necessario caricare alcun file HTML personalizzato.

Tuttavia, mentre costruisci e fai crescere il tuo sito WordPress, a volte avrai bisogno di contenuti personalizzati. È qui che i file e le pagine HTML tornano utili. Importarli nel tuo sito ti farà risparmiare un sacco di tempo creando elementi personalizzati e configurando le impostazioni da zero.

Questo articolo discuterà in dettaglio il problema e come caricare i file HTML su WordPress. Non perderti!

  • Cos'è un file HTML?
  • Cos'è un modello HTML?
  • Perché dovresti caricare file HTML su WordPress?
  • #1 Importa file HTML utilizzando la dashboard di amministrazione di WordPress
  • #2 Carica file HTML con un client FTP
  • #3 Collega i file HTML a WordPress tramite cPanel
  • #4 Applica un plugin convertitore da HTML a WordPress
  • #5 Usa lo strumento gratuito online per convertire HTML in WordPress
  • #6 Carica il file HTML su WordPress per la verifica di Google
  • Proteggi file e pagine HTML

Cos'è un file HTML?

HTML è l'acronimo di Hypertext Markup Language, che è un linguaggio utilizzato per creare e strutturare documenti elettronici o pagine web. In effetti, la maggior parte delle pagine Web che navighi su Internet al giorno d'oggi sono scritte utilizzando il codice HTML.

I file HTML sono documenti di solo testo. Contengono il codice responsabile per garantire che i contenuti e le immagini del tuo sito siano formattati e visualizzati correttamente. In altre parole, l'HTML aiuta i browser web a capire come visualizzare la struttura del tuo sito per i visitatori.

pda-upload-html-files-to-wordpress-example

L'HTML crea le basi per le tue pagine web. Puoi generare tu stesso file HTML o prendere file esistenti, come Google Docs, e convertirli in HTML. È possibile inserire un piccolo codice CSS per aggiungere alcuni elementi di design personalizzati alla base. In questo modo, il tuo sito web apparirà perfetto per i visitatori del sito.

Cos'è un modello HTML?

Un modello HTML si riferisce a un file HTML pre-progettato che puoi facilmente caricare sul tuo sito e utilizzare. Include testo, immagini, stili di carattere e JavaScript.

Per coloro che non dispongono di una base di codifica, è meglio caricare un modello HTML già creato su WordPress. Grazie ai modelli HTML, puoi sviluppare pagine web accattivanti senza preoccuparti di rovinare la struttura del tuo sito.

Esistono diverse differenze tra i modelli HTML e i temi WordPress che dovresti conoscere prima di utilizzarli.

Modelli HTML Temi WordPress
Formato File zip autonomi. File zip autonomi.
Impatto sulla L'aspetto di una singola pagina web sul tuo sito web. L'aspetto dell'intero sito web.

Perché dovresti caricare file HTML su WordPress?

Come accennato in precedenza, WordPress ti consente di creare pagine Web senza codifica. Tuttavia, ci sono diversi motivi per cui a volte è necessario utilizzare file HTML.

Metodo per risparmiare tempo: hai già scritto un ottimo modello HTML per il tuo vecchio sito web. Ti costerà tempo e fatica ricostruirlo da zero per il tuo nuovo sito web. Pertanto, si consiglia di riutilizzare il modello esistente per risparmiare tempo assicurandosi che tutto sia perfetto.

Inoltre, questo elimina anche il rischio di errori umani in quanto è possibile caricare il contenuto del tutto tramite file HTML.

Layout personalizzato: un altro vantaggio del caricamento di un file HTML su WordPress è il layout altamente personalizzabile. Ti consente di personalizzare i tuoi contenuti a tuo piacimento al di fuori del supporto del tuo tema. Puoi utilizzare un file HTML già pronto o scriverlo tu stesso e caricarlo semplicemente sul tuo sito.

Verifica del sito: Ultimo ma non meno importante, il caricamento di file HTML su WordPress può aiutarti con la verifica del sito web. Ad esempio, devi caricare un file di verifica HTML sul tuo sito per utilizzare lo strumento Google Search Console. Ciò offre a Google la possibilità di accedere e indicizzare correttamente il tuo sito.

Come caricare file HTML su WordPress

Hai imparato tutto sui file HTML. Ora diamo un'occhiata a come caricare file HTML su WordPress.

Continuare a leggere!

#1 Importa file HTML utilizzando la dashboard di amministrazione di WordPress

La dashboard di WordPress integrata ti consente di caricare file HTML direttamente attraverso i tuoi post, le pagine o la libreria multimediale. Nel caso in cui utilizzi l'editor Gutenberg, devi prima inserire un blocco File . Quindi, seleziona Carica per aggiungere i file HTML a WordPress.

pda-gutenberg-file-block

In alternativa, l'editor Gutenberg fornisce anche un blocco HTML personalizzato . Puoi copiare e incollare manualmente il codice HTML in questo blocco. Tuttavia, per i caricamenti di file di grandi dimensioni, sarebbe più semplice ed efficace utilizzare l'opzione File .

pda-blocco-html personalizzato

Se utilizzi l'editor classico, premi il pulsante Aggiungi media nei tuoi post, nelle pagine o nella libreria multimediale. Successivamente, fai clic su Carica per caricare i tuoi file HTML.

pda-wordpress-aggiungi-pulsante-media

Piccolo avviso: a volte potresti riscontrare un errore durante il caricamento di file HTML su WordPress utilizzando la dashboard di amministrazione. Il problema più comune è "Siamo spiacenti, questo tipo di file non è consentito per motivi di sicurezza".

Questo problema si verifica perché il tuo sito WordPress attualmente non supporta il tipo di file .html. Per consentire i caricamenti non filtrati in WordPress, consulta la nostra guida per maggiori dettagli.

#2 Carica file HTML con un client FTP

L'utilizzo di un client FTP per caricare file HTML è utile quando si desidera lavorare localmente su un sito di prova. Ti aiuta a testare tutte le modifiche apportate prima che il tuo sito web venga pubblicato. Inoltre, questo previene inutili tempi di inattività se qualcosa scivola.

In questa sezione, ti guideremo attraverso come caricare file HTML su WordPress usando FileZilla. Per iniziare, segui le istruzioni di seguito:

  1. Esegui il backup del tuo sito.
  2. Apri FileZilla e seleziona Quickconnect dopo aver inserito le tue credenziali.

pda-carica-file-html-su-wordpress-usando-filezilla

3. Vai alla cartella principale del tuo sito web.

4. Trova e fai clic con il pulsante destro del mouse sul file HTML che desideri caricare dal tuo computer. Quindi premi Carica per aggiungerlo al tuo sito web.

Dopo aver caricato correttamente il file, controlla se viene visualizzato correttamente sul tuo sito web. Per fare ciò, digita l'URL del tuo sito web con il nome del file HTML alla fine nel tuo browser. Ad esempio, www.pdagold.com/html-file . Se funziona, verrai reindirizzato alla nuova pagina web che hai creato con il file HTML.

#3 Collega i file HTML a WordPress tramite cPanel

L'ultimo metodo che condivideremo con te è l'utilizzo del cPanel. Innanzitutto, accedi al cPanel del tuo account di hosting e scegli lo strumento File Manager .

pda-cpanel-file-manager-carica-file-html-su-wordpress

Ora hai 2 opzioni:

  • Carica il file HTML direttamente nella cartella principale.
  • Crea una nuova cartella e carica il file HTML in essa.

Con la prima tecnica, devi decomprimere il file HTML dove lo hai salvato. Quindi cambia la cartella index.html in qualcosa di nuovo. Infine, comprimi nuovamente il file per continuare a caricarlo su WordPress. Il modello HTML sostituirà la home page del tuo sito se non segui rigorosamente questi passaggi.

Ti consigliamo vivamente la seconda tecnica per assicurarti di non rovinare il tuo sito web:

  1. Vai alla cartella public_html del tuo sito.

pda-upload-file-html-wordpress-cartella-html-pubblica

2. Selezionare Nuova cartella .

pda-crea-una-nuova-cartella-carica-il-file-html-nel-cpanel-di-wordpress

3. Assegna un nome alla nuova cartella e fai clic su Crea nuova cartella .

4. Fare doppio clic sulla cartella appena creata e selezionare Carica per scegliere il file HTML.

pda-carica-i-file-html-sul-cpanel-di-wordpress

5. Il tuo file HTML compresso apparirà nella cartella. Basta decomprimere il file HTML facendo clic con il pulsante destro del mouse e scegliendo Estrai .

pda-extract-html-file-cpanel

6. Selezionare Estrai file per completare il processo di decompressione dei file.

7. Verifica se il file è stato caricato correttamente come indicato nel metodo n. 2.

Se ti imbatti in un errore 404, è probabile che il tuo server non supporti il ​​​​reindirizzamento index.php . In questo caso, torna al File Manager e accedi al tuo file .htaccess . Quindi, inserisci il seguente codice e salva le modifiche:

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

Questo codice aiuta a reindirizzare il tuo file index.php e caricarlo nel browser. Di conseguenza, l'errore 404 scomparirà.

#4 Applica un plugin convertitore da HTML a WordPress

Questo metodo è adatto ai principianti in quanto non richiede alcuna abilità di programmazione. Il tuo compito è attivare il plug-in scelto e si occuperà del resto per te.

Numerosi plug-in disponibili ti consentono di caricare e convertire HTML in contenuti WordPress senza toccare un pezzo di codice. Non dovrai più preoccuparti della codifica. Per tua comodità, abbiamo ristretto l'elenco ai 7 migliori plugin.

Diamo un'occhiata a loro!

Raccomandazioni sui plug-in

Inserisci snippet HTML: converti i codici HTML, CSS e JavaScript in codici brevi e integra i tuoi snippet nelle pagine e nei widget di WordPress.

Sitemap semplice: crea una sitemap HTML reattiva e visualizzala in anteprima direttamente all'interno dell'editor senza complicati shortcode.

HTML non elaborato: abilita l'HTML non elaborato o qualsiasi altro codice nei tuoi post e disabilita le virgolette intelligenti e la formattazione automatica.

Codice WP: inserire frammenti di codice PHP, script di intestazione e piè di pagina e codici di pixel pubblicitari in WordPress con logica condizionale.

WP Coder: aggiungi CSS, HTML e JavaScript personalizzati alle tue pagine web.

Consenti HTML nelle descrizioni delle categorie: consente di applicare HTML non filtrato nelle descrizioni delle categorie disabilitando i filtri WordPress selezionati.

Code Embed: Fornisci un modo semplice ed efficiente per incorporare codice come JavaScript e HTML nei tuoi post e nelle tue pagine.

Istruzioni per il plug-in

In questo tutorial, ti guideremo su come inserire codici e file HTML personalizzati utilizzando il plug-in WP Coder.

pda-wp-coder-upload-html-to-wordpress

Ecco come funziona:

  1. Installa e attiva il plug-in.
  2. Nella dashboard di amministrazione di WordPress, vai a Wow PluginsWP Coder .
  3. Per aggiungere un nuovo codice HTML, copialo e incollalo nella sezione Codice HTML sotto la scheda Aggiungi nuovo .

pda-wp-coder-codice-html

Oppure puoi andare al menu Includi file . Copia e incolla l'URL del file HTML che hai caricato nella libreria multimediale nella casella URL del file . Quindi, fai clic su Aggiungi nuovo per terminare.

pda-wp-coder-plugin-upload-html-file-to-wordpress

4. Premi il pulsante Salva e copia lo shortcode generato nella sezione Pubblica .

pda-wp-coder-copy-shortcode

5. Incolla lo shortcode ovunque tu voglia sulla tua pagina e goditi i risultati.

#5 Usa lo strumento gratuito online per convertire HTML in WordPress

Per convertire il tuo codice HTML in WordPress utilizzando uno strumento online:

  1. Vai al sito Web htmltowordpress.
  2. Carica il file zip HTML del tuo sito web nella casella.

pda-upload-file-html-to-strumento-online-wordpress

3. Sarai in grado di visualizzare in anteprima il tuo sito Web WordPress. Premi il pulsante Personalizza nella parte superiore della pagina.

anteprima del tema pda-wordpress

4. Modifica il sito web a tuo piacimento.

5. Premi su Salva e pubblica per terminare.

#6 Carica il file HTML su WordPress per la verifica di Google

Ti mostreremo come caricare un file di verifica HTML su WordPress. Ecco il percorso:

  1. Vai su Google Search Console e fai clic su Inizia ora .
  2. Inserisci il nome utente e la password del tuo account Gmail.
  3. Verifica il tuo sito web utilizzando il suo nome di dominio o il prefisso dell'URL . L'opzione Dominio supporta solo la verifica DNS. Per i caricamenti di file HTML, scegli il prefisso URL . Inserisci l'URL del tuo sito web e clicca su Continua .

pda-google-search-console

4. Nella sezione File HTML , seleziona il pulsante che ti chiede di scaricare il file .

pda-google-search-console-upload-file-di-verifica-html

5. Dopo aver scaricato il file HTML sul tuo computer locale, carica il file sul tuo sito Web WordPress.

Proteggi file e pagine HTML

Arriva un momento in cui proteggere i tuoi file HTML è essenziale. Ad esempio, quando desideri che solo gli amministratori o ruoli utente specifici accedano ai file. In una situazione del genere, PDA Gold soddisferà le tue esigenze.

pda-upload-html-wordpress

Il plug-in ti consente di proteggere i file HTML caricati in una cartella nella directory principale di WordPress. Una volta protetti, i visitatori non autorizzati verranno reindirizzati a una pagina di errore quando tentano di accedere ai file.

La cosa più interessante è che ti consente di inserire i file HTML protetti nel contenuto utilizzando il tag iFrame. In questo modo, i tuoi visitatori possono visualizzare l'HTML tramite iFrame ma allo stesso tempo non possono accedere direttamente ai file.

Per i passaggi dettagliati, consulta la nostra guida su come proteggere i file HTML di WordPress visualizzati all'interno di iFrame.

Fai pieno uso dei tuoi file HTML ora!

Queste sono tutte le cose che dovresti sapere sul caricamento di file HTML su WordPress. Per concludere, i file HTML sono utili quando hai bisogno di un layout di pagina personalizzato. È anche un'ottima opzione in caso di migrazione del tuo vecchio sito a quello nuovo.

La parte migliore è che il caricamento e l'utilizzo di file HTML in WordPress non sono compiti difficili. Con pochi semplici passaggi, puoi creare bellissime pagine web. Quindi, non aspettare. Inizia subito con i tuoi file HTML!

Per la modifica dell'HTML in WordPress, puoi fare riferimento al nostro articolo per ulteriori informazioni.

Infine, non dimenticare di iscriverti al nostro sito Web per ottenere istruzioni più utili!