WooCommerce auf CSS-Tricks

Ich bin immer ganz aufgeregt, wenn ich etwas erreicht habe, aber ich bin besonders aufgeregt, wenn ich etwas erledigt habe und denke: „Na, das war ja einfach.“ So sehr ich es auch genieße, mit Technologie zu basteln, so sehr genieße ich es doch, die Vorteile gut eingerichteter Technologie zu nutzen. Deshalb bin ich immer noch so begeistert von WordPress – ich fühle mich so mächtig, wenn ich große Dinge erreichen kann, ohne viel Zeit und Mühe aufwenden zu müssen.

Genau dieses Gefühl hatte ich letzten Monat, als ich WooCommerce hier auf CSS-Tricks (wieder) eingerichtet habe.

Ich zeige Ihnen, wie ich es eingerichtet habe, denn ich wette, viele von Ihnen könnten dasselbe tun und diesen Aufbau noch besser nutzen als ich!

Mit WooCommerce betriebene Mitgliedschaft

Nehmen wir an, Sie möchten eine Mitgliedschaftsseite haben. Vielleicht haben Sie eine Fitness-Website und erstellen Trainingsvideos und bauen eine kostenpflichtige Mitgliedschaftsschranke für Seiten ein, auf denen diese Videos und Trainingspläne angezeigt werden. Oder vielleicht haben Sie eine Koch-Website, und zahlende Mitglieder haben Zugang zu zusätzlichen Funktionen, wie z. B. gespeicherten Einkaufslisten.

Ein System für zahlende Mitglieder zu haben, ist ein grundlegendes Konzept, um online Geld zu verdienen, und in der Regel keine Kleinigkeit. Glücklicherweise erledigt WooCommerce das schnell. Abgesehen vom (kostenlosen) WooCommerce-Plugin benötigen Sie das ($199) WooCommerce Memberships Plugin.

Wenn Sie nach kostenpflichtigen Plugins für WooCommerce Ausschau halten, können Sie sich den **28. Juli** im Kalender markieren. Das ist der **WooCommerce Day**, und es wird einige große Rabatte geben.

Sobald Sie dies installiert haben, sehen Sie im WooCommerce-Bereich Ihres WordPress-Adminbereichs einen Tab namens **Mitgliedschaften**. Dort gibt es einen Bereich **Mitgliedschaftspläne**, in dem Sie Ihre Pläne einrichten können. Wir haben eine sehr einfache Einrichtung mit einem Plan: **CSS-Tricks Mitglied**.

Sie könnten bei Bedarf eine ganze Reihe von Plänen haben (z. B. Bronze, Silber, Gold).

Diese Pläne tun noch nichts von sich aus; es sind einfach Benutzerrollen, und die Zugriffssteuerungsfunktionen kommen später. Sie könnten diese Pläne so gestalten, dass nur Administratoren Personen hinzufügen können, dass sich jeder kostenlos dafür registrieren kann oder dass der Beitritt den Kauf eines Produkts erfordert. Letzteres ist für eine E-Commerce-Einrichtung nützlich!

Nebenbei bemerkt, möchten Sie wahrscheinlich die Laufzeit der Mitgliedschaft begrenzen. Sie könnten sie unbegrenzt machen, aber es ist wahrscheinlich klüger, mit Mitgliedschaften zu beginnen, die nach einer bestimmten Zeit ablaufen, damit Sie keine lebenslangen Verpflichtungen eingehen.

Da ich Mitgliedschaften verkaufe, habe ich den Mitgliedschaftsplan mit dem Verkauf eines Produkts verknüpft: MVP Supporter.

Der Weg, Zugang zu diesem Mitgliedschaftsplan zu erhalten, ist der Kauf dieses Produkts. Sie werden als Administrator auch immer in der Lage sein, manuell Personen zu Plänen hinzuzufügen.

Dieses Produkt hätte eine einmalige Gebühr sein können, was die Idee einer unbegrenzten Mitgliedschaft unterstützt, aber wie die meisten Mitgliedschaften der Welt wollte ich es als wiederkehrendes Abrechnungsprodukt einrichten. Das bedeutet, wir brauchen eine zusätzliche Einrichtung.

Abonnements für Mitgliedschaften

Ich fand das ein wenig verwirrend. Man könnte annehmen, dass ein Mitgliedschafts-Plugin die Idee der wiederkehrenden Abrechnung für diese Mitgliedschaft unterstützt, aber das tut es nicht von Haus aus. Dafür brauchen wir ein zweites Plugin: WooCommerce Subscriptions.

Das Abonnement-Plugin kostet weitere 199 $, womit diese Einrichtung knapp unter 400 $ liegt. Das sind aber die einmaligen Kosten – Sie müssen die Lizenzen nur im nächsten Jahr erneuern, wenn Sie Support und Updates benötigen (ich würde es tun). Ich finde diesen Preis mehr als fair für ein System, das so effizient funktioniert, aber Sie müssen die geschäftliche Kalkulation selbst vornehmen.

Sobald Sie dieses Plugin installiert haben, hat jedes von Ihnen erstellte Produkt die Möglichkeit, ein Abonnementprodukt zu sein.

Hier bei CSS-Tricks berechnen wir 20 $/Jahr für die Mitgliedschaft. Wenn sich jemand anmeldet, wird ihm im nächsten Jahr erneut 20 $ berechnet. Das entspricht der Dauer des Mitgliedschaftsplans, was ein wichtiger Schritt ist. Nichts zwingt Sie dazu, aber es wäre seltsam, eine Gebühr zu einem anderen Datum als der tatsächlichen Verlängerung zu erheben.

Nur für Mitglieder zugängliche Beiträge

Wir haben die beiden wichtigsten Einrichtungsschritte erledigt.

1. Einen Mitgliedschaftsplan erstellt.
2. Ein Produkt erstellt, das Leute kaufen und das sie für diesen Plan abonnieren.

Nun zum Teil, der den Mitgliedern tatsächlich einen Nutzen bringt! Ich plane, Zugang zu einem "Buch" zu verkaufen, das auf dieser Website gehostet wird. Das Buch ist eigentlich nur eine Sammlung von Beiträgen. Es handelt sich um benutzerdefinierte Beitragstypen, die wir "Kapitel" genannt haben. Im Editor für das Kapitel wird unterhalb des Inhalts ein Bereich für Mitgliedschaften angezeigt, den Sie zum Sperren des Kapitels für einen Mitgliedschaftsplan verwenden können.

Auch hier wird ein benutzerdefinierter Beitragstyp verwendet, aber es könnte jeder beliebige Seiten- oder Beitragstyp sein! Es ist buchstäblich ein Knopfdruck, um etwas hinter die Mitgliedschaftsschranke zu legen.

Es gibt zwei "Seiten" eines Beitrags mit Inhaltsbeschränkung.

1. Was Mitglieder sehen: den Inhalt.
2. Was Nicht-Mitglieder sehen: eine Zusammenfassung und eine Nachricht, wie der Inhalt freigeschaltet werden kann.

Ich finde das ein gutes System. Es zeigt den Leuten genau, was sie lesen könnten, wenn sie Mitglieder wären, und zeigt ihnen genau, wie sie Mitglieder werden können.

Nun, hier gibt es benutzerdefiniertes CSS, aber nicht viel! Ich nutze nur die Standardfunktionen, sehe, was auf der Seite ausgegeben wird, und es gibt immer einen sinnvollen Klassennamen, an den man sich zum Stylen anhängen kann – genau so, wie es sein sollte.

Programmgesteuertes Erledigen von Dingen für Mitglieder

In unserem Fall ist der Hauptvorteil einer Mitgliedschaft wahrscheinlich der Zugang zu dem Buch, aber es muss nicht dabei bleiben. Ich denke, es ist generell eine gute Idee, zahlenden Mitgliedern so viel wie möglich zu bieten. Und da Werbung das primäre Geschäftsmodell dieser Website ist, erscheint es fair, diese Anzeigen zu entfernen, wenn Sie eine kostenpflichtige Unterstützermitgliedschaft haben.

Es gibt alle Arten von APIs für diese Plugins, um sich in das zu haken, was Sie brauchen, aber ich halte die Dinge gerne so einfach wie möglich. Zum Beispiel kann ich in jedem Template prüfen, ob Sie Mitglied sind oder nicht.

<?php if ( !wc_memberships_is_user_active_member() ) { ?>
  <div>
     <!-- Show an ad if you're not a member. -->
  </div>
<?php } ?>

Ich mache das auch, bevor ich irgendein anderes JavaScript der Website ausführe, damit ich im JavaScript wissen kann, ob ein Benutzer Mitglied ist oder nicht.

<?php if ( wc_memberships_is_user_active_member() ) { ?>
    <script>
      window.activeMember = true;
    </script>
<?php } ?>

Einige der Anzeigen auf dieser Website werden über JavaScript gesteuert. Daher kann ich den Aufruf dafür in eine !window.activeMember Logik einwickeln, um sie gar nicht erst anzufordern.

On-Demand-Druck & Fulfillment

Mitgliedschaften und Abonnements sind nur zwei der Dinge, die ich mit WooCommerce mache. Das andere ist der Verkauf physischer Produkte, womit ich im Laufe der Jahre herumgespielt habe. Tatsächlich haben wir früher jede einzelne Bestellung selbst abgewickelt, indem wir Produkte zur Post gebracht haben! Wir haben auch in der Vergangenheit mit Fulfillment-Unternehmen zusammengearbeitet, aber wir mussten trotzdem im Voraus eine Menge Inventar physisch ausdrucken.

Die Dinge haben sich seitdem stark weiterentwickelt und es gibt viele Unternehmen, die auf Abruf drucken! Ein solches Unternehmen (und ich habe keine Verbindung zu ihnen) ist Printify. Sie verkaufen alle Arten von Dingen, einschließlich dessen, was man von einem Druckunternehmen erwartet: T-Shirts, Hoodies, Tassen... und das Beste für mich ist, dass es sich direkt mit WooCommerce verbindet.

Bisher haben wir den Laden mit Postern bestückt! Auf der Printify-Seite wähle ich das Produkt aus, lade die Kunst hoch, wähle einige Optionen, und das war's!

Der letzte Schritt im Prozess ist "Produkt in Ihrem WooCommerce-Shop veröffentlichen", was bisher perfekt für mich funktioniert hat. Ich vertraue darauf, dass es funktioniert, da es die Verbindung zwischen Printify und WooCommerce herstellt, so dass Printify die Bestellung erhält und sie erfüllt, wenn sie eingeht.

Von dort erscheinen die Produkte auf meiner Website und ich kann sie bei Bedarf von WordPress aus bearbeiten oder anpassen (wie den Text usw.).

Ich kann Bestellungen jederzeit einsehen und beobachten, wie sie bestellt, produziert, vorbereitet und versendet werden.

Ich habe natürlich selbst ein paar Poster bestellt, um es auszuprobieren, bevor ich es anderen Leuten zeige. Das Poster kam in einer schönen dreieckigen Röhre in einwandfreiem Zustand auf dickem, strahlend weißem Papier. Ich habe es gleich neben meinem Büroscomputer aufgehängt.

---

Mobile App

Wenn Sie wie ich sind und sich freuen, einen Blick darauf zu werfen, wie sich Ihr kleiner Shop entwickelt und Benachrichtigungen über Verkäufe erhalten, gibt es eine mobile App.

Ich hatte bisher keine Notwendigkeit, Bestellstatus zu aktualisieren oder Bewertungen und Ähnliches zu verwalten, aber das ist auch alles darin enthalten.

---

Hier ist viel Technologie im Einsatz!

Aber mein tatsächlicher Zeitaufwand war minimal. Ich habe länger damit verbracht, diesen Blogbeitrag zu schreiben, als all diese E-Commerce-Sachen einzurichten. Ich bin hier nur ein Integrator. Ich erfinde nichts – ich nutze einfach einige erstklassige Software, um meine Ideen umzusetzen.