Come rendere WordPress difficile da incasinare per i clienti

WordPress è un CMS meravigliosamente potente che viene fornito con molte funzionalità versatili che gli conferiscono la flessibilità di funzionare immediatamente per una vasta gamma di utenti. Tuttavia, se sei un professionista che crea temi e plug-in personalizzati, a volte queste funzionalità possono essere problematiche. Le stesse caratteristiche e opzioni che consentono ai temi standard di adattarsi a molti casi d'uso diversi possono talvolta essere utilizzate anche per indebolire un tema personalizzato accuratamente progettato creato per un caso d'uso specifico.

Il seguente articolo comprende una raccolta di frammenti di codice che utilizzo ancora e ancora su quasi tutti i progetti WordPress. Ciò che hanno in comune è che limitano le funzionalità che non sono necessarie, confuse o non sicure. Tutto ciò che segue può essere utilizzato su qualsiasi sito, ma questi suggerimenti sono particolarmente applicabili per i professionisti che creano temi e plug-in personalizzati per i clienti.

Ulteriori letture su SmashingMag:

• Come creare e personalizzare un tema figlio di WordPress
• Scrivere una documentazione efficace per gli utenti finali di WordPress
• Limitare la visibilità dei post in WordPress tramite nomi utente
• Utilizzo dei ruoli utente in WordPress

La distinzione notevole è che i temi personalizzati possono essere creati per servire uno scopo specifico. Quindi gli spazi vuoti per il contenuto degli autori possono e dovrebbero anche essere molto più ristretti. Un tema WordPress ben progettato dovrebbe prendere quante più decisioni di progettazione possibili in modo che l'autore non debba farlo.

Disabilita i plugin e l'editor di temi

Non c'è una buona ragione per cui qualcuno dovrebbe modificare dal vivo il tuo tema personalizzato o i file dei plug-in tramite la dashboard di WordPress. I professionisti non funzionano in questo modo e i babbani in genere non si rendono conto di quanto sia facile rompere un sito saltando un singolo punto e virgola. È anche una vulnerabilità di sicurezza che gli hacker possono sfruttare. Fortunatamente, i nostri amici di WordPress.org hanno reso davvero facile disabilitare questa funzione. Aggiungi semplicemente il seguente snippet al file wp-config.php .

 define( 'DISALLOW_FILE_EDIT', true );

Oltre all'editor del tema, questo disabiliterà anche l'editor del plugin. Considero questa una caratteristica non un bug.

Limita l'editor visivo e di testo

Per impostazione predefinita, l'editor WYSIWYG di WordPress supporta troppe opzioni di formattazione per un tema personalizzato ben progettato. Consentire ai clienti di sovrascrivere i colori del testo o le dimensioni dei caratteri è un modo rapido per far sembrare brutto e brutto anche il sito più chic. Se il testo del post del blog è progettato per essere sempre allineato a sinistra, perché dare all'autore un pulsante per allinearlo a destra? Pensi che sembrerà buono se il testo nella pagina Informazioni è viola, in grassetto e in corsivo? Allora non armare il tuo cliente con i mezzi per farlo. Nella maggior parte delle situazioni consiglio di disabilitare completamente l'editor visivo.

Disabilitare l'editor visivo

Aggiungi il seguente snippet al file functions.php del tuo tema e la scheda per attivare l'editor WYSIWYG scomparirà.

 function emersonthis_disable_visual_editor(){ # add logic here if you want to permit it selectively return false; } add_filter('user_can_richedit' , 'emersonthis_disable_visual_editor', 50);

Questo è un buon inizio, ma noterai che i pulsanti in grassetto e corsivo sono ancora presenti nell'editor di testo normale. Nella mia esperienza, i clienti abusano di questi pulsanti molto meno spesso quando la gratificazione istantanea dell'editor WYSIWYG è svanita. Ma preferisco comunque rimuoverli se non sono necessari.

Rimozione di tag rapidi in grassetto e corsivo dall'editor di testo

L'editor di testo dispone di pulsanti Quicktag che avvolgono il testo selezionato con i <strong> e <em> . Aggiungi il codice seguente nel file functions.php del tuo tema e gli autori non avranno più pulsanti in grassetto o corsivo.

 # Removes bold and italic quicktags from text editor function emersothis_quicktags_settings( $qtInit ) { //To disable ALL butons it must be set to "," (not "") $qtInit['buttons'] = 'more,'; return $qtInit; } add_filter('quicktags_settings', 'emersonthis_quicktags_settings');

Ciò elimina la possibilità che il tuo cliente decida, ad esempio, di mettere in corsivo un intero articolo. Ma questo non rimuove la possibilità di scrivere manualmente il markup nell'editor di testo. Ogni tanto può tornare utile quando sei in difficoltà.

Se ti trovi in ​​una rara situazione in cui l'utente dovrebbe formattare il testo da solo, puoi lasciare abilitato l'editor visivo ma disabilitare singolarmente i pulsanti specifici.

Disabilitazione dei pulsanti nell'editor visivo

Una delle poche volte in cui lascio abilitato l'editor visivo è quando gli autori scrivono post lunghi o pagine che hanno una propria struttura interna. Ad esempio, un autore di un articolo di 10 pagine potrebbe aver bisogno della possibilità di aggiungere sottotitoli. In queste situazioni ho impostato classi personalizzate per le sottosezioni e quindi disabilito tutti gli altri pulsanti di formattazione che non sono necessari.

L'API di WordPress per modificare l'editor TinyMCE è un po' complicata perché è necessario cercare i nomi in codice utilizzati per fare riferimento a ciascun pulsante che si desidera rimuovere. Ottieni il massimo dal tuo denaro rimuovendo il pulsante "lavello della cucina" che alterna l'intera seconda riga che contiene i pulsanti di formattazione più problematici. L'aggiunta del seguente codice al file functions.php del tuo tema lo farà.

 # Remove visual editor buttons function emersonthis_tinymce_buttons($buttons) { # Remove the text color selector $remove = array('wp_adv'); //Add other button names to this array # Find the array key and then unset return array_diff($buttons,$remove); } add_filter( 'mce_buttons', 'emersonthis_tinymce_buttons' );

Un trucco per capire il nome in codice del pulsante che desideri rimuovere consiste nell'esaminare il markup del modulo. Al momento della scrittura, ogni pulsante ha un nome di classe che inizia con mce-i- seguito dal nome in codice che inseriresti nell'array sopra.

Rimuovere il pulsante "Aggiungi media".

Il pulsante "Aggiungi media" viene visualizzato per impostazione predefinita ogni volta che un tipo di post personalizzato supporta la funzione dell'editor. Ma i tipi di post personalizzati possono essere utilizzati per un'ampia gamma di cose e spesso è inappropriato che quel campo includa immagini.

La maggior parte delle volte, quando mi aspetto che l'autore pubblichi un'immagine per accompagnare il testo, utilizzo le miniature dei post (ovvero le immagini in primo piano). Ciò semplifica l'integrazione delle immagini nei modelli di temi e offre allo sviluppatore un maggiore controllo sulle dimensioni e sulle specifiche delle immagini.

Le foto ad hoc incorporate utilizzando il pulsante "Aggiungi media" nell'editor sono difficili da controllare e tendono a sembrare imbarazzanti a seconda di dove l'autore inserisce l'immagine in relazione al testo circostante. Inoltre creano confusione per molti autori, perché a prima vista il pulsante "Aggiungi media" è facilmente confuso con il pulsante di caricamento "Immagine in primo piano" che appare più in basso nella pagina (per impostazione predefinita) e può essere utilizzato in modo molto diverso dal tema. Lo rimuovo quasi sempre, aggiungendo il seguente codice al file functions.php del tema.

 # Remove media buttons function emersonthis_remove_add_media(){ # do this conditionally if you want to be more selective remove_action( 'media_buttons', 'media_buttons' ); } add_action('admin_head', 'emersonthis_remove_add_media');

Puoi aggiungere la logica prima di remove_action() per rimuovere solo il pulsante multimediale in modo condizionale per determinati tipi di post. Ad esempio, potresti voler consentire agli autori di aggiungere immagini alle pagine, ma non ai post del blog che utilizzano invece le miniature.

Disattiva le opzioni di personalizzazione del tema

Se stai lavorando su un tema figlio, il tema principale potrebbe offrire opzioni di personalizzazione non appropriate per il bambino. Le opzioni di personalizzazione potrebbero non essere utilizzate nel tema del tuo bambino o avere il potenziale per rompere le cose. Ad ogni modo, l'API di personalizzazione del tema di WordPress semplifica l'eliminazione di essi aggiungendo il seguente snippet al file functions.php del tuo tema.

 # Remove customizer options. function emersonthis_remove_customizer_options( $wp_customize ) { // $wp_customize->remove_section( 'static_front_page' ); // $wp_customize->remove_section( 'title_tagline' ); $wp_customize->remove_section( 'colors' ); $wp_customize->remove_section( 'header_image' ); $wp_customize->remove_section( 'background_image' ); // $wp_customize->remove_section( 'nav' ); // $wp_customize->remove_section( 'themes' ); // $wp_customize->remove_section( 'featured_content' ); // $wp_customize->remove_panel( 'widgets' ); } add_action( 'customize_register', 'emersonthis_remove_customizer_options', 30);

Ogni riga nello snippet sopra corrisponde a un'opzione di personalizzazione del tema individuale che puoi disabilitare decommentandola.

Nascondi le voci di menu del dashboard inutilizzate

Non tutti i siti hanno gli stessi tipi di contenuto; alcuni siti non hanno blog, per esempio. Se applichiamo alla dashboard di WordPress la stessa logica che applichiamo a qualsiasi altra interfaccia utente, è confuso e inutile mostrare pulsanti che non fanno nulla. In questo esempio, la voce di menu Posts non sarebbe necessaria, quindi rimuoviamola aggiungendo il seguente snippet a functions.php :

 function emersonthis_custom_menu_page_removing() { // remove_menu_page( 'index.php' ); //Dashboard // remove_menu_page( 'jetpack' ); //Jetpack* remove_menu_page( 'edit.php' ); //Posts remove_menu_page( 'upload.php' ); //Media // remove_menu_page( 'edit.php?post_type=page' ); //Pages remove_menu_page( 'edit-comments.php' ); //Comments // remove_menu_page( 'themes.php' ); //Appearance // remove_menu_page( 'plugins.php' ); //Plugins // remove_menu_page( 'users.php' ); //Users // remove_menu_page( 'tools.php' ); //Tools // remove_menu_page( 'options-general.php' ); //Settings } add_action( 'admin_menu', 'emersonthis_custom_menu_page_removing' );

Ogni riga corrisponde a un menu specifico nella dashboard. I nomi dei file non sempre corrispondono al nome visualizzato nel menu del dashboard, quindi le righe commentate vengono lasciate come riferimento rapido.

È importante comprendere che la rimozione di queste voci di menu non revoca effettivamente le autorizzazioni dell'utente. Un utente può comunque accedere alla voce di menu nascosta direttamente utilizzando l'URL. Se l'obiettivo è rendere il cruscotto meno ingombrante nascondendo controlli superflui, allora probabilmente va bene. Se l'obiettivo è impedire effettivamente a un utente di accedere a tali controlli, sarà necessario modificare le capacità del ruolo dell'utente. Per fare ciò, aggiungi uno snippet come il seguente all'hook di attivazione di un plug-in (deve essere eseguito solo una volta):

 global $wp_roles; // global class $role = 'author'; $cap = 'delete_published_posts'; $wp_roles->remove_cap( $role, $cap );

Usa questa tabella completa di tutte le funzionalità per trovare le funzionalità specifiche che puoi aggiungere o rimuovere per ciascuno dei ruoli predefiniti.

Aggiungi un suggerimento su come funzionano le interruzioni di riga nell'editor

Per impostazione predefinita, l'editor visivo (TinyMCE) creerà un nuovo paragrafo quando l'autore preme Invio . Se vuoi solo un'interruzione di riga vecchio stile (aka ritorno a capo) devi premere Maiusc+Invio . Questo è elegante e potente ma non intuitivo per molti autori. Ho iniziato ad aggiungere un rapido promemoria per evitare l'inevitabile lamentela su "un mucchio di strani spazi bianchi" che appaiono in un post o in una pagina.

Aggiungi il seguente snippet al tuo file functions.php . Modifica il valore di $tip per dire tutto ciò che vuoi ricordare ai tuoi autori.

 # Adds instruction text after the post title input function emersonthis_edit_form_after_title() { $tip = '<strong>TIP:</strong> To create a single line break use SHIFT+RETURN. By default, RETURN creates a new paragraph.'; echo '<p>'.$tip.'</p>'; } add_action( 'edit_form_after_title', 'emersonthis_edit_form_after_title' );

Questa tecnica può essere utilizzata per iniettare un promemoria su tutto ciò che si desidera che gli autori ricordino quando aggiungono o modificano contenuti.

Non distribuire account amministratore

Il ruolo di amministratore di WordPress è molto potente e da un grande potere derivano grandi responsabilità. Alcuni clienti sono utenti esperti di WordPress che amministrano il proprio sito in modo competente. Molti di loro non lo sono. Questi ultimi non dovrebbero curiosare come amministratori. Invece, rendili un editor e crea un account amministratore separato con una password super forte. Se hai un'affiliazione in corso con il cliente, puoi mantenere quelle credenziali fino a quando il cliente non è pronto per amministrare il sito da solo.

In alternativa, fornisci al client entrambi i set di credenziali e chiedi loro di archiviare le credenziali di amministratore in un luogo sicuro e di utilizzarle solo per eseguire attività di amministrazione. Molti clienti perderanno prontamente le credenziali di amministratore, ma va bene così: la password può sempre essere reimpostata e questi sono spesso i tipi di client che ti assumeranno comunque per eseguire la manutenzione ordinaria del sito per loro.

Il motivo più importante per essere avari con gli account amministratore è che rappresentano una vulnerabilità di sicurezza. Un piacevole effetto collaterale è che gli utenti principianti di WordPress spesso trovano l'interfaccia utente della dashboard meno opprimente quando accedono come autori o editori perché ci sono meno menu da ordinare mentre apprendono abilità di base come l'aggiunta o la modifica di post.

Usa mu-Plugin

La directory mu-plugins/ esiste da molto tempo, ma la maggior parte degli hacker di WordPress che incontro non ne hanno mai sentito parlare. Il "mu" sta per must use . La directory è una posizione alternativa in cui è possibile installare i plug-in.

La differenza è che i plug-in "must use" sono attivi automaticamente e non possono essere disabilitati accidentalmente in tutta la dashboard. Vengono caricati anche prima degli altri plugin. Questo è l'ideale per i plugin che devono essere presenti affinché il sito funzioni correttamente. È anche un'ottima alternativa per gli hack non di presentazione che normalmente potrebbero rimanere bloccati nel file functions.php del tuo tema personalizzato. Ad esempio, mi piace definire tipi di post personalizzati in un mu-plugin, perché quel contenuto dovrebbe persistere indipendentemente dal fatto che un particolare tema sia attivo o meno.

La directory mu-plugins/ non esiste di default. Lo crei manualmente all'interno di wp-content/ .

 wp-content/ mu-plugins/ plugins/ themes/ ...

La limitazione più grande è che WordPress cerca solo i file nel livello più alto di mu-plugin/ e ignorerà il codice all'interno di una sottodirectory. Tuttavia, puoi aggirare questo problema creando un singolo file PHP nella parte superiore di mu-plugins/ che carica il codice da una sottodirectory di pari livello. Tieni inoltre presente che le notifiche di aggiornamento non si applicano ai mu-plugin. Penso a mu-plugin/ come al posto dove inserire codice importante a cui il cliente non dovrebbe mai pensare.

Ulteriori informazioni su deve utilizzare i plug-in nel Codex. Se desideri richiedere altri plugin impedendo la possibilità di disattivarli, potresti trovare utile la libreria WDS-Required-Plugins.

Nota finale

Potresti trovare controintuitivo disabilitare la funzionalità che WordPress ti offre gratuitamente. Ma ricorda che il tuo cliente non ti paga per dare loro molti pulsanti. Il tuo compito è creare un sito web efficace e robusto, su misura per soddisfare gli obiettivi del cliente. Disabilitando le funzionalità problematiche o estranee, stai effettivamente offrendo più valore .

Se vuoi più frammenti, ho creato un repository GitHub pubblico di utili frammenti di WordPress che contiene versioni aggiornate degli hack di cui sopra, così come altri che aggiungo periodicamente. Se hai i tuoi frammenti pratici che vuoi condividere, le richieste pull sono più che benvenute!