Enkle brukeranmeldelser med tyngdekraften og en tilpasset posttype

Hva du skal skape

Min klient selger noen få produkter og ønsket en måte for besøkende på nettstedet å kunne sende inn en anmeldelse eller et vitnesbyrd om et bestemt produkt, og å vise de anmeldelsene på deres respektive produktsider på sitt WordPress-nettsted.

Jeg jobbet på denne oppgaven hele ettermiddagen i går til min store frustrasjon, og akkurat nå fikk den det til å fungere. Jeg regnet ut at jeg gjorde det mye vanskeligere enn det egentlig er. Gravity Skjemaer til redning!

Det er noen få skritt i denne prosessen:

  • Opprett en egendefinert innleggstype.
  • Opprett et skjema i Gravity Forms for å la brukerne legge inn utkast til innlegg ved hjelp av egendefinert innleggstype.
  • Legg til skjemaet på en side.
  • Vis innleggene på nettstedet ditt.

La oss komme i gang.

1. Opprett en tilpasset posttype

Dette er en perfekt situasjon for en egendefinert innleggstype, som et blogginnlegg, bare spesielt. Egendefinerte innleggstyper er skilt fra vanlige blogginnlegg; de kan hjelpe deg med å gjøre nettstedet ditt til en filmdatabase eller et oppskriftssted, med egne egendefinerte taksonomier (i stedet for bloggkategorier, tenk filmdirektører, skuespillere og sjangere).

Mens du manuelt kan opprette en tilpasset posttype (CPT) ved hjelp av koding, la oss gjøre dette på den enkle måten. Installer Tilpasset Post Type UI og aktiver det. Dette er en veldig nyttig og stabil plugin som har eksistert i mange år.

I Tilpasset Post Type UI vil du sette opp en ny posttype. Her er et skjermbilde av meg. Gi det navnet du vil i dette tilfellet er min Anmeldelser.

Du kan forlate etiketter seksjon alene. Men i innstillinger, du vil gjøre noen få endringer.

Jeg har forlatt de fleste av standardene under innstillinger alene, men har krysset boksen for Ekskluder fra Søk som jeg ikke vil ha anmeldelse innlegg i søkeresultatene. Og i seksjonen støtter, Jeg har bare merket av i boksene for elementene jeg må vise i min innleggsredigeringsside: Tittel, Redaktør, og Egendefinerte felt.

Hvis du mus over de røde spørsmålstegnene i Innstillinger-panelet, ser du hva hvert element gjør; Du kan alltid komme tilbake og gjøre endringer.

2. Lag et skjema i tyngdekraften

Gravity Forms er et flott plugin, men det vil ikke håndtere egendefinerte innlegg på egen hånd. For det må du installere og aktivere et annet plugin, Gravity Forms + Custom Post Types. Gå videre og gjør det, og vi kommer i gang på skjemaet.

I Gravity Forms lager du et nytt skjema; la oss kalle det Send inn en anmeldelse. Lagre det, og åpne deretter Postfelt i høyre kolonne. Ved å bruke disse feltene i stedet for de vanlige skjema feltene, vil det opprettes et nytt innlegg når brukeren sender skjemaet.

Først klikker du på Posttittel å legge til det feltet. I dette tilfellet vil jeg at tittelen på innlegget mitt skal være navnet på personen som sender inn anmeldelsen, se skjermbildet nedenfor.


Navn ditt felt (her er det Ditt navn, så dette er etiketten brukeren vil se). Til Poststatus, du vil sikkert ha det utkast; Dette betyr at det nye innlegget vil være i Draft format og ikke vil bli publisert på nettstedet ditt før du godkjenner det.

Standard innleggsforfatter er satt til deg og det er greit, det spiller ingen rolle her - og det vil heller ikke Post kategori siden vi bruker en egendefinert innleggstype. Lag dette feltet ved å merke nederst i boksen.

Så gå til Avansert fane. Merk av for Lagre som posttype og velg den egendefinerte innleggstypen du opprettet i begynnelsen av denne opplæringen.


Klikk deretter Oppdater for å lagre endringene dine.

Da legger vi til et e-postfelt (fra Avanserte felt seksjon) som med hvilken som helst form, gjør det .

Deretter legger vi til et annet innleggsfelt, Kropp. Dette fungerer akkurat som avsnittet Tekstfelt i en vanlig form. Du bør ikke endre noen innstillinger for dette feltet annet enn Feltetikett og tikkende på avkrysnings.

Nesten ferdig! Nå fordi kunden min har flere produkter, vil vi spørre brukeren hvilket produkt de kjøpte. For å gjøre dette skal vi legge til et egendefinert felt fra Postfelt område (dra det opp slik det vises før kroppsfeltet slik at strømmen gir mening).

For vårt formål ønsker vi at dette tilpassede feltet skal være radioknapper, så velg det fra Feltype. Da må vi gi vårt tilpassede felt et navn. Velg Ny knappen siden vi lager den her, og skriv deretter inn et navn i tekstboksen. I dette tilfellet er det produktnavn.


Deretter fyller du inn valgknappen for valgknappen som vanlig, og sørger for at du skriver inn både en etikett (hva brukeren ser) og en verdi (som du kan bruke til å skille anmeldelser etter produktnavn).

Lag dette feltet (og ikke glem å legge til din egen Feltetikett øverst, for brukeren) og oppdatere skjemaet. Vi er alle ferdige med del 2.

3. Legge til skjemaet på en side

Jeg håper du allerede vet hvordan du gjør dette, men hvis ikke, er det veldig enkelt. Gå til siden der du vil sette skjemaet og redigere siden.

Sett markøren der du vil legge til skjemaet. Klikk Legg til skjema øverst, velg det nye skjemaet ditt, untick the Tittel og Beskrivelse kryssruter, og klikk Sett inn skjema. Det vil legge til en kortkode på siden.

Det er det. Og slik ser skjemaet ut på siden.


Gå videre og prøv skjemaet, legg til et par vurderinger i. Jeg vil foreslå å legge til vurderinger for minst to eller tre produkter, slik at vi får noe å jobbe med i neste del av denne opplæringen. Du kan alltid slette testanmeldelser senere.

4. Vis innleggene på nettstedet ditt

Nå kommer vi til den delen som har mange muligheter. Hvis du ser i admin meny på venstre side, vil du nå få et nytt menyelement - i mitt tilfelle heter det anmeldelser. Hvis du ser på det, ser du testanmeldelser du sendte inn (hvis det ikke er noen, hoppet du over den siste delen av Trinn 3 - gå til skjemaet ditt og send inn testanmeldelser, i hvert fall for noen få produkter, som vi trenger noe materiale å jobbe med for dette trinnet).

Dette er blogginnlegg, men de har sitt eget menyelement på grunn av din egendefinerte innleggstype. Dette hjelper deg med å holde ting skilt på nettstedet ditt; Du kan ha en vanlig blogg, og deretter et hvilket som helst antall egendefinerte innleggstyper for å håndtere mer spesialisert informasjon. Ganske kul, ja?

Åpne et av disse innleggene, og du vil bare se de elementene du merket under Støtter tilbake i trinn 1 når du konfigurerer din egendefinerte innleggstype. I dette tilfellet er det tittelen, redaktøren og egendefinerte felt. Vi liker å holde det så enkelt som mulig. Se på det egendefinerte feltet, og du vil se at det har både et navn (etiketten du skrev inn) og en verdi (som du også skrev inn). Den verdien kan brukes til å kontrollere hvilke vurderinger som vises i en tilpasset mal.

Viser innlegg på nettstedet ditt kan gjøres med koding i temafilene dine eller med plugins; det er mange mange måter å gjøre dette på. For denne opplæringen skal vi legge til vurderingene til en sidebar-widget. Jeg viser deg to måter å gjøre dette med et plugin: en enkel og en bedre.

Viser tilpassede innlegg i en widget: Den enkle måten

For dette eksempelet bruker vi pluginet for spesielle nylige innlegg. Installer og aktiver den og gå til Innstillinger> Widgets. Dra widgeten i et sidebjelke.

Når du åpner den, ser du mange alternativer. For dette eksempelet er disse innstillingene jeg brukte for å få postlisten vist her, men du kan bruke det som fungerer med nettstedet ditt.

  1. Jeg endret Widget Tittel til Nylige omtaler og Postgrense til 2.
  2. Ingen miniatyrbilder, siden det ikke er noen tilknytning til anmeldelser.
  3. Under Postalternativer Jeg valgte å bruke full lengde for Legg inn innholdslengde. Kryss av boksen ved Aktiver WordPress-filtre, fordi vi vil bruke det senere.
  4. Ingen endringer under Advanced Post Options 1 eller 2.
  5. Under Filtreringsalternativer, skriv inn egendefinert postnavn i den siste boksen (hvis den ikke fungerer, prøv singularversjonen - omtale eller omtaler).
  6. Lagre widgeten.

Slik ser det ut i sideglasset:


Det fungerer ganske bra rett ut av boksen, men du kan tilpasse skjermen hvis du vet noe CSS. Du har imidlertid ikke mye kontroll over hva som blir vist; Du kan ikke velge å vise vurderinger for ett produkt og gjemme dem for en annen. Men jeg skal vise deg hvordan du gjør det i neste del.

Viser tilpassede innlegg i en widget: Med total kontroll

Egendefinert Content Shortcode er et utrolig nyttig plugin som lar deg vise hvilken som helst type innhold hvor som helst på nettstedet ditt, inkludert widgets. Det har litt av en læringskurve, men den har også god dokumentasjon som er inkludert i en referanseseksjon rett i administrasjonspanelet. Det gir mye kontroll over hva som vises, og vil ikke skuffe hvis du tar litt tid å lære å bruke den. Det er et verktøy du kan bruke igjen og igjen på ditt nettsted eller på bloggen.

Du må være litt komfortabel med HTML og CSS for å vise visningen av denne widgeten, bare for å fortelle deg det. Det ser ikke ut som mye rett ut av esken. Du kan legge stilene til temaets stil.css-fil.

La oss bruke tilpasset innholdskode for å lage en annen widget, men denne gangen vil vi begrense det som vises, slik at vi kun kan vise anmeldelser for et bestemt produkt.

I Innstillinger> Widgets, dra en tekst widget i et sidebjelke og legg til tittelen din.

Jeg vil vise deg hvordan du oppretter kortnummeret for dette eksempelet, men jeg anbefaler at du tar en titt gjennom Henvisning delen for plugin, som du kommer til i plugins side (du vil se en kobling for den under pluginnavnet). Det er et veldig kraftig verktøy!

Her er kortnummeret jeg bruker. Jeg går gjennom den linje for linje.

[loop type = "review" field = "product_name" value = "boulder_case"] [innhold] [feltittel] [feltdato] [/ loop]

Til sløyfe type, skriv inn navnet på ditt egendefinerte felt, sannsynligvis singular (hvis det ikke virker, prøv flertall).

Felt er det egendefinerte feltnavnet du brukte i Gravity Forms. Verdi er verdien knyttet til radioknappen i Gravity Forms.

Disse elementene kontrollerer sløyfen, noe som betyr at den vil gå gjennom hver "anmeldelse" -post en for en viser dem med verdien 'boulder_case' til den ser på dem alle.

Så inne i sløyfen din, kommer det til å vise tre ting: Innholdet i innlegget (fra kroppsfeltet i Gravity Forms), tittelen (brukerens navn) og datoen som er publisert.

Gir det mening? Skriv eller kopier dette inn i tekst widgeten din, erstatte elementene i delen med dine egne navn, lagre det, og se hva det genererer.

Det ser sannsynligvis ut som et rot, men innholdet er alt der, og du vil merke at bare de innleggene med den spesielle verdien du skrev inn, vises. Dette er kraftig; det betyr at du kan lage en anmeldelse-widget for hvert produkti stedet for å ha alle anmeldelser jumbled sammen.

Så nå må du gjøre noe formatering for å få ting til å se bedre ut - litt HTML er nødvendig.

[loop type = "review" field = "product_name" count = "3"]
[innhold]

- [feltittel]

[feltdato]

[/ Løkke]

Dette gjør ting mye enklere å lese, men nå er det noen CSS som trengs for å stillegge det. Jeg legger til noen klasser i denne koden for styling.

/ * Anmeldelser * / # sidebar-primær .widget .review-loop .review margin-bottom: 1.5em;  # sidebar-primær .widget .review-loop div.text p margin: 0;  # sidebar-primær .widget .review-loop div.text p: før innhold: '\ 201C';  # sidebar-primær .widget .review-loop div.text p: etter innhold: '\ 201D';  # sidebar-primær .widget .review-loop .author font-size: 1.5rem; linjehøyde: 2,1m; font-style: kursiv; margin: 0.5em 0 0.2em; tekstjustering: høyre;  # sidebar-primær .widget .review-loop .date margin: 0; fontstørrelse: 1.4rem; linjehøyde: 1,96rem; font-style: kursiv; tekstjustering: høyre; 

Og her er ferdigproduktet helt stil og klar for mer innhold.


Wrapping Up

Så nå vet du:

  • hvordan og når du skal opprette en egendefinert innleggstype
  • hvordan lage et skjema for å samle brukerinnhold for den egendefinerte innleggstypen din
  • hvordan å vise det skjemaet på en side eller post
  • hvordan du viser dine egendefinerte innlegg i en widget ved hjelp av en enkel plugin
  • hvordan du viser dine egendefinerte innlegg med mer kontroll

I en oppfølging til dette innlegget, viser jeg deg hvordan du viser ditt nye tilpassede innhold på en side ved hjelp av en egendefinert mal og sløyfe. Det er litt vanskeligere, men vil gi deg muligheten til virkelig å kontrollere ditt brukerinnleverte innhold. Og da kan du tenke på andre måter å bruke brukerinnhold til å sende inn bilder til et galleri, for eksempel. Å få besøkende involvert er en fin måte å markedsføre virksomheten din på.