In diesem Tutorial lernen Sie, wie Sie mit WordPress eine benutzerdefinierte Verzeichnis-Seite erstellen und wie die Toolset-Plugins Ihnen dabei helfen können.

 

Wir verwenden eine Kleinanzeigen-Seite, um den Vorgang zu erklären. Die Techniken, die wir vorstellen, können erfolgreich für jede Verzeichnis-Seite angewandt werden, je nach den Elementen Ihrer Wahl.

Eine Verzeichnis-Seite
So erstellen Sie eine Verzeichnisseite mit WordPress
ist eine Sammlung von Elementen, die nach Kategorie sortiert sind.

Sie finden Verzeichnis-Seiten für Werbeanzeigen, Häuser, Autos, Rezepte, Kurse,Touren und Ähnliches.

Auf Verzeichnis-Seiten können Besucher mit Hilfe von Filtern suchen.

Zudem können die Benutzer direkt vom Frontend aus Elemente hinzufügen und eingeloggte Benutzer können die Elemente, die sie hinzugefügt haben, verwalten (auflisten, bearbeiten, löschen).

Außerdem können die Seitenbetreiber den Benutzern die Mitgliedschaft oder das Hinzufügen neuer Elemente in Rechnung stellen.

Obwohl die Erstellung einer benutzerdefinierten Seite wie eine Herausforderung erscheinen kann, müssen Sie dazu kein Experte sein.

Mit den Toolset-Plugins können Sie solche Verzeichnis-Seiten ohne PHP-Programmierung erstellen.

Anforderungen

Folgendes brauchen Sie, um mit WordPress eine benutzerdefinierte Verzeichnis-Seite zu erstellen.

WordPress-Theme

Sie können ein beliebiges WordPress-Theme verwenden.

Plugins, die Sie brauchen

  • Toolset Types
  • Toolset Views
  • Toolset CRED
  • Toolset Access
  • Optional: WooCommerce, Toolset CRED Commerce (wenn Sie planen, Geld für das Einsenden von Anzeigen zu verlangen)

All die obigen Plugins (außer WooCommerce, was ein Gratis-Plugin ist), sind im Toolset-Paket verfügbar.

Erforderliche Fähigkeiten

  • HTML und CSS
  • Sie müssen mit den folgenden Konzepten vertraut sein:
    • Benutzerdefinierte Beitragstypen
    • Benutzerdefinierte Felder
    • Benutzerdefinierte Taxonomien

Was Ihre Seite beinhalten wird

Auf einer Verzeichnis-Seite muss viel untergebracht werden.

Die folgenden Fragen (siehe Tabelle 1) helfen Ihnen herauszufinden, was Sie für Ihre Seite brauchen.

In unseren Beispielantworten haben wir Werbeanzeigen verwendet. Sie können die Anzeigen gern durch die Elemente Ihrer Wahl ersetzen. Das können Häuser, Rezepte, Kurse, Reisen, Autos usw. sein.

Tabelle 1: Was Sie für eine Kleinanzeigen-Seite brauchen könnten und wie Toolset Ihnen hilft

Frage Beispielantwort Was Sie tun müssen
1. Welche Art von Elementen werden auf der Seite erscheinen? Anzeige

  • Titel
  • Beschreibung (Anzeigentext)
  • Bild
  • Preis
  • Kontakt-E-Mail-Adresse
  • Telefon
  • Kategorie
  • Bücher
  • Elektronische Geräte
  • Verschiedenes
Richten Sie die benutzerdefinierten Beitragstypen, Felder und Taxonomie für alle Elemente auf der Seite ein.

Siehe Details:

Teil 1: Einrichtung der Strukturen

2. Welche Informationen wollen Sie Besuchern anzeigen?
  • Aktuelle Anzeigen in einem Gitter
  • Hervorgehobene Anzeigen in einem Slider
  • Eine Suche, mit der die Benutzer benötigte Elemente mit Hilfe von Filtern finden können
Siehe Details:

Teil 2: Gestaltung der Templates

3. Welche Frontend-Formulare brauchen Sie?
  • Frontend-Formular zum Hinzufügen und Bearbeiten von Anzeigen
Siehe Details:

Teil 3: Anzeigen und Bearbeiten von Elementen im Frontend

4. Wie sollen sich Ihre Nutzer registrieren und auf Ihrer Seite einloggen?
  • Um sich zu registrieren, erstellen Benutzer vom Frontend aus Accounts.
  • Zum Einloggen auf der Seite werden sie ein benutzerdefiniertes Login-Formular verwenden.
Siehe Details:

Teil 4: Bearbeitung der Benutzerregistrierungen und Account-Verwaltung

Teil 1: Einrichtung der benutzerdefinierten Beitragstypen, Felder und Taxonomie

Als erstes müssen wir den benutzerdefinierten Beitragstyp einrichten, der auf der Verzeichnis-Seite erscheinen wird.

In unserem Beispiel erstellen wir eine Verzeichnis-Seite für „Anzeigen„. Natürlich können Sie auch für alles andere Verzeichnis-Seiten erstellen.

Zu befolgende Schritte

Hinzufügen eines neuen Beitragstyps

Hinzufügen eines neuen Beitragstyps

  1. Gehen Sie auf Toolset->Dashboard.
  2. Erstellen Sie einen neuen Beitragstyp für Anzeigen.
    1. Nutzen Sie den Beitragstitel, um den Titel Ihrer Anzeigen zu speichern.
    2. Nutzen Sie den Editor, um den Text Ihrer Anzeige zu speichern.

Hinzufügen von Gruppen benutzerdefinierter Felder

Hinzufügen von Gruppen benutzerdefinierter Felder

  1. Gehen Sie zurück zum Toolset-Dashboard. Fügen Sie nun Felder für diesen Typ hinzu.
  2. Klicken Sie auf Feldgruppe erstellen.
  3. Nutzen Sie den Button Neues Feld hinzufügen, um die folgenden Felder hinzuzufügen:
    1. Preis (als Zahl)
    2. Artikelbild (als Bild)
    3. Kontakt-E-Mail (als E-Mail)
    4. Telefonnummer (als Nummer)

Hinzufügen benutzerdefinierter Taxonomien

Hinzufügen benutzerdefinierter Taxonomien

  1. Gehen Sie zum Toolset-Dashboard zurück.
  2. Benutzen Sie den Button Taxonomie erstellen, um die Taxonomie „Anzeigen-Kategorie“ hinzuzufügen. Diese werden Sie zum Sortieren Ihrer Anzeigen verwenden.

Anzeigen-Kategorien - WordPress-Backend

Anzeigen-Kategorien – WordPress-Backend

Jetzt, wenn Ihre Taxonomie fertig ist, fügen Sie die Kategorien Ihrer Anzeigen hinzu (Begriffe).

  1. Gehen Sie auf Anzeigen -> Anzeigen-Kategorien.
  2. Fügen Sie die folgenden Kategorien hinzu:
    • Bücher
    • Elektronische Geräte
    • Verschiedenes

Beispielanzeigen - WordPress-Backend

Beispielanzeigen – WordPress-Backend

  1. Fügen Sie Ihrer Seite einige Beispielanzeigen hinzu.

Wenn Sie Hilfe bei der Erstellung benutzerdefinierter Beitragstypen, Felder oder Taxonomien brauchen, lesen Sie die vollständige Erklärung in der Types-Dokumentation.

Teil 2: Anzeige der Elemente im Frontend

Nun, da Ihr WordPress-Backend bereit zum Speichern der Elemente ist, ist es Zeit, sie im Frontend anzuzeigen.

In Tabelle 2 unten finden Sie einige Beispiel-Templates, die Sie für Ihre Seite erstellen könnten, und Sie erfahren, wie Toolset Ihnen helfen kann.

Tabelle 2: Beispiel-Templates, die Sie für eine Verzeichnis-Seite brauchen könnten

Template Was Sie tun müssen
Einzelanzeigen-Details

Beispielseite mit Anzeigen-Details, die mit Toolset-Plugins erstellt wurde

Beispielseite mit Anzeigen-Details, die mit Toolset-Plugins erstellt wurde
Erstellen Sie ein Inhalts-Template für den benutzerdefinierten Beitragstyp, den Sie einrichten.

Ihr Template wird benutzerdefinierte Beitragsfelder anzeigen, die zu Ihrem Beitragstyp gehören.

Lernen Sie dies in:

Views-Trainingskurs, Teil 1: Inhalts-Template

8 aktuellste Anzeigen in einem Gitter

Seite zeigt die 8 aktuellsten Anzeigen in einem Gitter an

Seite zeigt die 8 aktuellsten Anzeigen in einem Gitter an
Erstellen Sie eine View, die Ihre Elemente aufführt.

Bei der Erstellung einer View entscheiden Sie, wie Ihre Elemente angezeigt werden sollen (als Liste, Gitter, Tabelle usw.) und welche Felder in jedem Element enthalten sein sollen.

Lernen Sie dies in:

Views-Trainingskurs, Teil 2: View

Zufällige hervorgehobene Anzeigen in einem Slider

Seite zeigt zufällige hervorgehobene Anzeigen in einem Slider an

Seite zeigt zufällige hervorgehobene Anzeigen in einem Slider an
Erstellen Sie eine View, die Ihre hervorgehobenen Elemente in einem Slider anzeigt.

Nutzen Sie Filter basierend auf Ihrem Beitragsfeld, um nur hervorgehobene Anzeigen auszuwählen.

Lernen Sie dies in:

Views-Trainingskurs, Teil 5: Slider

Benutzerdefinierte Suche nach Anzeigen

Benutzerdefinierte Suche nach Anzeigen

Benutzerdefinierte Suche nach Anzeigen
Erstellen Sie eine benutzerdefinierte Such-View.

Verwenden Sie benutzerdefinierte Felder und Kategorien als Filter.

Lernen Sie dies in:

Views-Trainingskurs, Teil 7: Erstellung einer benutzerdefinierten Suche mit Views

Kategoriebaum

Kategoriebaum, erstellt mit Toolset-Plugins

Kategoriebaum, erstellt mit Toolset-Plugins
Wenn Sie Ihre Kategorien in Unterkategorien eingeteilt haben, können Sie einen Kategoriebaum erstellen.

Erstellen Sie zwei Taxonomie-Views (eine für die Kategorie auf erster Ebene und eine für Unterkategorien) und fügen Sie die eine in die andere ein.

Siehe Details:

Taxonomie-View mit einer Taxonomie-View für ein untergeordnetes Element

Teil 3: Anzeigen und Bearbeiten von Elementen im Frontend

Die meisten Verzeichnis-Seiten ermöglichen es Besuchern, im Frontend Inhalte zu erstellen und einzusenden. Um Elemente im Frontend hinzuzufügen und zu bearbeiten, brauchen Sie die entsprechenden Formulare. Als nächstes müssen Sie einstellen, wer auf welche Formulare zugreifen darf.

Sehen Sie sich die Tabelle 3 unten an, um zu erfahren, welche Frontend-Formulare Sie brauchen könnten und wie Toolset Ihnen helfen kann.

Tabelle 3: Frontend-Formulare, die Sie für Ihre Verzeichnis-Seite brauchen könnten

Was Sie brauchen Was Sie brauchen
Formulare zum Einsenden neuer Anzeigen

Formulare zum Einsenden neuer Anzeigen

Formulare zum Einsenden neuer Anzeigen
Erstellen Sie ein Beitragsformular für die Frontend-Inhaltseinsendung. Legen Sie die entsprechenden Zugriffsrechte fest.

Lernen Sie dies in:

CRED-Trainingskurs, Teil 1: Erstellung von Formularen zum Einsenden von Inhalten

CRED-Trainingskurs, Teil 2: Anpassung des Formularinhalts

Formulare zur Bearbeitung von Anzeigen

Formular zur Bearbeitung von Anzeigen

Formular zur Bearbeitung von Anzeigen
Erstellen Sie Beitragsformulare für die Bearbeitung von Inhalten im Frontend.

Legen Sie fest, wer den Inhalt bearbeiten kann. In den meisten Fällen erlauben Sie den Seiteneigentümern, ihre eigene Anzeigen zu bearbeiten.

CRED-Trainingskurs, Teil 5: Erstellung von Formularen für die Bearbeitung von Inhalten

CRED-Trainingskurs, Teil 9: Auflistung von Elementen, die dem eingeloggten Benutzer gehören

Sie können auch eine automatische Ablaufdauer für alle Beiträge festlegen, die über diese Formulare eingesandt wurden.

Lernen Sie dies in: CRED-Trainingskurs, Teil 4: Festlegen automatischer Ablauftermine für Beiträge

Teil 4: Umgang mit Benutzerregistrierungen und Account-Verwaltung

Benutzerregistrierung

Wenn Sie es Ihren Benutzern ermöglichen, im Frontend Elemente zu bearbeiten, brauchen Sie höchstwahrscheinlich auch Frontend-Formulare für die Benutzerregistrierung und die Bearbeitung von Profilen direkt vom Frontend aus.

Die Tabelle 4.1 unten fasst zusammen, welche Benutzerformulare Sie brauchen und wie Toolset Ihnen helfen kann.

Was Sie brauchen Was Sie brauchen
Frontend-Formulare zur Erstellung neuer Benutzerkonten

Mit dem CRED-Plugin erstelltes Frontend-Formular zur Erstellung neuer Benutzerkonten

Mit dem CRED-Plugin erstelltes Frontend-Formular zur Erstellung neuer Benutzerkonten
Erstellen Sie ein Benutzerformular für die Registrierung von Benutzern.

In Ihr Frontend-Formular können Sie auch zusätzliche benutzerdefinierte Felder einfügen.

Direkt nach der Erstellung können Sie dem Formular eine beliebige

und individuelle Seitengestaltung hinzufügen.

Lernen Sie dies in:

CRED-Trainingskurs, Teil 6: Erstellung von Formularen zum Anlegen von Benutzerkonten

Frontend-Formulare für die Bearbeitung von Benutzerprofilen

Mit dem CRED-Plugin erstelltes Frontend-Formular zum Bearbeiten von Benutzerprofilen

Mit dem CRED-Plugin erstelltes Frontend-Formular zum Bearbeiten von Benutzerprofilen
Verwenden Sie ein Benutzerformular zum Bearbeiten der Benutzerprofile.

Lernen Sie dies in:

CRED-Trainingskurs, Teil 8: Erstellung von Formularen für die Bearbeitung von Benutzerprofilen

Login-Formular und Account-Verwaltung

Um Benutzern zu erlauben, sich auf Ihrer Seite einzuloggen, erstellen Sie ein benutzerdefiniertes Login-Formular, das zum Gesamt-Look Ihrer Seite passt. Nachdem der Benutzer sich eingeloggt hat, zeigen Sie Links zu den Ressourcen des Benutzers an.

Das Login-Formular und das Guthaben des Benutzers bilden die Seite „Mein Account“. In Tabelle 4.2 unten sehen Sie, was die Account-Seite beinhalten sollte und wie Toolset Ihnen helfen kann.

Tabelle 4.2: Erstellung der Seite „Mein Account“ mit Toolset

Seite „Mein Account“ Was Sie brauchen

Toolset ermöglicht es Ihnen, Ihr benutzerdefiniertes Login-Formular anzuzeigen.

Toolset ermöglicht es Ihnen, Ihr benutzerdefiniertes Login-Formular anzuzeigen.
Um Benutzern zu erlauben, sich auf Ihrer Seite einzuloggen, erstellen Sie ein benutzerdefiniertes Login-Formular, das zum Gesamt-Look Ihrer Seite passt.

Lernen Sie dies in:

CRED-Trainingskurs, Teil 7: Erstellung der „Mein Account“-Seite mit einem Login-Formular

Toolset ermöglicht es Ihnen, eine benutzerdefinierte

Toolset ermöglicht es Ihnen, eine benutzerdefinierte „Mein Account“-Seite zu erstellen, die das Guthaben des eingeloggten Benutzers anzeigt.
Sobald sie sich eingeloggt haben, sollten Benutzer direkt vom Frontend aus ihre Ressourcen verwalten können (d. h. die von ihnen erstellten Objekte auflisten, bearbeiten und löschen).

Sie können diese an einer Stelle auf der „Mein Account“-Seite sammeln.

Lernen Sie dies in:

CRED-Trainingskurs, Teil 7: Erstellung der „Mein Account“-Seite mit einem Login-Formular

Teil: Berechnen von Gebühren für das Einsenden von Inhalten oder die Mitgliedschaft

Oft wollten die Eigentümer von Verzeichnisseiten mit der Seite Profit erzielen.

Beispiele:

  1. Die Benutzer dürfen kostenlose Anzeigen hinzufügen, die nach einer zuvor festgelegten Dauer ablaufen, sowie auch langfristige Anzeigen, die nie ablaufen, aber kostenpflichtig sind.
  2. Eventuell bietet die Seite Kurse an. Einige Kurse stehen allen offen, während andere nur für Premium-Kunden verfügbar sind – also Kunden, die für ihre Mitgliedschaft bezahlt haben.

Beide Fälle können mit Toolset und dem WooCommerce-Plugin umgesetzt werden.

Nutzen Sie das CRED Commerce-Plugin, um Gebühren für die Einsendung von Inhalten und die Mitgliedschaft in Rechnung zu stellen.

Details finden Sie in der CRED-Dokumentation:

Fragen?

Agnes Bury, Tutorial-Erstellerin

Agnes Bury, Tutorial-Erstellerin

Lieber Leser,

vielen Dank, dass Sie das Tutorial gelesen haben, ich weiß das wirklich zu schätzen.

Ich freue mich darauf, Ihr Feedback zu hören. Wenn Sie noch kein Toolset-Kunde sind, können Sie mir Ihre Fragen gern über dieses Formular senden. Ich freue mich darauf, sie zu beantworten.