Wie richte ich einen Mitgliederbereich für meine Kursteilnehmer ein?
INHALTSVERZEICHNIS
- Aufbau des Mitgliederbereichs
- Seite "Login" bearbeiten
- Shortcode für Login-Funktion
- Ansicht der Login-Seite im Frontend
- Bearbeitungsmodus Seite “Mein Konto”
- Seite speichern/aktualisieren”
- Mitgliederbereich einrichten
- Seite "Login" als Menüpunkt zur Navigation hinzufügen
- Dropdown-Menü “Persönlicher Bereich” erstellen
- Logout-Link hinzufügen
- Seite "Mein Konto" hinzufügen
- Seite "Mein Konto" und Logout-Link als Unterpunkt von "Persönlicher Bereich"
- Seite in der Navigation nur für Besucher anzeigen
- Menü speichern
- Ansicht des Hauptmenüs als nicht eingeloggter Besucher
- Ansicht des Hauptmenüs als eingeloggter Benutzer
Ab dem Zeitpunkt, ab dem du Produkte oder Online Kurse zum Kauf anbietest, solltest du auf jeden Fall einen Mitgliederbereich für deine Kursteilnehmer bzw. Kunden auf deiner Spreadmind Webseite einrichten.
In dieser Anleitung möchten wir dir den Aufbau des Mitgliederbereichs erklären und dir zeigen, wie du verschiedene Seiten dem Hauptmenü hinzufügen und Unterseiten erstellen kannst.
Login Spreadmind Plattform
Um einen Mitgliederbereich für deine Kursteilnehmer einzurichten, loggst du dich zunächst im Backend deiner Spreadmind Plattform ein. Wie das geht, erfährst du in dieser Anleitung.
1. Aufbau des Mitgliederbereichs
Nachdem du dich eingeloggt hast, gehst du im linken Bereich des Backends zur Rubrik “Webseite” > “Seiten”. Dort bekommst du eine Übersicht aller Seiten, die bereits erstellt wurden. In dieser Übersicht kannst du erkennen, dass wir bereits für dich die Seite "Login" und "Mein Konto" erstellt haben.
1.1 Seite "Login" bearbeiten
Um die Seite "Login" bearbeiten zu können, fährst du mit dem Cursor über die Zeile des entsprechenden Eintrags in der Übersicht. Daraufhin wird dir das Bearbeitungsmenü angezeigt und du klickst auf den Menüpunkt "Anschauen". Nun öffnet sich die Seite "Login" im Frontend deiner Spreadmind Plattform. Durch Klicken des Menüpunkts "Visuellen Builder aktivieren" öffnet sich der Divi Builder, über den du die einzelnen Inhalte der Seite "Login" bearbeiten kannst.
1.2 Shortcode für Login-Funktion
Im Bearbeitungsmodus dieser Seite fährst du nun mit dem Cursor über den Textbereich "Willkommen, der Login hat geklappt", woraufhin ein dunkelgraues Menü angezeigt wird. Klicke in diesem Menü auf das Zahnrad an zweiter Position von links gesehen, um die Einstellungen des Text-Moduls “Text Einstellungen” zu öffnen. Dort siehst du, dass wir hier in den Editor bereits einen Shortcode für den Login eingebunden haben. Die Erweiterung des Shortcodes um redirect="/mein-konto" bewirkt, dass der Benutzer nach dem Einloggen automatisch zu der Seite “Mein Konto” weitergeleitet wird:
1.3 Ansicht der Login-Seite im Frontend
Wenn du als Administrator die Login-Seite im Frontend auf, ist dort lediglich der Hinweis aufgeführt, dass du bereits eingeloggt bist. Rufst du die Seite hingegen als Besucher auf, ist dort ein Login-Formular zu sehen. Hier kann ein Benutzer auch direkt seine Logindaten für spätere Logins speichern lassen und sein Passwort zurücksetzen, sollte er es vergessen haben.
1.4 Bearbeitungsmodus Seite “Mein Konto”
Über die Seiten-Übersicht “Webseite” > “Seiten” gehst du nun in den Bearbeitungsmodus der Seite “Mein Konto”. Klicke auch hierfür auf “Bearbeiten” und in der anschließend geöffneten Ansicht im Frontend wiederum auf "Visuellen Builder aktivieren".
Öffne nun im Bearbeitungsmodus die Einstellungen des Text-Moduls durch Klick auf das Zahnrad im dunkelgrauen Menü:
Hier ist bereits der Shortcode [ld_profile] hinterlegt. Dieser ist mit der Online-Kurs-Funktion verknüpft und zeigt dem Benutzer all die Kurse an, in welche er eingeschrieben ist. Du als Admin und Autor deiner Kurse wirst dort alle deine erstellten Kurse sehen:
Unterhalb der Darstellung des Kurs-Profils findest du die Übersicht für bisherige Bestellungen. Öffne hier wiederum die Einstellungen des Text-Moduls durch Klick auf das Zahnrad im dunkelgrauen Menü:
Hier ist bereits der Shortcode [purchase_history] hinterlegt. Dieser zeigt dem Benutzer all seine getätigten Käufe und kann dort zu jeder Zeit die Bestellbestätigungsseite aufrufen.
1.5 Seite speichern/aktualisieren
Wenn du deine Änderungen am Text der Seite speichern möchtest, kannst du dies über den grünen Button unten rechts mit dem weißen Häkchen in den Einstellungen des jeweiligen Text-Moduls machen.
Solltest du vergessen haben, deine Änderungen zu speichern, wird dir per Klick auf den Button "Visuellen Builder verlassen" ein Pop-Up-Fenster angezeigt, dass dich daran erinnert, dass du ungespeicherte Änderungen hast und dir die Möglichkeit bietet, dies vor dem Verlassen der Seite nachzuholen:
2. Mitgliederbereich einrichten
In dem zweiten Teil dieser Anleitung werden wir deinem Hauptmenü die drei folgenden Seiten bzw. Funktionen hinzufügen:
- Seite “Login”
- Dropdown-Menü “Persönlicher Bereich” mit Seite “Mein Konto” als Unterpunkt
- “Logout”-Link als Unterpunkt zu “Persönlicher Bereich”
2.1 Seite "Login" als Menüpunkt zur Navigation hinzufügen
Um die Seite "Login" als Menüpunkt der Navigation hinzuzufügen, gehst du im Backend deiner Spreadmind Plattform zu “Webseite” > “Menüs”. Alle weiteren Schritte zeigt dir diese Anleitung.
2.2 Dropdown-Menü “Persönlicher Bereich” erstellen
Um das Dropdown-Menü "Persönlicher Bereich" zu erstellen, kannst du in der Menüübersicht bleiben. Gehe dort wieder zur Optionen-Box "Menüpunkte hinzufügen" und klappe dort die Optionen für “Individuelle Links” auf. Solltest du diese nicht sehen können, kannst du diese rechts oben über den Tab “Ansicht anpassen” mit einem Haken markieren, sodass diese angezeigt wird.
Trage bei “URL” einfach eine Raute "#" ein, somit ist der Link also solcher aktiv, allerdings leitet er zu keiner Seite weiter. Als “Link-Text” fügst du am besten “Persönlicher Bereich” ein.
Klicke anschließend auf den Button “Zum Menü hinzufügen”, um den persönlichen Bereich in die Menüstruktur einzugliedern.
2.3 Logout-Link hinzufügen
Um einen Logout-Link hinzuzufügen, kannst du ebenfalls in der Menüübersicht bleiben. In der Optionen-Box "Menüpunkte hinzufügen" kannst du die Optionen für "Individuelle Links" ausklappen. Bei der URL trägst du dieses Mal folgenden Link ein:
#logout#
Achte bitte auf die richtige Schreibweise: Alles in Kleinbuchstaben – zwischen den Raute-Zeichen und dem Text darf kein Leerzeichen sein.
Trage bei Link-Text beispielsweise “Logout” oder “Abmelden” ein und klicke anschließend wieder auf den Button “Zum Menü hinzufügen”, um den Logout-Link in die Menüstruktur einzugliedern.
2.4 Seite "Mein Konto" hinzufügen
Um die Seite "Mein Konto" als Menüpunkt der Navigation hinzuzufügen, wählst du über die Optionen-Box "Menüpunkte hinzufügen" die Seite" “Mein Konto” aus und fügst diese anschließend per Klick auf den Button “Zum Menü hinzufügen” zum Hauptmenü hinzu.
2.5 Seite "Mein Konto" und Logout-Link als Unterpunkt von "Persönlicher Bereich"
Per Drag&Drop (Anklicken, Ziehen & Loslassen) kannst du beispielsweise die Menüpunkte "Mein Konto" und “Logout” als Unterpunkte von “Persönlicher Bereich” setzen. Dies wird beim Ziehen durch eine gestrichelte Linie sichtbar, die die Position der Seite anzeigt, wenn du diese mit der Maus loslässt. Auch weitere Unterpunkte sind möglich wie zum Beispiel "Mein Profil bearbeiten" als Unterpunkt von "Mein Konto". Dazu musst du die Seite entsprechend erstellen und als Unterpunkt positionieren.
2.6 Seite in der Navigation nur für Besucher anzeigen
Wenn du einrichten möchtest, dass die Seiten "Login", "Persönlicher Bereich", "Logout" oder "Mein Konto" als Menüpunkt in der Navigation ausschließlich Besuchern deiner Spreadmind Plattform angezeigt werden und nicht, wenn man als Admin oder Kursteilnehmer dort eingeloggt ist, kannst du dies über die Optionen der Menüstruktur machen.
Dazu klickst du auf das Dreieck-Symbol am rechten Ende des Eintrags der jeweiligen Seite in der Menüstruktur, um die Menüoptionen aufzuklappen. Wähle nun bei der Option "Display Mode" die Option “Logged Out Users” aus. Über das Feld “Angezeigter Name” kannst du den Namen des Menüpunktes nachträglich umbenennen. Dies hat keine Auswirkung auf die Seite selbst. Um deine Änderungen am Menü zu sichern, klickst du abschließend auf den orangen Button “Menü speichern”.
2.7 Menü speichern
Wenn du alle Änderungen an deiner Menüstruktur abgeschlossen hast, kannst du diese über die orangen Buttons "Menü speichern" rechts oberhalb und unterhalb der Menüstruktur machen.
2.8 Ansicht des Hauptmenüs als nicht eingeloggter Besucher
Ein Besucher sieht im Frontend deiner Spreadmind Plattform den Menüpunkt "Login".
2.9 Ansicht des Hauptmenüs als eingeloggter Benutzer
Nach dem Login verschwindet der Menüpunkt “Login” und das Dropdown-Menü "Persönlicher Bereich" mit seinen Unterpunkten "Mein Konto" und "Logout" erscheint. Dass ein Menüpunkt über Unterpunkte verfügt, siehst du am Pfeil-Symbol rechts neben dem Titel.
Hinweis: Nur du als Admin deiner Spreadmind Plattform siehst auch im Frontend das dunkelgraue Menü im oberen Bereich. Kursteilnehmer und Kunden sehen diesen nicht. Daher ist es wichtig, dass du dem Hauptmenü die Seite “Mein Konto” und einen Logout-Link hinzufügst.
Weitere nützliche Infos zum Thema "Mitgliederbereich erstellen" findest du in unserem Blogartikel.