CSS diverso a secondo del ruolo utente su WordPress

pillole di wordpress di raoul gargiulo - blog.raoulgargiulo.it

Mostrare un CSS diverso in base al ruolo utente su WordPress in modo che ad ogni utente corrispondano regole CSS diverse è possibile, ecco come.

WordPress permette di gestire diversi utenti, ognuno di questi utenti ha dei permessi particolari o delle restrizioni che permettono di gestire al meglio il CMS.

Avere più utenti consente di lavorare  con altre persone e dividere/condividere il lavoro, grandioso certo ma questo a volte ci porta di fronte a delle problematiche o delle esigenze particolari come voler mostrare qualcosa in modo differente a secondo dell’utente.

Per modificare il CSS su ruolo utente bisogna agire sul file functions.php presente nella installazione di WordPress.
E’ possibile accedere al file functions.php in due modi:

  • Via FTP accedendo alla cartella www.miosito.it/wp-content/themes/temaAttivo/ (il percorso potrebbe cambiare);
  • Nel backend di wordpress sotto aspetto>editor del tema.

Per evitare di fare danni irreparabili consiglio vivamente di fare un bel backup prima di iniziare.

Il prossimo passo è quello di aggiungere il seguente codice alla fine del file functions.php (ma prima del ?> se presente).

// css su ruolo utente

add_action('wp_head', 'hidingCss');
function hidingCss() {
if (is_user_logged_in()) {
$user = wp_get_current_user();
$role = (array) $user->roles;
//css-class means user roles
if($role[0] == 'utente'){ 
// qui va il css che si vuole cambiare
echo '<style>#classe {regole css da assegnare }</style>';
echo '<style>.classe {regole css da assegnare }</style>';
}
} else {
return true;
}
}

A questo punto basterà sostituire “utente” con il ruolo utente che vogliamo veda un altro CSS(ad esempio Editor) ed inserire le regole CSS che vogliamo associare dopo echo ‘<style>.

Possiamo inserire tutte le regole che vogliamo copiando ed incollando le righe “echo”, inoltre possiamo usare sia gli ID che le classi proprio  come nel codice di esempio.

Se avete fatto tutto correttamente adesso il codice cambierà il CSS come da voi specificato a secondo dell’utente, pensate a quante applicazioni può avere.

Appassionato di informatica da sempre, amante della natura, dello sport, delle arti e di un altro fantastiliardo di cose. Definito dalla multipotenzialità e affamato di conoscenza. A parte questo... sono una persona normale.

Lascia un commento