Share
Wat je gaat creërenMijn klant verkoopt een paar producten en wilde een manier voor bezoekers van de site om een beoordeling of een getuigenis over een bepaald product in te dienen en om die recensies op hun respectievelijke productpagina's op zijn WordPress-site te tonen.
Ik heb de gistermiddag gisteren tot mijn grote frustratie aan deze taak gewerkt en heb hem nu net aan de praat gekregen. Ik kwam erachter dat ik het maakte veel moeilijker dan het in werkelijkheid is. Gravity Vormt de redding!
Er zijn een paar stappen in dit proces:
Laten we beginnen.
Dit is een perfecte situatie voor een aangepast berichttype zoals een blogbericht, alleen speciaal. Aangepaste berichttypen staan los van reguliere blogposts; ze kunnen u helpen uw site om te zetten in een filmdatabase of een receptsite, met hun eigen aangepaste taxonomieën (in plaats van blogcategorieën, denk aan filmregisseurs, acteurs en genres).
Hoewel u handmatig een aangepast berichttype (CPT) kunt maken met behulp van codering, laten we dit op de gemakkelijke manier doen. Installeer Aangepaste Post Type UI en activeer deze. Dit is een zeer nuttige en stabiele plug-in die al vele jaren bestaat.
In de gebruikersinterface van aangepast berichttype stel je een nieuw berichttype in. Hier is een screenshot van mij. Noem het wat je maar wilt; in dit geval is de mijne Reviews.
Je kunt de labels sectie alleen. Maar in instellingen, je wilt een paar wijzigingen aanbrengen.
Ik heb de meeste standaardinstellingen achtergelaten instellingen alleen, maar hebben de box aangevinkt Uitsluiten van zoeken omdat ik geen recensieberichten in de zoekresultaten wil. En in de sectie steunen, Ik heb alleen de selectievakjes aangevinkt voor de elementen die ik moet weergeven op mijn pagina voor het bewerken van recensies: Titel, Editor, en Aangepaste velden.
Als u met de muis over de rode vraagtekens in het paneel Instellingen gaat, ziet u wat elk item doet; je kunt altijd terugkomen en wijzigingen aanbrengen.
Gravity Forms is een geweldige plug-in, maar het zal zelf geen aangepaste berichten verwerken. Daarvoor moet u een andere plug-in, Gravity Forms + Aangepaste berichttypen installeren en activeren. Ga je gang en doe dat, en we zullen aan de slag gaan op het formulier.
Maak in Gravity Forms een nieuw formulier; laten we het een Review sturen. Sla het op en open vervolgens de Postvelden in de rechterkolom. Als u deze velden gebruikt in plaats van de gebruikelijke formuliervelden, wordt een nieuw bericht gemaakt wanneer de gebruiker het formulier verzendt.
Klik eerst op Titel plaatsen om dat veld toe te voegen. In dit geval wil ik dat de titel van mijn bericht de naam is van de persoon die de beoordeling indient. Zie de onderstaande schermafbeelding.
Geef uw veld een naam (hier is het uw naam, dus dit is het label dat de gebruiker ziet). Voor Poststatus, je wilt waarschijnlijk Droogte; dit betekent dat het nieuwe bericht de conceptindeling heeft en niet op uw site wordt gepubliceerd totdat u het goedkeurt.
Standaard bericht Auteur is ingesteld op jou en dat is prima - het maakt hier niet uit - en dat zal ook niet gebeuren Postcategorie omdat we een aangepast berichttype gebruiken. Maak dit veld Verplicht door het onderste vakje aan te vinken.
Ga dan naar de gevorderd tab. Vink het vakje aan voor Opslaan als berichttype en kies het aangepaste berichttype dat je aan het begin van deze tutorial hebt gemaakt.
Dan klikken Bijwerken om uw wijzigingen op te slaan.
Dan voegen we een e-mailveld toe (uit de Geavanceerde velden sectie) zoals in elke vorm, waardoor het wordt Verplicht.
Vervolgens voegen we nog een postveld toe, Lichaam. Dit werkt net als het Alinea-veld in een normale vorm. U hoeft geen andere instellingen voor dit veld te wijzigen dan de veld Label en tikken op de Verplicht checkbox.
Bijna klaar! Omdat mijn klant verschillende producten heeft, willen we de gebruiker vragen welk product hij heeft gekocht. Om dit te doen gaan we een aangepast veld toevoegen vanuit de Postvelden gebied (sleep het naar boven zodat het voor het veld Lichaam verschijnt, zodat de stroom zinvol is).
Voor onze doeleinden willen we dat dit aangepaste veld keuzerondjes zijn, dus kies dat uit Veld soort. Vervolgens moeten we ons aangepaste veld een naam geven. Kies de nieuwe knop omdat we het hier maken en typ vervolgens een naam in het tekstvak. In dit geval is het productnaam.
Vul vervolgens de keuzemogelijkheden voor de keuzerondjes in zoals gebruikelijk, waarbij u ervoor zorgt dat u zowel een label (wat de gebruiker ziet) als een waarde (die u kunt gebruiken om de recensies op productnaam te scheiden) in te voeren.
Maak dit veld Verplicht (en vergeet niet je eigen toe te voegen veld Label bovenaan, voor de gebruiker) en werk het formulier bij. We zijn allemaal klaar met deel 2.
Ik hoop dat je al weet hoe je dit moet doen, maar zo niet, dan is het heel eenvoudig. Ga naar de pagina waar u uw formulier wilt plaatsen en de pagina wilt bewerken.
Plaats de cursor op de plaats waar u het formulier wilt toevoegen. Klik Voeg een formulier toe bovenaan, kies uw nieuwe formulier, vink het uit Titel en Omschrijving selectievakjes en klik erop Formulier invoegen. Het zal een shortcode toevoegen aan de pagina.
Dat is het. En zo ziet het formulier er op de pagina uit.
Ga je gang en probeer het formulier, voeg een paar beoordelingen toe. Ik zou voorstellen om beoordelingen toe te voegen voor ten minste twee of drie producten, zodat we iets hebben om mee te werken in het volgende deel van deze tutorial. U kunt uw testoverzichten later altijd verwijderen.
Nu komen we bij het deel met heel veel mogelijkheden. Als je in de beheerder menu aan de linkerkant, je hebt nu een nieuw menu-item - in mijn geval is het genoemd beoordelingen. Als je daarnaar kijkt, zie je de testrecensies die je hebt ingediend (als die er niet zijn, sla je het laatste deel van stap 3 over - ga naar je formulier en dien testbeoordelingen in, althans voor een paar producten, omdat we heb wat materiaal nodig om mee te werken voor deze stap).
Dit zijn blogberichten, maar ze hebben hun eigen menu-item vanwege uw aangepaste berichttype. Dit helpt u om dingen gescheiden te houden op uw site; u kunt een reguliere blog hebben en vervolgens elk gewenst aantal aangepaste berichttypen voor meer gespecialiseerde informatie. Best cool, ja?
Open een van deze berichten en je ziet alleen de items die je hebt aangevinkt onder Ondersteuning in stap 1 bij het instellen van je aangepaste berichttype. In dit geval is dit de titel, de editor en aangepaste velden. We willen het zo simpel mogelijk houden. Kijk naar het aangepaste veld en je ziet dat het zowel een naam (het label dat je hebt ingevoerd) en een waarde (die je ook hebt ingevoerd) bevat. Die waarde kan worden gebruikt om te bepalen welke recensies worden weergegeven in een aangepaste sjabloon.
Het weergeven van berichten op uw site kan worden gedaan met codering in uw themabestanden of met plug-ins; er zijn heel veel manieren om dit te doen. Voor deze zelfstudie gaan we de beoordelingen toevoegen aan een zijbalkwidget. Ik zal je twee manieren laten zien om dit te doen met een plug-in: een gemakkelijke en een betere.
Voor dit voorbeeld gebruiken we de plug-in Speciale recente berichten. Installeer en activeer het en ga vervolgens naar Instellingen> Widgets. Sleep de widget naar een zijbalk.
Wanneer je het opent, zie je veel opties. Voor dit voorbeeld zijn dit de instellingen die ik heb gebruikt om de lijst met posts hier te krijgen, maar u kunt alles gebruiken wat met uw site werkt.
Zo ziet het eruit in mijn zijbalk:
Het werkt vrij goed direct uit de doos, maar je kunt de weergave aanpassen als je wat CSS kent. U hebt echter niet veel controle over wat wordt weergegeven; u kunt er niet voor kiezen om beoordelingen voor één product weer te geven en deze voor een ander te verbergen. Maar ik zal je laten zien hoe je dat in het volgende deel doet.
Aangepaste inhoud Shortcode is een ongelooflijk nuttige plug-in waarmee u elk type inhoud op elke locatie op uw site kunt weergeven, inclusief widgets. Het heeft een beetje een leercurve, maar het heeft ook geweldige documentatie die is opgenomen in een sectie Referentie in uw Admin-dashboard. Het biedt veel controle over wat wordt weergegeven en zal niet teleurstellen als je wat tijd neemt om te leren hoe je het kunt gebruiken. Het is een tool die je steeds weer kunt gebruiken in je website of blog.
Je zult een beetje op je gemak moeten zijn met HTML en CSS om de weergave van deze widget te stylen - laat het je weten. Het ziet er niet echt uit de doos uit. U kunt de stijlen toevoegen aan het style.css-bestand van uw thema.
Laten we Shortcode aangepaste inhoud gebruiken om een andere widget te maken, maar deze keer beperken we wat wordt weergegeven, zodat we alleen beoordelingen voor een bepaald product kunnen weergeven.
In Instellingen> Widgets, sleep een tekstwidget naar een zijbalk en voeg uw titel toe.
Ik zal je laten zien hoe je de shortcode voor dit voorbeeld kunt instellen, maar ik raad je ten zeerste aan om een kijkje te nemen in de Referentie sectie voor de plug-in, die u krijgt in de plugins pagina (u ziet er een koppeling voor onder de naam van de plug-in). Het is een zeer krachtige tool!
Hier is de shortcode die ik gebruik. Ik zal het regel voor regel doornemen.
[loop type = "review" field = "product_name" value = "boulder_case"] [inhoud] [veldtitel] [velddatum] [/ loop]
Voor loop type, voer de naam in van je aangepaste veld, waarschijnlijk enkelvoud (als dat niet werkt, probeer dan meervoud).
Veld is de aangepaste veldnaam die u hebt gebruikt in Gravity Forms. Waarde is de waarde die is gekoppeld aan het keuzerondje in Gravity Forms.
Deze elementen bepalen de lus, wat betekent dat het elke 'recensie'-bericht één voor één zal doorlopen met degenen met de waarde' boulder_case 'totdat het allemaal bekeken wordt.
Dus binnen je loop, zal het drie dingen weergeven: de inhoud van de post (van het veld Body in Gravity Forms), de titel (de gebruikersnaam) en de gepubliceerde datum.
Slaat dat ergens op? Typ of kopieer dit naar uw tekstwidget, vervang de items in het gedeelte met uw eigen namen, sla het op en kijk wat het genereert.
Het ziet er waarschijnlijk als een puinhoop uit, maar de inhoud is er allemaal, en je zult zien dat alleen de berichten met de specifieke waarde die je hebt ingetypt worden getoond. Dit is krachtig; het betekent dat je kunt creëren een overzichtswidget voor elk productin plaats van alle beoordelingen door elkaar te laten lopen.
Dus nu moet je wat opmaak doen om dingen er beter uit te laten zien - een beetje HTML is nodig.
[loop type = "review" field = "product_name" count = "3"][/lus][inhoud]- [titel van het veld]
[velddatum]
Dit maakt het een stuk makkelijker om te lezen, maar nu is er wat CSS nodig om het te stylen. Ik zal sommige klassen aan deze code toevoegen voor styling.
/ * Beoordelingen * / # 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; regelhoogte: 2.1rem; lettertype-stijl: cursief; marge: 0,5 em 0 0.2em; text-align: right; # sidebar-primary .widget .review-loop .date margin: 0; font-size: 1.4rem; regelhoogte: 1.96rem; lettertype-stijl: cursief; text-align: right;
En hier is het eindproduct helemaal gestyled en klaar voor meer inhoud.
Dus nu weet je:
In een vervolg op dit bericht laat ik je zien hoe je je nieuwe aangepaste inhoud op een pagina kunt weergeven met behulp van een aangepaste sjabloon en lus. Het is een beetje moeilijker, maar geeft je de mogelijkheid om je door de gebruiker ingezonden inhoud echt onder controle te houden. En dan kunt u nadenken over andere manieren om gebruikerscontent te gebruiken, bijvoorbeeld door foto's in een galerij in te dienen. Bezoekers betrekken is een geweldige manier om uw bedrijfssite te promoten.
Accentsconagua