Come aggiungere le stelline delle recensioni sugli articoli di WordPress

recensione-stelline-wordpress

Se volete che i vostri articoli siano valutati dai lettori, potete utilizzare il metodo delle “stelline“. L’utente, alla fine della lettura dell’articolo, potrà esprimere il proprio gradimento scegliendo il numero di stelle in base alla propria valutazione. Se seleziona una stellina vuol dire che non gli è piaciuto. Se ne seleziona 5 vuol dire che gli è piaciuto tantissimo. Questo metodo di valutazione è ereditato da portali di viaggi in cui è possibile recensire alberghi e ristoranti.

Ma come aggiungere le stelline agli articoli su un sito WordPress?

Aggiungere le Stelline agli Articoli WordPress

Per aggiungere il sistema delle recensioni basato sulle “stelline” agli articoli realizzati su siti WordPress, ci serviremo del plugin WP-PostRatings.

La scelta è ricaduta su questo plugin perché viene costantemente aggiornato, ha una valutazione ottima da parte degli utenti che lo hanno utilizzato e perché è semplice da utilizzare.

WP-PostRatings si può utilizzare in due maniere:

  • inserendo una riga di codice php ai file di WP (le stelline compaiono in qualsiasi pagina e/o articolo)
  • inserendo un semplice shortcode solo negli articoli in cui desideriamo compaiano le stelline

Vediamo come funziona e come si configura.

Plugin WordPress per aggiungere le stelline agli articoli

Dunque, per installare il plugin stelline wordpress portatevi sulla vostra bacheca, poi selezionate “plugin” e cliccate sul pulsante “Aggiungi Nuovo”.

Nella barra di ricerca dei plugin, scrivete “WP-PostRatings”. Vi troverete davanti il plugin da installare. Cliccate su “installa ora” e poi attivatelo.

plugin stelline wordpress

plugin stelline wordpress

Adesso andiamo a vedere come funziona…

Configurazione Plugin WP-PostRatings

Appena attivato, troverete sulla bacheca una nuova voce, “Ratings“,a cui è anteposta una stellina.

 

voce plugin WP-PostRatings nella bacheca di WP

voce plugin WP-PostRatings nella bacheca di WP

 

Posizionandovi sopra con il cursore, vedrete apparire 3 voci:

  • Manage Ratings
  • Ratings Option
  • Ratings Templates

Cliccandoci sopra, vi ritroverete nel rispettivo pannello di configurazione.

La sezione Manage Ratings, serve semplicemente a visualizzare le recensioni effettuate sul sito ed eventualmente a cancellare quelle che non gradiamo o che sono frutto palese di attività spam.

La prima sezione che dovremo andare a configurare è “Ratings Options“.

Rating Options

In questa sezione dovremo impostare il plugin, scegliendo tra le varie opzioni proposte.

Ratings Options

Ratings Options

Spieghiamo come impostare e varie opzioni e a cosa servono.

  • Ratings Image: Scegliere il tipo di icone con cui volete rappresentare la recensione. Ci sono stelline, numeri, cuoricini, pollice in su o pollice verso e altri simboli.
  • Max Ratings: E’ rappresentato da un numero. Scegliete il numero di simboli per identificare la vostra scala di gradimento nella votazione. Di default è impostato su 5, numero a cui son tutti abituati.
  • Enable Google Rich Snippets: Permette di attivare i rich snippets di tipo “recensione” (itemtype=”http://schema.org/AggregateRating“). Settatelo su SI. A Google piacciono.
  • Individual Text Ratings/Value: Permette di assegnare un punteggio ad ogni stellina (lasciate su 1 salvo diverse esigenze) e di tradurre il testo mostrato (1 star può essere tradotto in 1 stella).
  • Show Loading Image With Text e Show Fading In And Fading Out Of Ratings: Fanno parte delle impostazioni per utilizzare stili e animazioni con Ajax. Il primo fa caricare le immagini insieme al testo ed il secondo attiva animazioni in dissolvenza.
  • Who Is Allowed To Rate: Qui potete decidere se possono votare solo gli utenti loggati, solo gli utenti non loggati o entrambi.
  • Ratings Logging Method: Qui dovete decidere se registrare la votazione per IP, Username o non tracciare nulla.

Qui abbiamo finito. Se avete modificato qualcosa salvate per convalidare le modifiche.

Ora passiamo all’altro pannello: Ratings templates.

Rating Templates

Come dice la parola stessa, qui è dove andremo a personalizzare il layout del nostro sistema per aggiungere le stelline agli articoli su WordPress.

A prima vista l’impostazione può sembrare ostica, ma se si capisce l’uso a cui sono destinati le variabili a disposizione, tutto diventa più facile.

Per iniziare, confermate le impostazioni di default e poi, confrontando il risultato con quanto impostato in questa sezione, riuscirete a capire come modificare per raggiungere il risultato visivo desiderato.

Vediamo però come modificare queste impostazioni.

Ratings Vote Text: questo è il testo che compare subito dopo aver votato. In sostanza ci dice il numero di voti per il singolo articolo.

Propongo un esempio visivo…

Subito dopo aver votato, il plugin ci restituirà sulla pagina le stelline nella seguente forma, con il testo (1 votes, average: 5,00 out of 5, rated)”

esempio visivo stelline su articolo

esempio visivo stelline su articolo

 

Possiamo ad esempio tradurre il tutto in italiano andando ad agire sulla configurazione della sezione Ratings Vote Text che diventerà come in figura.

configurazione Templates del plugin

configurazione Templates del plugin

Ed ecco il risultato sul sito.

template delle stelline personalizzato

Ecco come si presenta il template delle stelline personalizzato

Fondamentalmente, la preparazione dei templates per la visualizzazione delle stelline, si basa su istruzioni HTML basilari in cui vengono inserite delle variabili. Queste variabili le trovate elencate in questa stessa sezione del plugin. Di seguito vediamo come utilizzarle:

  • % RATINGS_IMAGES% – Visualizza le immagini dei voti (le stelline)
  • % RATINGS_IMAGES_VOTE% – Visualizza l’immagine delle stelline sin qui votate
  • % RATINGS_AVERAGE% – Visualizza le valutazioni medie
  • % RATINGS_USERS% – visualizza il numero totale di utenti che hanno votato
  • % RATINGS_MAX% – Visualizza il numero massimo di valutazioni
  • % RATINGS_PERCENTAGE% – Visualizza la percentuale di voti
  • % RATINGS_SCORE% – Visualizza il punteggio totale delle valutazioni
  • % RATINGS_TEXT% – Visualizza il testo della valutazione individuale. Ad esempio: 1 stella, 2 stelle, ecc

Quindi, se vogliamo ottenere un templates del tipo…

“[immagine stelle] Questo articolo è stato valutato con una media di 5 stelle su 50 voti“, basterà creare un template nella sezione “Ratings Voted Text” in questa maniera:

%RATINGS_IMAGES% <em>Questo articolo è stato valutato con una media di % RATINGS_SCORE% su % RATINGS_MAX% voti.</em>

Lascio a voi il compito di sbizzarrirvi con il testo da mostrare che più vi piace.

In questa sezione potrete personalizzare vari tipi di templates per diversi utilizzi, come ad esempio

  • articoli più votati
  • articoli con il maggior punteggio
  • articoli senza votazione
  • articoli in cui non è permesso votare se non si è registrati al sito

Come inserire le stelline nell’articolo

Sin qui abbiamo visto come impostare il plugin per aggiungere le stelline di valutazione agli articoli su WordPress. Ma come si fa a visualizzarle nell’articolo? Possiamo procedere in 2 modi:

  • Utilizzando uno shortcode
  • Aggiungendo una riga di codice php ad alcuni files del tema WordPress

Inserire le stelline con gli shortcode

Il primo metodo è semplice e alla portata di tutti. Basterà aggiungere lo shortcode [ratings] (così come l’ho scritto), direttamente in cima o alla fine dell’articolo e vedrete le stelline comparire nella posizione scelta.

Potete anche utilizzare lo shortcode [ratings id=x] dove x sta per l’ID di un altro articolo, per incorporare la valutazione di quest’ultimo, se ad esempio volessimo mostrare un articolo correlato alla fine del testo. In questo caso, si potrebbe scrivere così a fine articolo: Ti potrebbe interessare anche “ARTICOLO CON ID 18, [ratings id=18]

Inserire le stelline di valutazione dell’articolo con gli shortcode, permette di selezionare le pagine e gli articoli in cui dare la possibilità di votare. Di contro, se volessimo mostrarle su tutti gli articoli, dovremmo ricordarci di inserire lo shortcode in ogni nuovo articolo che pubblichiamo. Possiamo invece automatizzare questa operazione inserendo una semplice porzione di codice in alcuni files del tema utilizzato.

Inserire le stelline nell’articolo agendo sul codice del template

Questa soluzione, permette di far comparire le stelline in tutti gli articoli e/o in tutte le pagine del sito web.

Non tiratevi subito indietro. E’ un’operazione semplicissima che dovrete replicare sui vostri siti.

Wp-PostRatings permette di inserire le stelline in:

  • articoli
  • pagine
  • pagine archivio

Normalmente, queste devono essere inserite negli articoli, ma può servire anche inserirle in una determinata pagina in cui si vuole dare le possibilità di dare una valutazione a un certo servizio o prodotto. Difficilmente invece si va ad integrarle nelle pagine archivio.

Dunque, se si vuole integrare il sistema delle stelline su tutti gli articoli dovremo andare ad agire sul file single.php. Se invece ci interessa inserirlo in tutte le pagine, il file da modificare è il page.php.

Vediamo come fare.

Passo 1. Fate un backup del file single.php e del file page.php (o solo di quella che vi interessa). Così, se qualcosa va storto, potrete ricaricarlo e ripristinare la corretta visualizzazione del sito.

Da adesso in poi proseguiremo con il file “single.php”, tanto la procedura è la stessa anche per il page.php.

Passo 2. Sulla bacheca di WordPress, portatevi su “Aspetto” –> “Editor” e selezionate il file single.php nella colonna di destra.

Se utilizzate Filezilla, portatevi su Wp-Content —>Themes —-> Tema scelto —-> single.php

Passo 3. Individuate la seguente riga di codice: <?php while (have_posts()) : the_post(); ?> . Alcuni temi non presentano questa istruzione specifica e ogni tema fa storia a se. Per cui cercate qualcosa del genere all’interno del single.php: < ?php the_content(); ?> .

Passo 4: Inserite questa porzione di codice nella posizione in cui volete appaiano le stelline nell’articolo.

<?php if(function_exists('the_ratings')) { the_ratings(); } ?>

Se siete meno esperti fate delle prove (dopo aver fatto il backup del file). Indicativamente dovrebbe essere inserito dopo una delle istruzioni citate al passo 3.

Ogni tema è scritto in maniera diversa dall’altro. Può succedere che nel file non troviate nessuna delle istruzioni indicate al passo 3. Non rinunciate a fare delle prove. Indicativamente il codice del passo 4, dovrebbe essere inserito in un punto che consenta di visualizzare il sistema di voto all’inizio o alla fine dell’articolo.

Per individuare questi punti, dovete cercare di capire dove si trovino l’inizio e la fine dell’articolo, sfruttando la presenza di parole come “content” (contenuto), “post” (articolo), “header” (testata), “footer” (pié pagina), “nav” (menu di navigazione), eccetera.

*** SE PROPRIO NON NE VENITE A CAPO, CONTATTATE L’AUTORE DEL VOSTRO TEMA PER FARVI SUGGERIRE IL PUNTO DOVE INSERIRE IL CODICE PHP ***

Widget Ratings

C’è anche la possibilità di mostrare la valutazione di un certo numero di articoli in un widget chiamato “Ratings”. Per utilizzarlo, basterà inserirlo nella sidebar o in qualsiasi punto dove avete la possibilità di inserire un widget. Il Widget è configurabile in base a diverse opzioni che vanno dal numero di articoli al tipo di statistica da mostrare.

WP-PostRatings e AMP

Purtroppo, essendo un plugin che lavora in Ajax, non è visualizzabile sulle versioni AMP degli articoli. Se il vostro sito non ha la versione AMP (indicata soprattutto per siti di news), questo problema non sussiste.

Siamo giunti al termine di questa guida a WP-PostRatings, il plugin WordPress per mostrare le stelline delle recensioni sul sito. Davvero un bel plugin, robusto e costantemente aggiornato dallo sviluppatore. Il mio voto: 8.

Readers Comments (14)

  1. Ciao Flavio. Vorrei segnalarti anche questo plugin: kk Star Ratings
    Ha poche impostazioni, facile da usare, e non so come sia possibile ma le “stelle” si vedono anche in versione AMP. Ciao!

  2. te ne segnalo anche un altro che si chiama yast, ha il vantaggio di poter usare le stelle sia come valutazione per il post cliccabili dai lettori, sia da poter usare dall’autore per dare una valutazione a quello che sta descrivendo! ciao

  3. Ciao Flavio, volevo chiederti, se una volta inserito il codice negli articoli, poi le stelline vengono anche visualizzati nei motori di ricerca. Bisogna pingare nuovamente l’articolo?
    Grazie

  4. Salve. Ho inserito lo short-code [rating] in ogni pagina interessata inserendolo sul template della pagina stessa. Per qualche motivo considera solo la pagina nativa del template nel conteggio del rating, le altre non vengono conteggiate separatamente ma solo in forma aggregata. Come posso rimediare? grazie

  5. Come fare per cancellare dal pannello di controllo una valutazione che ho fatto io come prova? dal pannello non esiste nessun tasto che dica cancella

  6. CIAO FLAVIO, HO INSTALLATO IL PLUGIN, FANTASTICO UNA SOLA DOMANDA, DOVE POSSO MODIFICARE LO STILE ? OSIA VORREI CENTRALO IN MEZZO ALLA PAGINA, MA NON TROVO LA POSSIBILITA DI FARLO
    grazie

    • Ciao Silvio. Dovrai utilizzare i CSS. Metti lo shortcode tra due div dandogli la proprietà style=”text-align: center;” . Non ho sottomano un esempio ma dovrebbe funzionare.

Leave a comment

Il tuo indirizzo email non sarà pubblicato.


*