Share
Was Sie erstellen werdenMein Kunde verkauft ein paar Produkte und wollte, dass Website-Besucher eine Bewertung oder ein Zeugnis über ein bestimmtes Produkt einreichen und diese Bewertungen auf ihren jeweiligen Produktseiten in seiner WordPress-Site anzeigen können.
Ich habe gestern Nachmittag den ganzen Nachmittag an dieser Aufgabe gearbeitet, zu meiner großen Frustration, und habe es gerade erst zum Laufen gebracht. Ich habe herausgefunden, dass ich es geschafft habe viel schwerer als es wirklich ist. Schwerkraftformen zur Rettung!
Es gibt einige Schritte in diesem Prozess:
Lass uns anfangen.
Dies ist eine perfekte Situation für einen benutzerdefinierten Beitragstyp - wie ein Blogbeitrag, nur etwas Besonderes. Benutzerdefinierte Beitragstypen unterscheiden sich von regulären Blogbeiträgen. Sie können Ihnen dabei helfen, Ihre Website in eine Filmdatenbank oder eine Rezeptseite zu verwandeln, mit eigenen Taxonomien (anstelle von Blogkategorien, denken Sie an Filmregisseure, Schauspieler und Genres)..
Sie können zwar einen benutzerdefinierten Beitragstyp (CPT) mithilfe von Codierung manuell erstellen, doch lassen Sie uns dies auf einfache Weise tun. Installieren Sie die benutzerdefinierte Post-Type-Benutzeroberfläche und aktivieren Sie sie. Dies ist ein sehr nützliches und stabiles Plugin, das seit vielen Jahren existiert.
In der Benutzerdefinierten Beitragstyp-Benutzeroberfläche richten Sie einen neuen Beitragstyp ein. Hier ist ein Screenshot von mir. Nennen Sie es, wie Sie möchten. in diesem Fall ist mein Bewertungen.
Sie können das verlassen Etiketten Abschnitt alleine. Aber in die Einstellungen, Sie möchten einige Änderungen vornehmen.
Ich habe die meisten Standardeinstellungen unter gelassen die Einstellungen allein, aber haben die Box für angekreuzt Von der Suche ausschließen da ich keine Beiträge in den Suchergebnissen überprüfen möchte. Und in der Sektion Unterstützt, Ich habe nur die Kontrollkästchen für die Elemente markiert, die auf meiner Bearbeitungsseite für Review-Beiträge angezeigt werden müssen: Titel, Editor, und Benutzerdefinierte Felder.
Wenn Sie mit der Maus über die roten Fragezeichen im Einstellungsfenster fahren, sehen Sie, was die einzelnen Elemente tun. Sie können jederzeit zurückkommen und Änderungen vornehmen.
Gravity Forms ist ein großartiges Plugin, kann aber mit benutzerdefinierten Beiträgen nicht alleine umgehen. Dazu müssen Sie ein weiteres Plugin installieren und aktivieren: Gravity Forms + Custom Post Types. Machen Sie das und machen Sie mit dem Formular.
Erstellen Sie in Schwerkraftformulare ein neues Formular. Nennen wir es eine Bewertung abgeben. Speichern Sie es und öffnen Sie die Felder posten in der rechten Spalte. Wenn Sie diese Felder anstelle der üblichen Formularfelder verwenden, wird ein neuer Beitrag erstellt, wenn der Benutzer das Formular sendet.
Klicken Sie zuerst auf Titel veröffentlichen um dieses Feld hinzuzufügen. In diesem Fall möchte ich, dass der Titel meines Beitrags der Name der Person ist, die die Überprüfung einreicht - siehe Screenshot unten.
Benennen Sie Ihr Feld (hier ist es Ihr Name, also die Bezeichnung, die der Benutzer sehen kann). Zum Poststatus, du willst wahrscheinlich Entwurf; Dies bedeutet, dass der neue Beitrag im Entwurfsformat vorliegt und erst auf Ihrer Website veröffentlicht wird, wenn Sie ihn genehmigt haben.
Standard-Beitragsautor ist für Sie eingestellt und das ist in Ordnung - es ist hier egal - und auch nicht Kategorie posten da wir einen benutzerdefinierten Beitragstyp verwenden. Machen Sie dieses Feld Erforderlich indem Sie das untere Kontrollkästchen aktivieren.
Dann gehe zum Erweitert Tab. Kreuzen Sie das Kästchen an für Als Beitragstyp speichern Wählen Sie den benutzerdefinierten Beitragstyp aus, den Sie zu Beginn dieses Lernprogramms erstellt haben.
Dann klick Aktualisieren um die Änderungen zu speichern.
Dann fügen wir ein E-Mail-Feld (aus dem Erweiterte Felder Abschnitt) wie mit jeder Form, machen es Erforderlich.
Als nächstes fügen wir ein weiteres Post-Feld hinzu, Karosserie. Dies funktioniert genauso wie das Feld Paragraph Text in einer normalen Form. Sie sollten keine Einstellungen für dieses Feld außer dem ändern Feldbezeichnung und das ticken Erforderlich Kontrollkästchen.
Fast fertig! Da mein Kunde mehrere Produkte hat, möchten wir den Benutzer fragen, welches Produkt er gekauft hat. Dazu fügen wir ein benutzerdefiniertes Feld aus dem hinzu Felder posten Bereich (ziehen Sie es nach oben, sodass es vor dem Feld Körper erscheint, sodass der Fluss sinnvoll ist).
Für unsere Zwecke möchten wir, dass dieses benutzerdefinierte Feld Optionsfelder ist. Wählen Sie also eines aus Feldtyp. Dann müssen wir unserem benutzerdefinierten Feld einen Namen geben. Wählen Sie das Neu Schaltfläche, da wir es hier machen, und geben Sie einen Namen in das Textfeld ein. In diesem Fall ist es Produktname.
Füllen Sie dann wie üblich die Optionsschaltflächen aus und stellen Sie sicher, dass Sie sowohl eine Bezeichnung (was der Benutzer sieht) als auch einen Wert (mit dem Sie die Bewertungen nach Produktnamen trennen können) eingeben..
Machen Sie dieses Feld Erforderlich (und vergessen Sie nicht, Ihre eigenen hinzuzufügen Feldbezeichnung oben für den Benutzer) und aktualisieren Sie das Formular. Wir sind alle mit Teil 2 fertig.
Ich hoffe, dass Sie bereits wissen, wie das geht, aber wenn nicht, ist es sehr einfach. Gehen Sie zu der Seite, auf der Sie Ihr Formular ablegen möchten, und bearbeiten Sie die Seite.
Setzen Sie den Cursor an die Stelle, an der Sie das Formular hinzufügen möchten. Klicken Formular hinzufügen Wählen Sie oben Ihr neues Formular aus, und deaktivieren Sie das Kontrollkästchen Titel und Beschreibung Kontrollkästchen und klicken Sie auf Formular einfügen. Dadurch wird der Seite ein Kurzcode hinzugefügt.
Das ist es. Und so sieht das Formular auf der Seite aus.
Probieren Sie das Formular aus und fügen Sie ein paar Bewertungen hinzu. Ich empfehle, Bewertungen für mindestens zwei oder drei Produkte hinzuzufügen, damit wir im nächsten Teil dieses Tutorials etwas zu tun haben. Sie können Ihre Testberichte später jederzeit löschen.
Nun kommen wir zu dem Teil, der viele Möglichkeiten hat. Wenn du in das schaust Administrator Menü auf der linken Seite haben Sie jetzt einen neuen Menüpunkt - in meinem Fall heißt es Bewertungen. Wenn Sie sich das anschauen, werden die von Ihnen abgegebenen Testberichte angezeigt. Wenn dies nicht der Fall ist, haben Sie den letzten Teil von Schritt 3-Gehe zu Ihrem Formular übersprungen und Testberichte eingereicht, zumindest für einige Produkte brauche Material für diesen Schritt).
Dies sind Blogbeiträge, die jedoch aufgrund Ihres benutzerdefinierten Beitragstyps über ein eigenes Menüelement verfügen. Dies hilft Ihnen, die Dinge auf Ihrer Website getrennt zu halten. Sie können ein reguläres Blog und dann eine beliebige Anzahl benutzerdefinierter Posttypen verwenden, um speziellere Informationen zu verarbeiten. Ziemlich cool, ja?
Öffnen Sie einen dieser Einträge, und Sie sehen nur die Elemente, die Sie in Schritt 1 unter Unterstützte Elemente angekreuzt haben, wenn Sie Ihren benutzerdefinierten Beitragstyp einrichten. In diesem Fall handelt es sich um den Titel, den Editor und benutzerdefinierte Felder. Wir möchten es so einfach wie möglich halten. Schauen Sie sich das benutzerdefinierte Feld an und Sie werden sehen, dass es sowohl einen Namen (das von Ihnen eingegebene Label) als auch einen Wert (den Sie auch eingegeben haben) hat. Mit diesem Wert kann gesteuert werden, welche Bewertungen in einer benutzerdefinierten Vorlage angezeigt werden.
Das Anzeigen von Posts auf Ihrer Website kann durch Kodierung in Ihren Designdateien oder mit Plugins erfolgen. es gibt viele viele Möglichkeiten dies zu tun. In diesem Tutorial fügen wir die Bewertungen einem Sidebar-Widget hinzu. Ich zeige Ihnen zwei Möglichkeiten, dies mit einem Plugin zu tun: eine einfache und eine bessere.
Für dieses Beispiel verwenden wir das Plugin Special Recent Posts. Installieren und aktivieren Sie es und gehen Sie zu Einstellungen> Widgets. Ziehen Sie das Widget in eine Seitenleiste.
Wenn Sie es öffnen, sehen Sie viele Optionen. Für dieses Beispiel sind dies die Einstellungen, die ich verwendet habe, um die Liste der Beiträge anzuzeigen, aber Sie können alles verwenden, was mit Ihrer Site funktioniert.
So sieht es in meiner Sidebar aus:
Es funktioniert ziemlich gut, aber Sie können die Anzeige anpassen, wenn Sie einige CSS kennen. Sie haben jedoch nicht viel Kontrolle darüber, was angezeigt wird. Sie können keine Bewertungen für ein Produkt anzeigen und sie für ein anderes ausblenden. Aber ich werde dir im nächsten Teil zeigen, wie das geht.
Custom Content Shortcode ist ein erstaunlich nützliches Plugin, mit dem Sie beliebige Inhalte auf Ihrer Website anzeigen können, einschließlich Widgets. Es hat eine gewisse Lernkurve, aber es hat auch eine großartige Dokumentation, die in einem Referenzabschnitt direkt in Ihrem Admin-Dashboard enthalten ist. Es bietet eine Menge Kontrolle über die angezeigten Inhalte und wird Sie nicht enttäuschen, wenn Sie sich ein wenig Zeit nehmen, um sich mit der Bedienung vertraut zu machen. Es ist ein Tool, das Sie immer wieder in Ihrer Website oder Ihrem Blog verwenden können.
Sie müssen sich mit HTML und CSS ein wenig auskennen, um die Anzeige dieses Widget zu gestalten. Es sieht nicht viel nach dem Auspacken aus. Sie können die Stile zur style.css-Datei Ihres Themes hinzufügen.
Verwenden Sie den benutzerdefinierten Kurzcode für Inhalte, um ein anderes Widget zu erstellen. Diesmal beschränken wir jedoch die Anzeige, sodass nur Bewertungen für ein bestimmtes Produkt angezeigt werden können.
Im Einstellungen> Widgets, Ziehen Sie ein Text-Widget in eine Seitenleiste und fügen Sie Ihren Titel hinzu.
Ich zeige Ihnen, wie Sie den Shortcode für dieses Beispiel einrichten, aber ich empfehle Ihnen dringend, einen Blick in die Referenz Abschnitt für das Plugin, das Sie im Plugins Seite (Sie sehen einen Link dafür unter dem Plugin-Namen). Es ist ein sehr mächtiges Werkzeug!
Hier ist der Shortcode, den ich verwende. Ich werde es Zeile für Zeile durchgehen.
[loop type = "review" field = "Produktname" value = "boulder_case"] [Inhalt] [Feldtitel] [Felddatum] [/ loop]
Zum Schleifentyp, Geben Sie den Namen Ihres benutzerdefinierten Felds ein, wahrscheinlich Singular (wenn dies nicht funktioniert, versuchen Sie es mit Plural)..
Feld ist der Name des benutzerdefinierten Feldes, das Sie in Gravity Forms verwendet haben. Wert ist der Wert, der dem Optionsfeld in Schwerkraftformulare zugeordnet ist.
Diese Elemente steuern die Schleife, das heißt, sie durchlaufen jeden Überprüfungsposten nacheinander und zeigen die mit dem Wert 'boulder_case' an, bis sie alle betrachtet werden.
In Ihrer Schleife werden also drei Dinge angezeigt: der Inhalt des Posts (aus dem Body-Feld in Gravity Forms), der Titel (der Name des Benutzers) und das Veröffentlichungsdatum.
Ist das sinnvoll? Geben Sie dies in Ihr Text-Widget ein, oder kopieren Sie es in Ihr Text-Widget. Ersetzen Sie die Elemente in dem Abschnitt durch Ihre eigenen Namen, speichern Sie es und sehen Sie sich an, was es generiert.
Es sieht wahrscheinlich wie ein Durcheinander aus - aber der Inhalt ist alles vorhanden und Sie werden feststellen, dass nur die Beiträge mit dem von Ihnen eingegebenen Wert angezeigt werden. Das ist mächtig; es bedeutet, dass Sie erstellen können ein Review-Widget für jedes ProduktAnstatt alle Bewertungen zusammenzubringen.
Jetzt müssen Sie einige Formatierungen vornehmen, um die Dinge besser aussehen zu lassen - ein wenig HTML ist erforderlich.
[loop type = "review" Feld = "Produktname" count = "3"][/Schleife][Inhalt]- [Feldtitel]
[Felddatum]
Das macht das Lesen sehr viel einfacher, aber jetzt wird etwas CSS zum Gestalten benötigt. Ich werde diesem Code einige Klassen für das Styling hinzufügen.
/ * Reviews * / # 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; Zeilenhöhe: 2.1rem; Schriftstil: kursiv; Marge: 0,5 em 0 0,2 em; Textausrichtung: rechts; # sidebar-primary .widget .review-loop .date margin: 0; Schriftgröße: 1.4rem; Zeilenhöhe: 1.96rem; Schriftstil: kursiv; Textausrichtung: rechts;
Und hier ist das fertige Produkt alles gestylt und bereit für mehr Inhalt.
Nun weißt du:
Im Anschluss an diesen Beitrag werde ich Ihnen zeigen, wie Sie Ihren neuen benutzerdefinierten Inhalt auf einer Seite mithilfe einer benutzerdefinierten Vorlage und einer Schleife anzeigen können. Es ist etwas schwieriger, gibt Ihnen jedoch die Möglichkeit, Ihre vom Nutzer eingereichten Inhalte wirklich zu kontrollieren. Und dann können Sie auch über andere Möglichkeiten nachdenken, wie Sie mit Inhalten versehene Fotos in eine Galerie einfügen können. Die Einbindung von Besuchern ist eine großartige Möglichkeit, um Ihre Business-Site zu bewerben.
Accentsconagua