Il mio cliente vende alcuni prodotti e desiderava che i visitatori del sito potessero inviare una recensione o una testimonianza su un particolare prodotto e visualizzare le recensioni sulle rispettive pagine dei prodotti nel suo sito WordPress.
Ho lavorato a questo compito tutto il pomeriggio ieri per la mia grande frustrazione, e proprio ora ha funzionato. Ho capito che lo stavo facendo tanto più difficile di quanto sia in realtà. Forme di gravità per il salvataggio!
Ci sono alcuni passaggi in questo processo:
Iniziamo.
Questa è una situazione perfetta per un tipo di post personalizzato, ad esempio un post di blog, solo speciale. I tipi di post personalizzati sono separati dai normali post del blog; possono aiutarti a trasformare il tuo sito in un database di film o in un sito di ricette, con le loro tassonomie personalizzate (invece di categorie di blog, pensa Registi, Attori e Generi).
Mentre puoi creare manualmente un tipo di post personalizzato (CPT) usando la codifica, facciamolo nel modo più semplice. Installa l'interfaccia utente personalizzata del tipo di post e attivala. Questo è un plugin molto utile e stabile che esiste da molti anni.
Nell'interfaccia utente del tipo di post personalizzato imposterai un nuovo tipo di post. Ecco uno screenshot del mio. Chiamalo come vuoi in questo caso il mio è Recensioni.
Puoi lasciare il etichette sezione da solo. Ma in impostazioni, vorrai apportare alcune modifiche.
Ho lasciato la maggior parte delle impostazioni predefinite sotto impostazioni da solo, ma hanno spuntato la casella per Escludi dalla ricerca perché non voglio i post di revisione nei risultati di ricerca. E nella sezione supporti, Ho solo spuntato le caselle di controllo per gli elementi che ho bisogno di mostrare nella mia pagina di revisione post revisione: Titolo, editore, e Campi personalizzati.
Se passi il mouse sopra i punti interrogativi rossi nel pannello Impostazioni, vedrai cosa fa ogni oggetto; puoi sempre tornare indietro e apportare modifiche.
Gravity Forms è un ottimo plugin, ma non gestirà i post personalizzati da solo. Per questo dovrai installare e attivare un altro plugin, Gravity Forms + Post Tipi personalizzati. Vai avanti e fallo, e inizieremo con il modulo.
In Gravity Forms, crea una nuova forma; chiamiamola Invia una recensione. Salvalo e quindi apri il Campi postali nella colonna di destra L'utilizzo di questi campi invece dei soliti campi modulo creerà un nuovo post quando l'utente invia il modulo.
Innanzitutto, fai clic su Titolo del post per aggiungere quel campo. In questo caso, voglio che il titolo del mio post sia il nome della persona che ha inviato la recensione: guarda lo screenshot qui sotto.
Assegna un nome al campo (qui è il tuo nome, quindi questa è l'etichetta che l'utente vedrà). Per Post Status, probabilmente lo vuoi Bozza; questo significa che il nuovo post sarà in formato Draft e non sarà pubblicato sul tuo sito finché non lo approvi.
Default Post Author è impostato su di te e va bene, non importa qui - e nemmeno lo farà Post categoria dal momento che stiamo usando un tipo di messaggio personalizzato. Crea questo campo necessario spuntando la casella di controllo in basso.
Quindi vai al Avanzate scheda. Spunta la casella per Salva come tipo di messaggio e scegli il tipo di post personalizzato che hai creato all'inizio di questo tutorial.
Quindi fare clic Aggiornare per salvare le modifiche.
Quindi aggiungeremo un campo email (dal Campi avanzati sezione) come con qualsiasi forma, facendolo necessario.
Successivamente aggiungeremo un altro campo postale, Corpo. Funziona proprio come il campo Testo paragrafo in una forma normale. Non è necessario modificare le impostazioni per questo campo tranne il Etichetta di campo e ticchettando il necessario casella di controllo.
Quasi fatto! Ora, poiché il mio cliente ha diversi prodotti, vogliamo chiedere all'utente quale prodotto hanno acquistato. Per fare questo aggiungeremo un campo personalizzato da Campi postali area (trascinala in alto in modo che appaia prima del campo Corpo in modo che il flusso abbia un senso).
Per i nostri scopi desideriamo che questo campo personalizzato sia un pulsante di scelta, quindi scegli quello da Tipo di campo. Quindi dobbiamo dare un nome al nostro campo personalizzato. Scegli il Nuovo pulsante dal momento che lo stiamo facendo qui, e quindi digitare un nome nella casella di testo. In questo caso è product_name.
Quindi inserisci come al solito le opzioni del pulsante di opzione, assicurandoti di inserire sia un'etichetta (ciò che l'utente vede) sia un valore (che puoi utilizzare per separare le recensioni in base al nome del prodotto).
Crea questo campo necessario (e non dimenticare di aggiungere il tuo Etichetta di campo in alto, per l'utente) e aggiornare il modulo. Abbiamo finito con la parte 2.
Spero che tu sappia già come farlo, ma in caso contrario, è molto semplice. Vai alla pagina in cui vuoi inserire il tuo modulo e modificare la pagina.
Metti il cursore nel punto in cui desideri aggiungere il modulo. Clic Aggiungi modulo in alto, scegli il tuo nuovo modulo, deseleziona il Titolo e Descrizione caselle di controllo e fare clic Inserisci modulo. Aggiungerà uno shortcode alla pagina.
Questo è tutto. E questo è il modo in cui il modulo appare sulla pagina.
Vai avanti e prova il modulo, aggiungendo un paio di recensioni. Suggerirei di aggiungere recensioni per almeno due o tre prodotti, così avremo qualcosa su cui lavorare nella prossima parte di questo tutorial. Puoi sempre eliminare le tue recensioni di prova in seguito.
Ora arriviamo alla parte che ha molte possibilità. Se guardi nel Admin menu sul lato sinistro, ora avrai una nuova voce di menu, nel mio caso è chiamata Recensioni. Se lo guardi, vedrai le recensioni dei test che hai inviato (se non ce ne sono, hai saltato l'ultima parte del passaggio 3) vai al modulo e invia le recensioni dei test, almeno per alcuni prodotti, poiché bisogno di materiale con cui lavorare per questo passaggio).
Questi sono post di blog ma hanno la loro propria voce di menu a causa del tuo tipo di post personalizzato. Questo ti aiuta a mantenere le cose separate sul tuo sito; puoi avere un blog normale e quindi un numero qualsiasi di tipi di post personalizzati per gestire informazioni più specializzate. Molto carino, sì?
Apri uno di questi post e vedrai solo gli elementi selezionati in Supporto al passaggio 1 quando imposti il tuo tipo di post personalizzato. In questo caso, è il titolo, l'editor e i campi personalizzati. Ci piace mantenerlo il più semplice possibile. Guarda il campo personalizzato e vedrai che ha sia un nome (l'etichetta che hai inserito) sia un valore (che hai inserito anche tu). Questo valore può essere utilizzato per controllare quali recensioni vengono visualizzate in un modello personalizzato.
Mostrare i post sul tuo sito può essere fatto con la codifica nei file del tema o con i plugin; ci sono molti molti modi per farlo. Per questo tutorial, aggiungeremo le recensioni a un widget della barra laterale. Ti mostrerò due modi per farlo con un plugin: uno semplice e uno migliore.
Per questo esempio utilizzeremo il plugin Messaggi recenti speciali. Installa e attiva e poi vai a Impostazioni> Widget. Trascina il widget in una barra laterale.
Quando lo apri vedrai molte opzioni. Per questo esempio queste sono le impostazioni che ho usato per visualizzare l'elenco dei post qui, ma puoi usare qualsiasi cosa funzioni con il tuo sito.
Ecco come appare nella mia barra laterale:
Funziona abbastanza bene sin da ora, ma puoi personalizzare il display se conosci qualche CSS. Tuttavia, non hai molto controllo su ciò che viene visualizzato; non puoi scegliere di visualizzare le recensioni per un prodotto e nasconderle per un altro. Ma ti mostrerò come farlo nella prossima parte.
Il contenuto personalizzato Shortcode è un plugin incredibilmente utile che ti consente di visualizzare qualsiasi tipo di contenuto in qualsiasi punto del tuo sito, compresi i widget. Ha un po 'di una curva di apprendimento, ma ha anche un'ottima documentazione che è inclusa in una sezione di riferimento direttamente nella dashboard di amministrazione. Offre molto controllo su ciò che viene visualizzato e non vi deluderà se ci vorrà un po 'di tempo per imparare a usarlo. È uno strumento che puoi usare ancora e ancora nel tuo sito web o blog.
Avrai bisogno di essere un po 'a tuo agio con HTML e CSS per modellare la visualizzazione di questo widget, semplicemente facendoti sapere. Non sembra molto fuori dalla scatola. Puoi aggiungere gli stili al file style.css del tuo tema.
Usiamo il Shortcode del contenuto personalizzato per creare un altro widget, ma questa volta limiteremo ciò che viene visualizzato in modo che possiamo mostrare solo le recensioni per un determinato prodotto.
Nel Impostazioni> Widget, trascina un widget di testo in una barra laterale e aggiungi il tuo titolo.
Ti mostrerò come impostare lo shortcode per questo esempio, ma ti consiglio vivamente di dare un'occhiata al Riferimento sezione per il plugin, che si ottiene in plugin pagina (vedrai un link per questo sotto il nome del plugin). È uno strumento molto potente!
Ecco lo shortcode che sto usando. Lo esaminerò riga per riga.
[loop type = "review" field = "product_name" value = "boulder_case"] [content] [field title] [field date] [/ loop]
Per tipo di loop
, inserisci il nome del tuo campo personalizzato, probabilmente singolare (se non funziona, prova plurale).
Campo
è il nome del campo personalizzato che hai usato in Gravity Forms. Valore
è il valore associato al pulsante di opzione in Gravity Forms.
Questi elementi controllano il ciclo, il che significa che passerà attraverso ogni post di "revisione" uno per uno visualizzando quelli con il valore "boulder_case" finché non li avrà guardati tutti.
Quindi, all'interno del tuo loop, verranno visualizzate tre cose: il contenuto del post (dal campo Body in Gravity Forms), il titolo (il nome dell'utente) e la data pubblicata.
Ha senso? Digita o copia questo nel tuo widget di testo, sostituendo gli elementi nella sezione con i tuoi nomi, salvalo e dai un'occhiata a ciò che genera.
Probabilmente sembra un disastro, ma il contenuto è tutto lì e noterai che vengono visualizzati solo i post con il valore specifico che hai digitato. Questo è potente; significa che puoi creare un widget di revisione per ogni prodottoinvece di avere tutte le recensioni mescolate insieme.
Quindi ora dovrai fare un po 'di formattazione per far sembrare le cose migliori - è necessario un po' di HTML.
[loop type = "review" field = "product_name" count = "3"][/ciclo continuo][soddisfare]- [titolo del campo]
[data del campo]
Questo rende le cose molto più facili da leggere, ma ora alcuni CSS sono necessari per modellarlo. Aggiungerò alcune classi a questo codice per lo styling.
/ * Recensioni * / # sidebar-primary .widget .review-loop .review margin-bottom: 1.5em; # sidebar-primary .widget .review-loop div.text p margin: 0; # sidebar-primary .widget .review-loop div.text p: before content: '\ 201C'; # sidebar-primary .widget .review-loop div.text p: after content: '\ 201D'; # sidebar-primary .widget .review-loop .author font-size: 1.5rem; line-height: 2.1rem; stile di carattere: corsivo; margine: 0,5em 0 0,2em; allineamento del testo: giusto; # sidebar-primary .widget .review-loop .date margin: 0; font-size: 1.4rem; altezza della linea: 1.96rem; stile di carattere: corsivo; allineamento del testo: giusto;
Ed ecco il prodotto finito tutto in stile e pronto per più contenuti.
Quindi ora sai:
In seguito a questo post, ti mostrerò come visualizzare il tuo nuovo contenuto personalizzato in una pagina utilizzando un modello personalizzato e il ciclo. È un po 'più difficile, ma ti darà il potere di controllare davvero i tuoi contenuti inviati dagli utenti. E poi puoi pensare ad altri modi per utilizzare i contenuti degli utenti, ad esempio inviando foto a una galleria. Coinvolgere i visitatori è un ottimo modo per promuovere il tuo sito aziendale.