Come usare un editor visivo per creare widget in WordPress

L'editing visivo ha trasformato il modo in cui creiamo i widget.

Ciò che prima richiedeva codice personalizzato ora può essere fatto con pochi clic, rendendo la creazione di widget accessibile a tutti.

L'editor visivo in WordPress è diventato sempre più potente, soprattutto con i recenti aggiornamenti dell'editor a blocchi. Sia che tu stia personalizzando la tua barra laterale, il piè di pagina o qualsiasi area widget, ora puoi creare widget belli e funzionali senza toccare una singola riga di codice.

In questa guida, ti mostreremo esattamente come utilizzare l'editor visivo per creare widget per il tuo sito WordPress.

Perché usare l'editor visivo per creare widget in WordPress?

I widget ti consentono di aggiungere contenuti ricchi al di fuori dell'area principale delle pagine e dei post. Ogni tema WordPress è diverso, ma in genere puoi aggiungere widget ad aree come il piè di pagina, l'intestazione e la barra laterale.

Molti siti web utilizzano queste aree per mostrare una sezione "chi siamo", visualizzare i loro post più popolari, aggiungere un modulo di iscrizione alla newsletter via email e altro ancora.

WordPress ti consente di aggiungere una vasta gamma di blocchi a qualsiasi area pronta per i widget, e molti plugin WordPress aggiungono anche i propri blocchi.

Ad esempio, se stai utilizzando Smash Balloon Twitter Feed, allora puoi incorporare tweet recenti in qualsiasi area pronta per i widget utilizzando il blocco Twitter Feed del plugin.

Tuttavia, a volte potresti voler creare un widget personalizzato che mostri contenuti multimediali avanzati ai tuoi visitatori. Ad esempio, potresti voler caricare la foto del tuo autore e poi usarla per creare un widget di biografia autore, completo di link ai tuoi diversi profili di social media.

Detto questo, vediamo come puoi usare un editor visivo per creare widget personalizzati in WordPress. Usa semplicemente i link qui sotto per passare al metodo giusto per il tuo tema:

• Metodo 1: Utilizzo del plugin Widget Options (funziona con tutti i temi WordPress)
• Metodo 2: Utilizzo dell'Editor del sito completo (funziona con temi WordPress abilitati ai blocchi)
• Domande frequenti

Metodo 1: Utilizzo del plugin Widget Options (funziona con tutti i temi WordPress)

Il modo più semplice per creare un widget personalizzato è utilizzare il plugin Widget Options.

Aggiunge molte impostazioni aggiuntive all'editor visivo standard dei widget di WordPress, inclusa la possibilità di mostrare widget diversi a seconda del ruolo dell'utente, nascondere i widget di WordPress sui dispositivi mobili e altro ancora.

Aggiunge anche un widget di testo che puoi personalizzare con i tuoi link, immagini, formattazione e altro ancora. Questo ti consente di creare un widget personalizzato senza dover scrivere codice.

Innanzitutto, devi installare e attivare il plugin Widget Options. Per maggiori dettagli, consulta la nostra guida passo passo su come installare un plugin di WordPress.

Dopo l'attivazione, vai alla pagina Aspetto » Widget nella tua bacheca di WordPress.

Ora vedrai un elenco di tutte le aree pronte per i widget nel tuo tema WordPress. Le opzioni che vedi possono variare a seconda del tuo tema.

Vedrai anche tutti i widget che puoi aggiungere al tuo sito. Useremo il widget Testo per questa guida, quindi trascinalo semplicemente su qualsiasi area pronta per i widget.

Ora vedrai un piccolo popup.

Questo popup è essenzialmente un mini-editor di pagine o post, quindi dovrebbe sembrarti familiare.

Per iniziare, puoi digitare un titolo, che apparirà sopra il widget.

Dopodiché, puoi digitare testo direttamente nel piccolo editor, aggiungere link e immagini, cambiare la formattazione, aggiungere elenchi puntati e numerati, e altro ancora.

Puoi anche mostrare o nascondere i widget in pagine WordPress specifiche e aggiungere stili personalizzati al widget di WordPress.

Quando sei soddisfatto della configurazione del widget, fai clic sul link 'Fine' per salvare le sue impostazioni.

Ora, se visiti il tuo sito web, vedrai il nuovo widget di testo ricco in diretta.

Se preferisci, puoi creare un widget personalizzato visivamente utilizzando il Personalizzatore di WordPress.

Vai semplicemente su Aspetto » Widget, ma questa volta fai clic su 'Gestisci con anteprima live'.

Questo aprirà il Personalizzatore con le impostazioni del widget già selezionate.

Ora puoi fare clic sull'area in cui desideri aggiungere il widget personalizzato.

Successivamente, fai clic su 'Aggiungi un widget', che aprirà un pannello che mostra tutti i diversi widget.

Trova semplicemente 'Testo' e fai clic su di esso per aggiungerlo al tuo sito web.

Questo aprirà un piccolo editor in cui puoi aggiungere testo, collegamenti, media e altro.

Mentre apporti modifiche nell'editor, l'anteprima live si aggiornerà automaticamente.

Quando sei soddisfatto dell'aspetto del widget, fai clic sul pulsante 'Pubblica' per renderlo live sul tuo blog o sito web WordPress.

Se non riesci a trovare il personalizzatore del tema nella tua bacheca di WordPress, consulta la nostra guida su come correggere la mancanza del personalizzatore del tema nell'amministrazione di WordPress.

Metodo 2: Utilizzo dell'Editor del sito completo (funziona con temi WordPress abilitati ai blocchi)

Se stai utilizzando un tema WordPress abilitato ai blocchi, puoi aggiungere blocchi a qualsiasi area pronta per i widget utilizzando l'editor completo del sito.

In questo modo, puoi creare widget personalizzati disponendo i blocchi standard di WordPress in un'area pronta per i widget, come la barra laterale. Inoltre, non è necessario installare un plugin WordPress separato.

È anche un modo per aggiungere widget ad aree che non puoi modificare utilizzando l'editor di widget standard di WordPress o il personalizzatore. Ad esempio, puoi aggiungere widget al tuo modello di pagina 404.

Per iniziare, vai su Aspetto » Editor nella dashboard di WordPress.

Per impostazione predefinita, l'editor del sito completo mostra il modello della home page del tuo tema, ma puoi aggiungere widget e blocchi a qualsiasi area.

Per vedere tutte le opzioni disponibili, seleziona semplicemente 'Modelli' o 'Parti modello'.

Ora puoi fare clic sul modello o sulla parte del modello che desideri modificare.

WordPress mostrerà ora un'anteprima del design. Per procedere e modificare questo modello, fai clic sulla piccola icona a forma di matita.

Fatto ciò, fai clic sull'icona blu '+' e quindi trova il primo blocco che desideri utilizzare nel tuo widget personalizzato.

Puoi utilizzare qualsiasi combinazione di blocchi che desideri, ma se hai intenzione di utilizzare un'immagine e del testo, ti consigliamo di iniziare con il blocco Media e testo.

Questo ti consente di disporre facilmente un'immagine accanto a del testo in un layout gradevole. Tenendo conto di ciò, il blocco Media e testo è perfetto per creare una casella di informazioni sull'autore, come puoi vedere nell'immagine seguente.

Dopo aver selezionato il blocco che desideri utilizzare, trascinalo semplicemente in un'area pronta per i widget come la barra laterale e il piè di pagina.

L'editor completo del sito ti offre accesso all'intero set di strumenti e impostazioni di WordPress. Ciò significa che puoi aggiungere un pulsante di invito all'azione, testo, link, immagini e altri contenuti a una gamma più ampia di blocchi.

Detto questo, dovresti essere in grado di creare esattamente il widget che avevi in mente. Aggiungi semplicemente altri blocchi e contenuti all'area pronta per i widget finché non sarai soddisfatto del risultato.

Per ulteriori idee su come utilizzare le aree del tuo tema pronte per i widget, consulta la nostra lista di controllo delle cose da aggiungere al piè di pagina del tuo sito WordPress.

Quando sei soddisfatto delle modifiche apportate, fai clic su 'Salva'.

Ora, se visiti il tuo sito web WordPress, vedrai il nuovo widget personalizzato attivo.

Domande frequenti

Ecco alcune domande che i nostri lettori pongono frequentemente sulla creazione di widget utilizzando l'editor visivo:

Devo installare un plugin per creare widget visivamente?

Non sempre. Se stai utilizzando un tema a blocchi, puoi aggiungere widget utilizzando l'Editor del Sito Completo senza plugin aggiuntivi.

Tuttavia, se il tuo tema non supporta l'editor del sito completo, l'utilizzo di un plugin come Widget Options ti offre un maggiore controllo su dove e come appaiono i tuoi widget.

Perché non vedo subito le modifiche al mio widget?

Se il tuo widget non si aggiorna istantaneamente, prova a svuotare la cache del tuo sito e la cache del browser. Alcuni plugin di caching o CDN potrebbero ritardare le modifiche.

Utilizzare l'opzione Anteprima Live è un buon modo per confermare gli aggiornamenti del tuo widget prima della pubblicazione.

Posso aggiungere blocchi personalizzati di plugin (come Smash Balloon o WPForms) all'interno di un'area widget?

Assolutamente. La maggior parte dei plugin moderni, come Smash Balloon, WPForms o MonsterInsights, include i propri blocchi che possono essere inseriti in qualsiasi area predisposta per i widget.

Puoi trascinare questi blocchi nella tua barra laterale, piè di pagina o intestazione proprio come qualsiasi altro blocco.

Qual è la differenza tra l'utilizzo del plugin Widget Options e l'Editor del Sito Completo?

Il plugin Widget Options funziona con tutti i temi, inclusi quelli più vecchi che non supportano FSE.

L'Editor del Sito Completo funziona solo con temi abilitati ai blocchi e offre una maggiore flessibilità di progettazione, poiché puoi modificare intestazioni, piè di pagina e modelli visivamente.

Speriamo che questo articolo ti abbia aiutato a imparare come utilizzare facilmente l'editor visuale per i widget di WordPress. Potresti anche voler consultare la nostra guida su suggerimenti per padroneggiare l'editor di contenuti di WordPress e come creare una landing page con WordPress.

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.