Quando creiamo siti WordPress per i clienti, spesso aggiungiamo widget personalizzati alla dashboard. È un modo semplice per mostrare note utili, link o istruzioni proprio dove l'utente accede.
La dashboard predefinita non mostra sempre le informazioni di cui le persone hanno realmente bisogno. Ecco perché ci piace personalizzarla, per rendere l'area di amministrazione più utile e personale.
Potresti voler mostrare un messaggio di benvenuto, visualizzare le informazioni di contatto del supporto o includere un breve tutorial. Qualunque sia il motivo, è facile farlo una volta che sai come.
In questa guida, ti mostreremo come aggiungere un widget personalizzato alla dashboard in WordPress, utilizzando codice o un plugin, a seconda di ciò che preferisci.
Cosa sono i widget della dashboard di amministrazione di WordPress?
I widget della dashboard sono le piccole caselle che vedi quando accedi al tuo sito WordPress. Mostrano informazioni rapide, link utili e aggiornamenti sul tuo sito web.
Per impostazione predefinita, WordPress ti fornisce widget come "A colpo d'occhio", "Attività", "Integrità del sito" e "Bozza rapida". Ma puoi aggiungere i tuoi widget con contenuti personalizzati che si adattano alle tue esigenze.
Suggerimento rapido: Ogni utente del tuo sito può scegliere quali widget desidera vedere. Possono mostrarli, nasconderli o riorganizzarli per adattarli al proprio flusso di lavoro.
Perché i widget della dashboard sono utili:
- Mostrano dati utili nel momento in cui accedi.
- Puoi accedere rapidamente a strumenti o contenuti senza dover cercare nei menu.
- I widget personalizzati ti consentono di personalizzare la dashboard per le tue esigenze specifiche.
Dove trovarli:
Questi widget appaiono nella schermata principale della dashboard all'interno dell'area amministratore di WordPress. Puoi spostarli trascinandoli e rilasciandoli, oppure nasconderli utilizzando la scheda Opzioni Schermata in alto.
Perché e Come Utilizziamo Widget Amministratore Personalizzati in WordPress
I widget della dashboard personalizzati sono un ottimo modo per personalizzare l'esperienza amministratore di WordPress. Li abbiamo utilizzati su molti siti di clienti per visualizzare informazioni utili, collegare a strumenti importanti o semplificare il processo di onboarding.
Sia che gestiate il vostro sito o diversi siti per clienti, i widget personalizzati possono far risparmiare tempo e rendere l'area amministratore più utile.
Casi d'Uso Reali:
- Personalizzazione: Aggiungi un messaggio di benvenuto, visualizza statistiche chiave o collega a pagine che il tuo team utilizza spesso.
- Uso per Sviluppatori: Gli sviluppatori creano spesso widget che guidano i clienti con scorciatoie per attività comuni come gli aggiornamenti o i backup.
Come Li Utilizziamo sui Nostri Siti:
Ci affidiamo a una serie di plugin WordPress indispensabili, e molti di essi includono widget della dashboard integrati.
Uno che usiamo spesso è il widget Panoramica di All in One SEO. Mostra i punteggi TruSEO per i nostri contenuti e fornisce collegamenti diretti per migliorarli.
Usiamo anche il widget MonsterInsights. Ci offre una rapida occhiata al nostro traffico web e alle prestazioni direttamente dalla dashboard.
È anche flessibile: possiamo scegliere quali dati mostrare a seconda di chi lo sta utilizzando.
Poiché ogni membro del team ha esigenze diverse, può mostrare o nascondere i widget e riorganizzare la dashboard come preferisce. È una piccola funzionalità che fa una grande differenza nella produttività.
Come creare widget personalizzati per l'amministrazione di WordPress
Ci sono due modi principali per creare widget personalizzati per la dashboard di WordPress. Puoi usare i collegamenti rapidi qui sotto per passare al metodo che desideri utilizzare:
- Metodo 1: Creare widget per la dashboard utilizzando codice personalizzato (più personalizzabile)
- Method 2: Create Custom Dashboard Widget Using Plugin (Easier)
Metodo 1: Creare widget per la dashboard utilizzando codice personalizzato (più personalizzabile)
Per questo metodo, dovrai aggiungere codice personalizzato al tuo sito WordPress per creare un widget per la dashboard. Richiede una conoscenza di base della programmazione di WordPress. Quindi, se non vuoi scrivere codice, puoi passare al metodo successivo.
Mostriamo questo metodo per primo perché è più flessibile e lascia spazio per aggiungere qualsiasi codice tu voglia eseguire all'interno del tuo widget personalizzato.
Ti mostreremo il codice di cui hai bisogno, e poi potrai personalizzarlo per aggiungere il tuo codice utilizzando PHP, HTML o JS.
Quando si tratta di aggiungere codice personalizzato al tuo sito WordPress, molti utenti pensano al file functions.php del tema. Sebbene questo metodo funzioni, riteniamo che ci sia un modo migliore e più sicuro per gestire gli snippet di codice personalizzato: utilizzando WPCode.
Modificare il file functions.php può a volte causare il crash del tuo sito se c'è un errore nel codice. Inoltre, perderai il tuo codice personalizzato se cambi o aggiorni il tema senza eseguire il backup delle tue modifiche.
WPCode, d'altra parte, ti consente di aggiungere codice personalizzato in modo sicuro senza bloccare il tuo sito. Rende anche facile gestire gli snippet di codice e attivarli o disattivarli secondo necessità.
Nota: È disponibile anche una versione gratuita chiamata WPCode Lite, che puoi utilizzare per questo tutorial. Tuttavia, ti consigliamo di passare a un piano a pagamento per sbloccare più funzionalità.
Innanzitutto, devi installare e attivare il plugin WPCode. Per maggiori dettagli, consulta il nostro articolo su come installare un plugin di WordPress.
Una volta attivato, devi andare alla pagina Code Snippets » +Add Snippet e selezionare ‘Add Your Custom Code (New Snippet)’ per creare un nuovo snippet.
Nella schermata successiva, devi inserire un nome per il tuo codice personalizzato e scegliere ‘PHP Snippet’ come ‘Code Type.’
Successivamente, aggiungi il seguente codice nella casella Code Preview:
//hooks up your code to dashboard setup
add_action('wp_dashboard_setup', 'my_custom_dashboard_widgets');
function my_custom_dashboard_widgets() {
global $wp_meta_boxes;
// Register your custom WordPress admin dashboard widget
wp_add_dashboard_widget('custom_help_widget', 'Theme Support', 'custom_dashboard_help');
}
function custom_dashboard_help() {
// Replace this with any code you want to show in your custom admin widget
echo '<p>Welcome to Custom Blog Theme! Need help? Contact the developer <a href="mailto:yourusername@gmail.com">here</a>. For WordPress Tutorials visit: <a href="https://www.wpbeginner.com" target="_blank">WPBeginner</a></p>';
}
Ecco come dovrebbe apparire nella tua interfaccia WPCode:
Ecco una piccola spiegazione del codice:
La funzione my_custom_dashboard_widgets() registra il widget personalizzato utilizzando la funzione wpb_add_dashboard_widget(). Accetta tre argomenti. Il primo è l'ID del widget personalizzato, il secondo è il titolo del widget e il terzo argomento è la funzione di callback.
custom_dashboard_help() è la nostra funzione di callback e al suo interno abbiamo aggiunto il codice HTML che vogliamo mostrare quando il widget viene visualizzato.
Abbiamo collegato la nostra funzione my_custom_dashboard_widgets all'hook wp_dashboard_setup utilizzando add_action. Questo hook imposta fondamentalmente la pagina della dashboard per la visualizzazione.
Dopo aver aggiunto il codice personalizzato, devi scorrere verso il basso fino alla sezione ‘Insertion’ e selezionare ‘Admin Only’ dal menu a discesa Location.
Infine, fai clic sul pulsante ‘Salva Snippet’ e imposta l’opzione di stato su ‘Attivo’.
Tutto qui. Ora puoi visitare la pagina Dashboard per vedere il tuo widget personalizzato della dashboard di amministrazione di WordPress in azione.
Metodo 2: Crea un widget personalizzato della dashboard utilizzando un plugin (più facile)
Questo metodo è più semplice, ma lo abbiamo posizionato come secondo metodo perché è un po’ meno flessibile rispetto all’aggiunta di codice personalizzato.
Per questo metodo, utilizzeremo il plugin Ultimate Dashboard. È uno dei migliori plugin per la dashboard di amministrazione di WordPress e ti aiuta a creare facilmente widget personalizzati per l’amministrazione.
Per maggiori dettagli, consulta la nostra recensione completa di Ultimate Dashboard.
Innanzitutto, devi installare e attivare il plugin Ultimate Dashboard. Per maggiori dettagli, consulta il nostro articolo su come installare un plugin di WordPress.
Dopo l'attivazione, devi visitare la pagina Ultimate Dash…» Aggiungi Nuovo. Innanzitutto, devi fornire un titolo per il tuo widget e quindi selezionare un Tipo di Widget.
Ci sono tre tipi di widget che puoi creare:
- Widget Icona – Mostra un'icona grande e puntala a qualsiasi pagina del tuo sito.
- Widget Testo – Utilizza un editor visuale dove puoi aggiungere qualsiasi testo desideri con alcune opzioni di formattazione di base.
- Widget HTML – Aggiungi codice HTML al tuo widget personalizzato.
Diamo un'occhiata a ciascuno di essi.
1. Crea un Widget Icona Personalizzato
Seleziona 'Widget Icona' come 'Tipo di Widget' e quindi scegli l'icona che desideri visualizzare. Per impostazione predefinita, viene fornito un numero limitato di icone tra cui scegliere.
Di seguito, puoi aggiungere del testo sotto 'Descrizione comando' per spiegare agli utenti cosa succede quando fanno clic sull'icona. Ad esempio: 'Ti porta alla pagina delle impostazioni di WordPress.'
Dopodiché, aggiungi il link dove vuoi inviare gli utenti quando fanno clic sull'icona.
Infine, fai clic su 'Pubblica' per salvare le modifiche e visita la Dashboard per vedere il widget in azione.
Questo è come apparirebbe.
2. Crea un Widget Testo Personalizzato
Se non sei già lì, vai alla pagina Ultimate Dash…» Aggiungi Nuovo. Seleziona 'Widget Testo' come Tipo di Widget.
Il plugin ti mostrerà un editor di testo visuale (lo stesso del vecchio editor classico) dove puoi aggiungere qualsiasi testo desideri mostrare con formattazione HTML di base.
Al termine, fai clic su 'Pubblica' per salvare le modifiche.
Ora puoi visitare la tua dashboard di amministrazione per vedere questo widget di amministrazione personalizzato in azione.
3. Crea un widget HTML personalizzato
Se non ci sei già, devi andare alla pagina Ultimate Dash…» Aggiungi nuovo. Seleziona 'Widget HTML' come Tipo di widget.
Il plugin ti mostrerà un editor HTML dove puoi aggiungere qualsiasi codice HTML con CSS inline.
Al termine, fai clic su 'Pubblica' per salvare le modifiche.
Ora puoi visitare la tua dashboard di amministrazione per vedere questo widget di amministrazione personalizzato in azione.
Utilizzando Ultimate Dashboard, puoi creare tutti i widget personalizzati che desideri e combinare diversi tipi di widget per creare un'esperienza di dashboard di amministrazione utile.
Portare la tua dashboard di amministrazione di WordPress al livello successivo
L'area di amministrazione di WordPress è dove la maggior parte dei proprietari di siti web trascorre molto tempo a scrivere contenuti, creare pagine, gestire ordini e altro ancora.
Ecco alcune risorse aggiuntive per ottimizzare la dashboard di amministrazione di WordPress:
- Come personalizzare la dashboard di amministrazione di WordPress
- Come etichettare in bianco la tua dashboard di amministrazione di WordPress
- Come creare flussi di lavoro automatizzati in WordPress
- Plugin e suggerimenti per migliorare l'area di amministrazione di WordPress
Speriamo che questo articolo ti abbia aiutato ad aggiungere widget personalizzati alla dashboard nell'area di amministrazione di WordPress. Potresti anche voler consultare la nostra guida alla sicurezza di WordPress o dare un'occhiata a questo tutorial su come nascondere elementi del menu non necessari dall'area di amministrazione.
Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.
Brandon
Molto utile. Grazie.
Supporto WPBeginner
Lieto che sia stato utile!
Amministratore
Jef Vermeire
È possibile aggiungere più widget dello stesso tipo nella dashboard di WordPress? Ad esempio: posso aggiungere due volte il widget personalizzato 'custom_help_widget' nella mia dashboard?
Supporto WPBeginner
You could if you wanted to, you would want to add an additional line of the wp_add_dashboard_widget if you wanted it twice
Amministratore
Xavier Barbot
Very useful, thank you, I’ve tried all the plugins but none achieved adding a simple widget for my clients, very slick and easy to replicate by cresting a custom plugin, I give you 5 stars!
Supporto WPBeginner
Glad our recommendation was helpful
Amministratore
Syed Ali Ahmed
Grazie per aver condiviso questo, è fantastico, mi piace.
Supporto WPBeginner
Glad you found our guide helpful
Amministratore
Mike
È possibile stilizzare il widget con attributi personalizzati tramite HTML o CSS?
Supporto WPBeginner
Potresti, ma va un po' oltre ciò che trattiamo nei nostri articoli.
Amministratore
daan van middendorp
Come posso usarlo con un ruolo personalizzato?
Supporto WPBeginner
Se il tuo ruolo personalizzato può vedere i widget della dashboard, dovrebbe essere in grado di vedere il widget personalizzato.
Amministratore
haqem
come mettere questo widget personalizzato nell'area "Aggiungi nuovo post" per la scrittura
Ron Sierra
Questo è stato chiesto una volta ma non sono riuscito a trovare la risposta. Come creo più widget della dashboard?
Bjornen
Come aggiungo la funzione wp_mail a questo widget?
Significato: come fornisco al cliente un modulo di contatto in quel widget?
Vishah
Come posso aggiungere un pulsante?
Wade
Ho usato il tuo codice e ho ottenuto la schermata bianca della morte. WP 4.7.2
Qualche idea?
Supporto WPBeginner
Ciao Wade,
Puoi rimuovere il codice tramite FTP. Ti preghiamo inoltre di consultare la nostra guida su come risolvere la schermata bianca della morte in WordPress
Amministratore
gobinda das
posso cambiare l'intestazione del tema Flowtown con qualcos'altro
Javier
Ciao, sto cercando di creare widget personalizzati per singolo utente. Ogni utente ha bisogno di un widget con testo diverso al suo interno.
C'è un modo per ottenere questo risultato?
David Guerreiro
È molto facile! Con PHP ottieni l'utente corrente nella funzione che stai usando per visualizzare il contenuto della metabox e cambia l'HTML a seconda dell'utente recuperato. Dai un'occhiata a questo:
Lại Đình Cường
Ciao Syed Balkhi, come posso aggiungere un nuovo widget admin con ordine?
shakun
Come aggiungere più widget nella dashboard
Nishant
ho provato a inserire un do_shortcode() con uno shortcode per un modulo di contatto per dare all'utente un rapido accesso per segnalare eventuali bug o fornire feedback, ma non funziona... qualche idea su come far funzionare CF 7 con questo?
Grazie
Dustin
Sarebbe fantastico saperlo. Sto anche cercando di usare uno shortcode in un widget della dashboard.
Mike
Questo non funziona per me nella versione 3.5. Ci sono aggiornamenti per farlo funzionare? Grazie!
smayzes
È possibile farlo usando la OOP?
ad es.:
all'interno di una classe:
wp_add_dashboard_widget(‘custom_help_widget’, ‘Aiuto e Supporto’, array($this, ‘customDashboardHelp’));
function customDashboardHelp() {
echo ‘<p>Benvenuto nel tuo CMS personalizzato!’;
}
Nick Powers
So che il tuo messaggio è piuttosto vecchio, ma per il bene degli altri che arrivano qui e hanno la stessa domanda. Sì, funziona con la OOP, proprio come hai indicato.
luxsub
È possibile inserire un widget con adsense nella tua dashboard per un sito multi-utente?
y3kgeek
Ottima idea. Cosa succede se voglio creare un widget personalizzato per la dashboard che solo le persone con un certo ruolo utente, diciamo Scrittore Contributore, possano vedere?
Staff editoriale
Puoi farlo usando l'istruzione condizionale if user_can o anche i ruoli utente.
Amministratore
DramaKing
So che sono passati tre anni, ma se altri dovessero capitare qui cercando una risposta (come me), ecco come ho fatto. Non so molto di programmazione, quindi probabilmente non è pulito, ma ecco come sono riuscito a farlo funzionare:
add_action(‘wp_dashboard_setup’, ‘dashboard_widget_mail’);
function dashboard_widget_mail() { global $wp_meta_boxes;
if ( current_user_can( ‘delete_users’ ) ) {
wp_add_dashboard_widget(‘custom_mail_widget’, ‘Nome del widget da visualizzare nella dashboard’, ‘custom_dashboard_mail’); } return true; }
function custom_dashboard_mail() {
echo ‘Il tuo testo personalizzato qui.’;
—
Puoi sostituire ‘delete_users’ con qualsiasi capacità desideri, ovviamente.
Martin
Grazie per questo! Funziona benissimo.
Solo una domanda veloce:
Se voglio aggiungere 2 o più widget personalizzati in functions.php, devo cambiare il nome dell'"azione" e della "funzione"?
Staff editoriale
Sì, dovresti aggiungere due funzioni e azioni separate...
Amministratore
ACS04
Sembra buono, ma sarebbe meglio creare un semplice plugin per farlo, in modo che questo widget sia indipendente dai temi... Non credi?
Staff editoriale
Beh, puoi farlo, ma nel nostro caso contiene informazioni di supporto che vogliamo che i nostri clienti conoscano. Questo è principalmente per i design di temi personalizzati, quindi è utile solo quando il nostro tema è attivato.
Amministratore
Frankie Jarrett
Thanks a lot for the easy example. I was able to get something up and running in just a few seconds
Stéphane
Wow! Non avevo mai sentito parlare di questo trucco prima... Molto bello, grazie!
Daniel
Worked like a charm. Using this as a workaround for one of my membership site that locked all dashboard menus; this will point members to the appropriate edit posts links again.
richard
quando si creano due widget, come si fa a farli stare uno accanto all'altro invece che uno sopra l'altro?
Staff editoriale
Ciao Richard, puoi far visualizzare il tuo widget in cima usando il codice nella WordPress Codex Dashboard API. Non sappiamo come impostarli uno accanto all'altro senza intervenire manualmente e salvarlo per il cliente. Forse inviare un'email a Jake e chiedergli sarebbe una buona idea.
Ricorda però che le impostazioni che imposti in functions.php non sovrascrivono le impostazioni normali se l'utente ha precedentemente modificato le impostazioni. Questo funziona solo se l'utente non ha mai organizzato la propria dashboard prima.
Amministratore
Ash Blue
Usa display block sull'elemento più esterno e float left, assicurati di impostare una larghezza, ma questo potrebbe romperlo. Questo è molto simile a un layout di galleria. Questo non è consigliato e non è necessariamente il modo in cui WordPress ha progettato i widget da utilizzare (usare a proprio rischio).
david
wpmu. Ho trovato /wp-includes/functions.php ma dove dovrei inserire il codice? Grazie per il tuo aiuto
Staff editoriale
In realtà includi questo nel file functions.php del tuo tema, non nel file principale.
Amministratore
cho
cosa intendi per temi function.php?
non riesco a trovare un file del genere
Staff editoriale
Esiste un file functions.php situato nella cartella del tuo tema.
Ash Blue
Interessante, ho fatto tutto questo con la riga seguente. Una è migliore o sono entrambe ugualmente valide?
if ( function_exists('register_sidebar') ) {
register_sidebar(array(
'name'=>'Contatto',
));
}
Staff editoriale
Il tuo codice serve a registrare i Widget della Sidebar. Il codice che stiamo condividendo in questo articolo serve ad aggiungere un widget personalizzato alla dashboard. Quando uno accede al proprio wp-admin, vede le statistiche dei post e altre informazioni. Questa casella verrà aggiunta lì.
Due argomenti completamente diversi.
Amministratore
Vivek @ InfoEduTech
grazie per il tutorial.
per favore, non prenderla male, ogni volta che pubblichi un articolo, postalo con lo screenshot appropriato in modo che sia facile per i principianti.
Jim
Questo è fantastico, grazie per aver condiviso.