Conversione da HTML a WordPress (procedura dettagliata)


Conversione da HTML a WordPressLa strada dai siti costruiti con puro HTML a WordPress non è stata breve. Da un’esperienza interamente testuale, il web design è passato a una presenza web altamente interattiva. Inoltre, non dobbiamo più scrivere noi stessi il markup, ma possiamo lasciare che i sistemi di gestione dei contenuti facciano un duro lavoro.


Tuttavia, ciò non significa che i siti Web HTML statici non esistano più. In effetti, HTML5, l’ultima iterazione del linguaggio di markup, è molto potente e consente di creare siti Web di qualità senza un CMS dietro di essi.

Tuttavia, la crescente quota di mercato di WordPress mostra che sempre più persone stanno passando alla piattaforma.

Quota di mercato di WordPress nel 2019

Per alcuni di essi, significa passare dall’HTML statico a WordPress. Questo può essere un compito scoraggiante, ma questo post tenterà di spiegare come farlo in pochi semplici modi.

Di seguito, ti mostreremo diversi modi per convertire da HTML a WordPress. Innanzitutto, imparerai quali sono le diverse opzioni, nonché i loro pro e contro. Successivamente, ti mostreremo come eseguire ciascuno di essi passo dopo passo.

Muoviamoci.

I 3 modi per passare da HTML statico a WordPress

Per passare da HTML a WordPress, devi trasformare il tuo design HTML in un tema WordPress. Un tema controlla l’aspetto e la sensazione di un sito Web WordPress, mentre la funzionalità è fornita dal CMS stesso e da plugin aggiuntivi.

Per effettuare il passaggio, hai diverse opzioni. Qual è quello giusto per te dipende da fattori come il tempo e il denaro che sei in grado e disposto a investire, le tue capacità di programmazione e le tue preferenze personali. Le seguenti sono le opzioni principali.

A) Converti manualmente l’HTML in un tema WordPress

La prima opzione è anche la più tecnica. Se segui questa strada, prenderai il tuo codice esistente e lo userai come punto di partenza per creare i file dei temi di WordPress.

Non è troppo complicato, soprattutto se hai esperienza di programmazione. Puoi farlo con un po ‘di HTML, CSS e alcune conoscenze PHP. Molto è copia e incolla.

L’aspetto negativo: mentre finirai con un tema WordPress funzionante, non avrà tutte le funzionalità che WordPress ha da offrire. Ad esempio, a meno che non lo compili dopo il fatto, il tuo sito sarà privo di aree widget o la possibilità di modificare il menu dal backend di WordPress.

Mentre il tuo sito farà il suo lavoro, non sarai in grado di gestirlo completamente tramite WordPress. Per questo motivo, preferiamo personalmente l’opzione successiva.

B) HTML a WordPress tramite WordPress Child Theme

A nostro avviso, questa è probabilmente la strada più semplice e ragionevole in termini di sforzo e investimenti monetari. Invece di utilizzare il tuo sito esistente come punto di partenza, usi invece un tema WordPress già pronto. Quindi regola solo il suo design in modo che assomigli al tuo vecchio sito Web.

Ciò ti consente di sfruttare appieno WordPress pur mantenendo l’aspetto del tuo vecchio sito. Inoltre non dovrai aggiungere successivamente le funzioni di WordPress. Invece, puoi basarti su un tema esistente – qualcosa per cui la piattaforma WordPress è esplicitamente creata.

C) Importa contenuti da HTML a WordPress usando il plugin

Ovviamente, se non insisti nell’usare il tuo progetto attuale e sei pronto a cambiarlo, le cose diventano ancora più facili. In tal caso, tutto ciò che devi fare è impostare un sito, installare il tema e importare il contenuto HTML. Come vedrai di seguito, questo è un processo molto rapido e indolore.

A) Come convertire manualmente HTML in un tema WordPress

Se il tuo obiettivo è iniziare da zero e creare il tuo tema WordPress che assomigli al tuo sito Web HTML esistente, inizia da qui.

Non preoccuparti se sembra intimidatorio, vedrai che è tutt’altro. Bastano pochi file e cartelle, nonché alcuni copia e incolla.

1. Creare una cartella temi e file di base

La prima cosa che devi fare è creare una nuova cartella temi. Puoi farlo sul desktop come faresti per una directory sul tuo computer. Denominalo come vuoi che venga chiamato il tuo tema.

Successivamente, vai all’editor del codice e crea un numero di file di testo. Dai loro il nome seguente:

  • style.css
  • index.php
  • header.php
  • sidebar.php
  • footer.php

Non fare ancora nulla con loro, tieni i file aperti nell’editor. Ne avrai bisogno presto.

2. Copia i CSS esistenti sul foglio di stile di WordPress

Ora è il momento di preparare il foglio di stile di WordPress (il filestyle.css hai appena creato) per copiare il CSS del tuo vecchio sito al suo interno. Per questo, apri il file e incolla quanto segue:

/ *
Nome del tema: Venti tredici
URI del tema: http://wordpress.org/themes/twentythirteen
Autore: il team di WordPress
URI dell'autore: http://wordpress.org/
Descrizione: Il tema 2013 per WordPress ci riporta al blog, con una gamma completa di formati di post, ognuno magnificamente visualizzato nel suo modo unico. I dettagli del design abbondano, a partire da una vibrante combinazione di colori e immagini di intestazione corrispondenti, splendide tipografie e icone e un layout flessibile che si adatta perfettamente a qualsiasi dispositivo, grande o piccolo.
Versione: 1.0
Licenza: GNU General Public License v2 o successive
URI della licenza: http://www.gnu.org/licenses/gpl-2.0.html
Tag: nero, marrone, arancione, marrone chiaro, bianco, giallo, chiaro, una colonna, due colonne, barra laterale destra, larghezza flessibile, intestazione personalizzata, menu personalizzato, stile editor, immagini in primo piano, microformati, post-format, supporto lingua rtl, sticky post, pronto per la traduzione
Dominio di testo: ventitredici

* /

Questa è la cosiddetta intestazione del foglio di stile (Importante: non lasciare il commento/*...*/ tagga!). Compila ogni parte in questo modo:

  • Nome del tema – Ecco il nome del tuo tema. Può essere tutto quello che vuoi ma di solito è lo stesso del nome della cartella del tuo tema.
  • URI del tema – Di solito pubblichi qui la home page del tema ma puoi utilizzare il tuo indirizzo del sito.
  • Autore – Sei tu. Inserisci qui il tuo nome o come vuoi essere chiamato.
  • URI dell’autore – Un link alla tua homepage. Può essere quello che stai costruendo o qualunque cosa abbia senso.
  • Descrizione – Una descrizione facoltativa del tema. Questo apparirà nel backend di WordPress.
  • Versione – La versione del tuo tema. Dal momento che non lo stai pubblicando, non importa davvero. Di solito inseriamo 1.0 qui.
  • Licenza, Licenza URI, Tag – Queste cose sono importanti solo se hai intenzione di inviare il tuo tema al Directory dei temi di WordPress. Puoi lasciarli fuori in questo caso, li abbiamo appena inclusi per motivi di completamento.

Dopo l’intestazione, copia e incolla il CSS esistente dal tuo sito Web HTML statico. Quindi, salva il file nella nuova cartella del tema e chiudilo. È ora di passare al resto.

3. Separare il codice HTML esistente

Per la parte successiva, devi capire che WordPress di solito usa PHP per estrarre informazioni dal suo database. Per questo motivo, è necessario dividere il codice HTML esistente in diversi pezzi in modo che il CMS possa metterli insieme correttamente.

Anche se questo sembra complicato, tutto ciò che significa è che copi e incolli parti del tuo documento HTML in diversi file PHP. Per dimostrarlo meglio, abbiamo messo insieme una semplice pagina di esempio che puoi vedere di seguito.

html alla pagina di esempio di wordpress

Come puoi vedere, è un modello HTML standard che include un’intestazione, un’area di contenuto, una barra laterale e un piè di pagina. Il codice di accompagnamento è questo:





Titolo del sito Web







Titolo del sito Web

  • articolo di navigazione n. 1
  • articolo di navigazione n. 2
  • articolo di navigazione n. 3

Titolo dell'articolo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel Vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. Sempre di conseguenza, eu porta velit mollis nec.

sottotitolo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel Vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. Sempre di conseguenza, eu porta velit mollis nec. Curabitur posuere enim eget turpis feugiat tempor. Etiam ullamcorper lorem dapibus velit suscipit ultrices. Proin in est sed erat facilisis pharetra.

sottotitolo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel Vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. Sempre di conseguenza, eu porta velit mollis nec. Curabitur posuere enim eget turpis feugiat tempor. Etiam ullamcorper lorem dapibus velit suscipit ultrices. Proin in est sed erat facilisis pharetra.

Se il tuo design è diverso, potresti dover modificare leggermente i passaggi seguenti. Tuttavia, l’intero processo rimane lo stesso.

Innanzitutto, apri la tua corrente index.html (il file principale del tuo sito HTML). Dopodiché, esamina i tuoi file WordPress appena creati e copia quanto segue in essi (gli esempi seguenti sono il mio markup):

header.php

Tutto dall’inizio del tuo file HTML all’area del contenuto principale (generalmente indicato con

o

) va in questo file. Oltre a ciò, proprio prima di dove dice, copia e incolla . Questo è fondamentale per il corretto funzionamento di molti plugin di WordPress.




Titolo del sito Web






Titolo del sito Web

  • articolo di navigazione n. 1
  • articolo di navigazione n. 2
  • articolo di navigazione n. 3

sidebar.php

Tutto ciò che appartiene alla sezione

Dopo di ciò, hai finito index.html e può chiuderlo. Salvare tutti gli altri file nella cartella del tema e chiuderli tranne header.php e index.php. Hai ancora del lavoro da fare con loro.

4. “WordPressify” Header.php e Index.php

Per l’intestazione, non resta che cambiare la chiamata per il foglio di stile dal formato HTML a WordPress. Per fare ciò, cerca un collegamento esistente in sezione. Potrebbe assomigliare a questo:

Sostituiscilo con questo:

Bene, ora puoi salvare e chiudere header.php. Quindi vai a index.php. Dovrebbe essere vuoto al momento. Quindi, prima copia e incolla queste righe di codice:




Queste sono le chiamate per gli altri file che contengono il resto del tuo sito. Potresti notare lo spazio tra la chiamata per l’intestazione e la barra laterale. Ecco dove aggiungere Il cappio.

Quest’ultima è la parte di WordPress in cui il CMS genera contenuto creato nel back-end. È fondamentale se vuoi che WordPress aggiunga dinamicamente contenuti alle tue pagine che importerai in seguito. A tal fine, incollalo qui subito dopo :


Adesso risparmia index.php archiviare e chiuderlo. Molto bene! Il tuo tema di base è pronto. Ora puoi aggiungerlo al tuo nuovo sito WordPress.

5. Creare uno screenshot e caricare il tema

Ora aggiungerai uno screenshot del tema che, insieme alle informazioni dall’intestazione del foglio di stile, servirà come anteprima del tuo sito Web nel backend di WordPress.

Per fare ciò, apri il tuo sito esistente in un browser e fai uno screenshot con il tuo metodo preferito. Successivamente, apri il software di modifica delle immagini che preferisci e ritaglialo a 880 × 660 pixel. Salva come screenshot.png e aggiungilo alla cartella del tuo tema. Ora sei pronto per caricare il tuo tema.

Per ottenere il nuovo tema sul tuo sito WordPress, hai diverse opzioni. Tuttavia, il prerequisito è che tutti i file risiedano nella cartella del tema.

La prima opzione è quella di creare un file zip da esso. Successivamente, vai sul tuo sito WordPress e poi su Aspetto> Temi. Qui, clicca Aggiungere nuova in alto e poi Carica tema.

carica il tema convertito

Nel menu imminente utilizzare il pulsante per navigare fino alla posizione del file zip. Contrassegnalo e fai clic Aperto, poi Installa ora. Al termine, attiva il tema.

In alternativa, puoi connetterti al tuo server via FTP (o semplicemente andare alla directory locale sul tuo disco rigido) e navigare verso wp-content / themes. Quindi, carica la cartella del tuo tema (decompresso) lì. Successivamente, attiva il tema dallo stesso posto di prima.

Bello! Il front-end del tuo nuovo sito dovrebbe ora apparire come il tuo vecchio sito. Tutto ciò che resta per completare il passaggio da HTML a WordPress è importare i tuoi contenuti esistenti. Tratteremo ulteriormente di seguito quando parleremo dell’utilizzo di un tema WordPress esistente.

Tieni presente, tuttavia, che mentre il tema di base funziona ora, ci sono più cose che puoi fare per integrare meglio il tuo HTML con WordPress. Ciò comprende rendendo modificabile il titolo e la descrizione del tuo blog, aggiunta di aree widget, commenti e molto altro. Potrebbe anche essere necessario aggiungere markup CSS perché il contenuto non fa parte del design originale come le immagini.

Dato che è un sacco di lavoro, ci piace personalmente usare una soluzione che ha già tutta quella funzionalità e necessita solo di un cambiamento di progettazione. Questo è ciò che ti mostreremo dopo.

B) HTML a WordPress tramite WordPress Child Theme

Se quanto sopra sembra troppo intenso per te, il metodo successivo potrebbe essere più gestibile. Ti consente di sfruttare migliaia di temi WordPress esistenti pur mantenendo il tuo design originale.

Questo è usando un cosiddetto tema figlio. Questi temi si basano su un altro tema (il genitore) che non si regge da solo ma modifica semplicemente il tema del genitore in base alle proprie esigenze. Abbastanza facile da fare anche se richiede un po ‘di lavoro investigativo.

1. Scegli un tema adatto

Il primo passo è scegliere un tema adatto su cui basare il tuo design. Per questo, aiuta a trovare un tema vicino al tuo design esistente o utilizzare un framework di temi o un tema di partenza, che sono entrambi fatti per funzionare come base per temi personalizzati.

Controlla il Directory dei temi di WordPress, la nostra lista di temi fantastici o esaminare temi premium per trovare un candidato adatto. Dopo alcune ricerche, abbiamo deciso che Venti Dodici Il tema sarebbe un buon punto di partenza per il mio passaggio da HTML a WordPress. Di solito, sceglieremmo qualcosa di più aggiornato, ma si adatta bene al design semplice con cui stiamo lavorando.

Dopo aver scelto, installa il tema sul tuo sito Web WordPress come se dovessi installare qualsiasi tema. Non è necessario attivarlo. Come accennato, è lì solo per fornire una base con cui lavorare. Il resto accade nel tema del bambino.

2. Crea una nuova cartella

Analogamente al metodo precedente, per il tema figlio, è necessario creare una cartella del tema. Qui è dove inserirai tutti i file che appartengono ad esso.

Quando si creano temi secondari, è comune chiamare la cartella con lo stesso nome del tema principale plus -bambino. Quindi, poiché il nostro tema figlio si basa sul tema Twenty Twelve, chiamiamo la sua directory twentytwelve-figlio.

Qualunque sia il nome che scegli, assicurati di non includere spazi in quanto non funzionerà in questo modo.

3. Imposta il foglio di stile

Il tema figlio ha anche bisogno di un foglio di stile. Questo funzionerà quasi come il foglio di stile creato sopra. Tuttavia, ha un’intestazione leggermente diversa e conterrà meno codice.

Passeremo alla seconda parte più tardi. Per ora, crea il solito style.css e posizionalo nella cartella del tema. Quindi, aggiungi quanto segue:

/ *
Nome del tema: Venti quindici bambini
URI del tema: http://example.com/twenty-fifteen-child/
Descrizione: Tema dei venti quindici bambini
Autore: John Doe
URI dell'autore: http://example.com
Modello: ventiquattro
Versione: 1.0.0
Licenza: GNU General Public License v2 o successive
URI della licenza: http://www.gnu.org/licenses/gpl-2.0.html
Tag: chiaro, scuro, a due colonne, barra laterale destra, layout reattivo, pronto per l'accessibilità
Dominio di testo: ventiquindici figli
* /

Come puoi vedere, è molto simile all’intestazione del foglio di stile che hai usato prima con un’eccezione: contiene il file Modello etichetta.

In quella sezione, dovresti inserire il nome del tema che funzionerà come genitore. Senza di essa, il tema figlio non funzionerà. Per evitare ciò, inserire il nome della cartella del genitore. Quindi, per Twenty Twelve, sarebbe Modello: venti dodici.

4. Crea Functions.php ed Eredita stili padre

Con solo il foglio di stile e la cartella, è già possibile attivare il tema figlio. Tuttavia, ciò non farebbe molto bene poiché in questo momento il tuo sito sembrerebbe una pagina HTML senza stile.

Per cambiarlo, devi prima ereditare gli stili del genitore e, per questo, devi functions.php. Questo file è una parte importante di qualsiasi installazione di WordPress e ti consente di apportare ampie modifiche al tuo sito web.

Tuttavia, in questo caso, lo userai solo per chiamare lo stile del genitore. Per questo, crea un nuovo file e chiamalo functions.php. La prima cosa che aggiungerai all’inizio è questa:

Con un tag PHP di apertura, il file è teoricamente pronto ma non fa ancora nulla. Quindi, dovrai anche inserire questo:

funzione child_theme_enqueue_styles () {

$ parent_style = 'parent-style';

wp_enqueue_style ($ parent_style, get_template_directory_uri (). '/style.css');
wp_enqueue_style ('stile bambino',
get_stylesheet_directory_uri (). '/Style.css',
array ($ parent_style),
wp_get_theme () -> get ( 'Version')
);
}
add_action ('wp_enqueue_scripts', 'child_theme_enqueue_styles');

Questo pezzo di codice dice a WordPress di andare alla directory dei modelli (aka tema principale) e usare gli stili inclusi. Inoltre, consente di modificare il tema tramite il tema del bambino (ne parleremo più avanti).

5. Attiva il tema figlio

A questo punto, il tema figlio è pronto per essere attivato.

Se lo desideri, puoi aggiungere uno screenshot ad esso come nelle istruzioni sopra. A parte questo, puoi comprimerlo e aggiungerlo a WordPress tramite Aspetto> Temi> Aggiungi nuovo> Carica tema o semplicemente aggiungendo la cartella così com'è wp-content / themes.

In entrambi i casi, quando attivi il tema, il tuo sito ora dovrebbe apparire esattamente come il suo genitore.

6. Regola il design

Ecco dove inizia il lavoro investigativo di cui sopra. Ora è il momento di cambiare il design del tema esistente in modo che assomigli al tuo sito HTML originale.

Ad esempio, una delle prime cose che risalta è che il nostro tema WordPress aggiunge spazio sopra l'intestazione e sotto il piè di pagina che il nostro sito HTML non ha.

html per wordpress tramite la pagina di esempio del tema figlio

Per ovviare a questo, possiamo guardare il sito HTML con il nostro strumenti per sviluppatori di browser per trovare il markup responsabile. Quando lo facciamo, incontriamo questo:

body {
margine: 0;
}

Quindi, facciamo lo stesso con il mio nuovo tema WordPress in cui troviamo questi stili:

body .site {
margine superiore: 48px;
margine superiore: 3.428571429rem;
margine inferiore: 48px;
margine inferiore: 3.428571429rem;
}

Il mio obiettivo è ora applicare lo stile dal sito HTML al tema WordPress. In questo caso, possiamo raggiungere questo obiettivo semplicemente aggiungendo quanto segue al tema di mio figlio style.css:

body .site {
margine: 0 auto;
}

Dopo il salvataggio, al tema WordPress sono stati applicati i nuovi stili:

da html a wordpress tramite la pagina di esempio modificata del tema figlio

Questo perché tutto ciò che aggiungi al foglio di stile del tema figlio sostituisce gli stili nel suo genitore. Tuttavia, il resto del markup rimane intatto, quindi puoi solo cambiare le cose rilevanti.

Inoltre, se stai utilizzando un modello HTML5 come antipasto e un moderno tema WordPress come genitore, un sacco di markup di base corrisponderà, rendendo la tua vita molto più semplice.

C'è molto di più che puoi fare con i temi dei bambini, che puoi imparare Qui. Dopo aver modificato il design, è tempo di importare i tuoi contenuti. Vediamolo adesso.

C) Importa contenuti da HTML a WordPress usando il plugin

Infine, nell'elenco di passare da HTML a WordPress sta usando un tema esistente così com'è e semplicemente migrando il contenuto dal tuo sito HTML in esso. Questo è il modo più semplice: tutto ciò che devi fare è installare e attivare il tema di tua scelta (supponiamo che tu sappia come farlo ormai) e quindi seguire i passaggi seguenti.

A proposito, anche se questo processo non è molto difficile, ci sono cose che possono andare storte. Per questo motivo, assicurati di eseguire il backup del tuo sito WordPress prima di procedere con esso.

1. Installa il plug-in di importazione

La prima cosa che devi fare è installare il plugin Importazione HTML 2. Il modo più semplice per raggiungere questo obiettivo è andare a Plugin> Aggiungi nuovo e cercalo per nome. Quando lo trovi nell'elenco (potrebbe essere più in basso), fai clic su Installa ora. Attivalo al termine.

html per plugin di importazione wordpress

2. Preparare l'importazione

Per importare più pagine contemporaneamente, devi caricarle sullo stesso server dell'installazione di WordPress. Il plugin proporrà qualcosa del genere html-files-to-import  il nome della cartella ma puoi scegliere quello che vuoi. Assicurati solo di ricordare il nome del percorso.

Come vedrai di seguito, puoi anche importare pagine singole una per una. Per entrambi i metodi, vai su WordPress e Impostazioni> Importazione HTML. Esamineremo ora le impostazioni di base. Se hai bisogno di ulteriori informazioni o se qualcosa non è chiaro, fai riferimento a guida utente ufficiale.

File

HTML per i file di importazione wordpress

Configura questa schermata come segue:

  • Directory da importare - Inserisci il percorso in cui hai appena copiato i file esistenti.
  • URL del vecchio sito - Usato per reindirizzamenti. Inserisci il tuo vecchio URL. Ci occuperemo di nuovo più avanti in questo articolo.
  • File predefinito —Il file predefinito per le directory sul vecchio sito, di solito index.html.
  • Estensioni dei file da includere - Le estensioni dei file che si desidera importare.
  • Directory da escludere - Se nel vecchio sito sono presenti directory che non si desidera importare, inserirle qui.
  • Conserva i nomi dei file - Per fare in modo che il plug-in utilizzi automaticamente i nomi dei file come nuovo URL, selezionare questa casella. Questo ha senso se i tuoi titoli sono molto lunghi perché di solito l'importatore li userà per creare la lumaca.

Soddisfare

Sotto contenuto, devi configurare il tag HTML che contiene il contenuto del tuo sito.

HTML per wordpress importare contenuto

Per farlo, scegli l'opzione Tag HTML in cima. Quindi configurare il tag nei seguenti tre campi. Ad esempio, se il contenuto è contenuto in un tag chiamato

, le informazioni inserite sarebbero div, id e principale.

Le altre impostazioni in questa pagina dovrebbero essere autoesplicative e consentire di importare immagini, documenti, aggiornare collegamenti interni e altro.

Titolo e metadati

html per wordpress importare titolo e metadati

Questa parte è simile alla parte del contenuto precedente. Tuttavia, si tratta di titoli di pagina. All'inizio, devi dire al plug-in come i titoli sono contrassegnati nel tuo modello HTML in modo che possano importarli nel posto giusto.

Inoltre, puoi filtrare elementi ridondanti come il titolo del sito in quanto viene spesso visualizzato per impostazione predefinita dai temi WordPress. Se i titoli si trovano all'interno del contenuto, puoi anche dire all'importatore di eliminarli in modo che non vengano inclusi due volte.

L'importante è decidere se importare i tuoi vecchi contenuti come post o pagine. Il resto è piuttosto autoesplicativo e consente di configurare le impostazioni di WordPress per le nuove pagine.

Campi personalizzati

html per wordpress importare campi personalizzati

Se hai dati che devono essere importati in campi personalizzati, puoi configurarli qui.

Categorie e tag

html per wordpress importare categorie e tag

Qui puoi assegnare categorie, tag e formati di post al contenuto importato. Il plug-in mostrerà la tassonomia esistente sul tuo sito per facilitare questo passaggio.

Utensili

html per strumenti di importazione wordpress

Questa schermata elenca una serie di strumenti utili per l'importazione corretta da HTML a WordPress.

3. Inizia l'importazione

Al termine, salvare le impostazioni. Ciò consentirà il Importa file pulsante. Fare clic per iniziare.

html per l'importazione di wordpress

(Nota: puoi anche arrivare qui tramite Strumenti> Importa e poi raccogliendo Esegui importatore sotto il HTML opzione.)

Quindi, scegli se importare una directory di file o un singolo file (devi cercarlo), quindi premi Invia. Il plugin quindi funzionerà.

Una volta fatto, dovresti avere tutto il contenuto esistente sul tuo sito WordPress e formattato dal nuovo tema. Oppure, se sei andato su uno degli altri percorsi, il tuo sito dovrebbe essere sostanzialmente lo stesso del tuo precedente sito Web HTML. Ben fatto!

Passaggi aggiuntivi

Se hai intenzione di distribuire il sito WordPress nello stesso posto in cui si trovava il sito Web HTML statico, ci sono ancora alcune cose da fare prima di finire.

Il primo è controllare gli URL dei post e delle pagine importati di recente per assicurarsi che siano compatibili con i motori di ricerca (ad esempio includi le parole chiave per le quali desideri classificare). È molto semplice: basta andare a una pagina o a un post e guardare l'URL sotto il titolo.

controlla i permalink dopo l'html per l'importazione di wordpress

Per modificarlo, fai clic su modificare sulla destra, passa all'URL che preferisci e premi Ok.

Una seconda cosa è implementare i reindirizzamenti dai vecchi URL a quelli nuovi. In questo modo, non perderai il valore SEO esistente.

Se hai inserito il vecchio indirizzo del sito nel plugin HTML, creerà il codice di reindirizzamento per te. Puoi copiarlo e incollarlo nel file.htaccess che risiede sul tuo server (di solito nella directory principale).

L'accesso tramite FTP, tuttavia, potrebbe essere necessario abilitare la visualizzazione di file nascosti in quanto non è visibile per impostazione predefinita. Quindi modifica .htaccess e inserisci le regole.

Tieni presente che funziona solo se hai lasciato invariati gli URL. Se non hai e devi impostare reindirizzamenti personalizzati, usa il Plugin di reindirizzamento. È una soluzione molto comoda che traccia anche ogni volta che qualcuno arriva su un URL inesistente sul tuo sito. In questo modo è possibile implementare reindirizzamenti anche per quei collegamenti.

Sei passato con successo da HTML a WordPress?

E questo è tutto. Hai appena imparato a convertire un sito HTML statico in WordPress. Di conseguenza, sei diventato parte di una delle più grandi comunità sul Web e hai ottenuto l'accesso a migliaia di risorse per migliorare ulteriormente il tuo sito.

A seconda della soluzione che hai scelto sopra, hai già avuto un'idea di come funziona WordPress. Da qui in poi, è abbastanza facile espandersi e approfondire la creazione di siti Web con la piattaforma WordPress. Se hai bisogno di ulteriore aiuto in quest'area, questo sito ne ha molti. Puoi imparare come:

  • Personalizza WordPress passo dopo passo
  • Sposta il tuo sito da HTTP a HTTPS
  • Aggiungi caratteri personalizzati a WordPress
  • Accelera il tuo sito Web WordPress
  • Aggiungi un modulo di contatto al tuo sito WordPress

A parte questo, ti auguriamo buona fortuna con il tuo sito Web WordPress appena coniato. Ci auguriamo che ti piaccia lavorare con WordPress tanto quanto noi.

Hai spostato il tuo sito da HTML a WordPress? Come è stata la tua esperienza? Qualche consiglio da aggiungere? Fatecelo sapere nella sezione commenti qui sotto.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map