Die Aktualisierung deines WooCommerce-Shops ist eine ernste Sache, da du einige Funktionen kaputt machen könntest, die dein Endergebnis oder einfach die Funktionsweise deiner Webseite negativ beeinflussen könnten.
Es gibt vier Denkrichtungen unter den Shopbesitzern, wenn WooCommerce-Updates erscheinen:
- Der Cowboy: Diese Ladenbesitzer drücken ohne zu zögern auf „Aktualisieren“. Dann stürzen ihre Läden um sie herum zusammen.
- Die Couch Potato: Diejenigen, die Updates einfach komplett ignorieren und sie behandeln, als würden sie nicht existieren.
- Der Angsthase: Diese Ladenbesitzer haben so viele veraltete Plugins und Themes, weil sie Angst davor haben, was passiert, wenn sie ein Update versuchen.
- Der Außenseiter: Zu guter Letzt sind das die Ladenbesitzer, die regelmäßig Backups erstellen, neue Versionen von WooCommerce auf einer Staging-Webseite testen und dann ihre Live-Webseite ohne Probleme aktualisieren.
Idealerweise sollte jeder ein Außenseiter sein. Glücklicherweise ist es nicht schwer, einer zu sein! Mit den richtigen Werkzeugen, einer soliden Test-Checkliste und etwas Automatisierung kannst du damit beginnen, deine WooCommerce-Webseite auf dem neuesten Stand zu halten und sicherstellen, dass sie immer reibungslos funktionieren.
In diesem Beitrag zeigen wir dir, wie du ein sicheres WooCommerce-Update von Anfang bis Ende durchführst, welche Tools du verwenden solltest und eine große Test- und Update-Checkliste.
Und vergiss nicht: Dein oberstes Ziel ist es, den Umsatz deines Shops zu steigern. Lade dir deshalb unbedingt unser kostenloses E-Book „10 Wege zur Steigerung der Conversion auf deiner WooCommerce-Produktseite“ herunter.
Bereit zu starten? Dann lass es uns tun!
Investiere jetzt ein wenig Zeit, um später viel Zeit (und Angst) zu sparen
Bevor wir loslegen, sagen uns die Best Practices, dass du deine Webseite, insbesondere WooCommerce, niemals aktualisieren solltest, ohne vorher alle Neuerscheinungen gründlich zu testen. Das gilt für Major-, Minor- und Patch-Releases – es spielt keine Rolle.
Du musst bereit sein, jetzt ein wenig Zeit zu investieren, um später eine Menge Zeit zu sparen.
Du musst nicht gleich den ‚Update‘-Knopf drücken. Gib dir etwas Zeit und vergewissere dich, dass du verstehst, welche Änderungen vorgenommen werden und, was am wichtigsten ist, wie sie sich auf alles andere auf deiner Webseite auswirken könnten. Informiere dich einfach über die neuen Funktionen, die in der Version von WooCommerce verfügbar sind, die du aktualisieren möchtest, damit du weißt, worauf du dich vorbereiten musst.
Um die Dinge ins rechte Licht zu rücken und zu verstehen, wie leicht die Dinge kaputt gehen könnten, denk mal für eine Sekunde aus der Sicht eines Plugin- oder Theme-Entwicklers: da der WooCommerce-Core, wie auch der WordPress-Core, rückwärtskompatibel sein müssen. Denke jetzt an die Anzahl der Plugins, die du – oder deine Kunden-Webseite – benutzt. Wie wahrscheinlich ist es, dass ein WooCommerce-Update einige Funktionen kaputt macht? Nun, ich schätze, du kennst die Antwort bereits: extrem wahrscheinlich.
Deshalb ist es immer gut, direkt nach der Ankündigung eines WooCommerce-Updates die Changelogs und das WordPress.org-Supportforum zu überprüfen, bevor du WooCommerce aktualisierst. Wenn es jemals ein Problem mit einem Update gab, ist in 99 % der Fälle jemand anderes zuerst auf das Problem gestoßen, was dir eine Menge Zeit und Ärger erspart, wenn du dich selbst um das Problem kümmern musst.
Es ist auch nicht ungewöhnlich, das WooCommerce-Update nicht sofort auf deine Webseite zu schieben und darauf zu warten, dass Plugin-/Theme-Autoren ihre eigenen Updates für WooCommerce-bezogene Produkte veröffentlichen, bevor du auch deine Webseite aktualisieren kannst. Es kann sich also wirklich auszahlen, geduldig zu sein und sich die Zeit zu nehmen, die Kompatibilität zu prüfen.
Erste Schritte mit deinem WooCommerce-Update
Es gibt vier wesentliche Stufen, wenn man sich den WooCommerce-Updates nähert, jede mit ihren eigenen Schritten. Wir versprechen dir, dass nachdem du alles einmal durchgespielt hast, es jedes Mal schneller und einfacher wird! Wir werden dich durch jede der folgenden vier Stufen der WooCommerce-Aktualisierung führen:
Aktualisierung von WooCommerce: Die richtigen Werkzeuge holen.
Seien wir ehrlich: das manuelle Testen von WooCommerce ist mühsam und zeitaufwändig. Aus diesen Gründen tun es so viele Leute einfach nicht oder, wenn sie es doch tun, testen sie nicht richtig und übersehen Fehler auf ihren Webseiten.
Glücklicherweise gibt es Tools, die den Testprozess beschleunigen können und ihn weniger langweilig machen. Nachdem wir im Laufe der Jahre unzählige Male WooCommerce-Updates getestet haben, sind dies die Tools, die wir empfehlen. Schauen wir uns jedes einzelne genauer an.
Staging Webseite
Das ist nicht verhandelbar. Du solltest deine aktive Seite nie unmittelbar nach einer neuen Version von WooCommerce aktualisieren.
Staging Seiten bieten dir eine sichere Testumgebung, in der du nichts kaputt machen darfst (normalerweise ohne Konsequenzen). Dort kannst du WooCommerce-Updates durchführen, neue Versionen testen und sehen, wie deine Seite reagieren könnte, bevor du sie aktualisierst.
Wenn du keine Staging Seite hast, kann Kinsta dir helfen – wir bieten eine kostenlose Staging Seite für jede Seite und bis zu fünf zusätzliche Premium Staging Seiten, wenn eine nicht ausreicht.
Visuelle Vergleichs-Tools
Woher weißt du, ob sich deine Webseite nach einem WooCommerce-Update geändert hat? Wenn du eine große Webseite mit Dutzenden von Seiten betreibst, kann es einige Zeit dauern, kleine Änderungen in der Formatierung oder sogar Widgets aufzuspüren, die nicht mehr angezeigt werden.
Mit einem visuellen Vergleichstool wie WP Boom, das wir für dieses Tutorial verwenden werden, kannst du einen Schnappschuss deiner Webseite machen, auf „Aktualisieren“ klicken und dann einen zweiten Schnappschuss machen, damit du schnell sehen kannst, was sich geändert hat:
Es ist wichtig, darauf hinzuweisen, dass eine visuelle Änderung nicht unbedingt bedeutet, dass irgendein Stück Funktionalität auf deiner Webseite kaputt ist, sondern nur, dass es kaputt sein könnte.
Ende-zu-Ende-Test-Tools
Während visuelle Vergleichswerkzeuge dir helfen können, Änderungen in der Formatierung und im Design deiner Webseite schnell zu erkennen, gehen die Ende-zu-Ende-Testtools noch weiter. Sie testen die tatsächliche Funktionalität deiner Webseite und bieten dir mehr Sicherheit, wenn etwas nicht funktioniert.
Wenn du dich auf deiner Webseite umschaust, um Tests durchzuführen, wie z.B. das Hinzufügen eines Artikels in den Warenkorb und das Auschecken, braucht es Zeit. Diese Aufgaben werden ziemlich schnell langweilig, wenn du WooCommerce-Updates schon hundertmal getestet hast.
Mit Ende-zu-Ende-Test-Tools kannst du diesen Prozess automatisieren, so dass er automatisch für dich erledigt wird.
Da Robot Ninja nun außer Betrieb ist, werden wir dir in diesem Tutorial zeigen, wie du zwei verschiedene Tools verwenden kannst.
Das erste ist der Ghost Inspector:
Das zweite Ende-zu-Ende-Test-Tool, das du ausprobieren kannst, ist Usetrace:
Dies ist ein weiteres automatisiertes Ende-zu-Ende-Test-Tool für WooCommerce, das du sowohl auf Staging-Webseiten als auch auf Live-Webseiten verwenden kannst. Wir gehen später in diesem Artikel darauf ein, wie man beides einrichtet. WooCommerce hat auch einige E2E-Tests, die du durchlaufen kannst, wenn du eher ein Entwickler bist.
Backup-Tools
Du solltest regelmäßige Backups deiner Webseite machen. Wenn du an Datenbank-Backups interessiert bist, empfehlen wir WP Migrate DB Pro, oder einfach WP-CLI, um schnelle Exporte durchzuführen.
Wenn du mit Kinsta zusammenarbeitest, bieten wir dir automatische tägliche Backups, manuelle Backup-Punkte und Backup-Speicherung für alle unsere Pläne:
Sobald du die richtigen Werkzeuge an Ort und Stelle hast, ist es an der Zeit, einige Vorbereitungen zu treffen.
Aktualisierung von WooCommerce: Vorbereitung (Eine 7-Schritte-Checkliste)
Wenn du willst, dass dein WooCommerce-Update reibungslos läuft, musst du dich vorbereiten. Es ist ein wenig Arbeit nötig, aber nachdem du dich einmal vorbereitet hast, ist es einfacher, die Lücken auszufüllen und es beim nächsten Update schneller zu erledigen. Unten sind die sieben Vorbereitungsschritte aufgeführt, die wir empfehlen.
Schritt 1: Mach dich mit der Webseite, die du aktualisierst, wieder vertraut.
Wenn du dir nicht sicher bist, wie deine Webseite funktionieren soll (z.B. wenn es sich um die Webseite eines neuen Kunden handelt), mach dir ein paar Notizen. Das wird dir helfen, die Angst zu nehmen, die du vielleicht empfindest, wenn du nach einem Update verwirrt darüber bist, wie die Webseite funktioniert (das passiert öfter als du vielleicht erwartest).
Ich empfehle auch, eine Liste der kritischen URLs und der Funktionalität deiner Webseite (und der Kunden) zu erstellen. Dazu sollten auch wichtige Seiten auf deiner Webseite gehören, z. B. deine Startseite, deine Kategorie und dein Produkt, ‚Mein Konto‘, dein Warenkorb und die Checkout-Seiten.
Schritt 2: Überprüfe, ob deine Backups aktuell sind
Wenn deine Backups nicht aktuell sind, ist es jetzt an der Zeit, ein weiteres Backup zu machen. Mache dich wieder mit deinem Backup-Tool vertraut. Am wichtigsten ist es, zu überprüfen, ob es richtig funktioniert, und sicherzustellen, dass du weißt, wie du zu einem früheren Schnappschuss deiner Webseite zurückkehren kannst.
Schritt 3: WP Boom einrichten
Es dauert nur eine Minute, um dieses Tool einzurichten. Wenn dein Gedächtnis und deine Notizen nicht toll sind (wir können alle Fehler machen), kann WP Boom helfen, die Lücken mit Screenshots deiner Webseite zu füllen. Stell sie dir vor wie die ‚Vorher‘-Fotos bei Gewichtsverlust-Aktionen.
Du solltest damit beginnen, deinen ersten Schnappschuss von deiner Webseite zu machen, damit du eine visuelle Basisaufnahme deiner Staging-Webseite vor dem Update hast.
Normalerweise wird es nicht möglich sein, Screenshots von der Kasse (du musst einige Produkte in deinem Warenkorb haben) und geschützten Seiten zu machen, aber hier kann eines der nächsten Tools helfen.
Hinweis: Wir werden euch später in diesem Beitrag erklären, wie ihr WP Boom einrichtet und benutzt.
Schritt 4: Richte dein automatisiertes Testwerkzeug ein
Wenn du WooCommerce manuell testen würdest, würdest du in diesem Teil eine Liste mit Testszenarien erstellen: z.B. deine Webseite öffnen, ein Produkt in den Warenkorb legen, zur Kasse gehen, Zahlungsinformationen eingeben, usw.
Glücklicherweise können sowohl Ghost Inspector als auch Usetrace all dies automatisch für dich erledigen. Wir werden euch gleich erklären, wie ihr diese beiden Tools einrichten könnt.
Schritt 5: Identifiziere alle anderen Teile deiner Webseite, die du testen möchtest
Der nächste Schritt besteht darin, alle anderen Teile deiner Webseite zu identifizieren, die du testen möchtest, basierend auf der Liste der kritischen URLs und Funktionen, die du zuvor erstellt hast. Das können Funktionen wie Kontaktformulare und Pop-ups sein, oder Elemente wie Slideshows und Galerien.
Du kannst diese Dinge manuell testen, oder wenn du technisch versierter bist, kannst du auch versuchen, diesen Schritt zu automatisieren.
Schritt 6: Schau dir an, was es Neues in der WooCommerce-Version gibt, auf die du aktualisierst
Es ist auch eine gute Idee zu sehen, welche neuen Updates und Features in der Version von WooCommerce, auf die du aktualisierst, verfügbar sind. Insbesondere solltest du prüfen, ob deine Plugins und dein Theme damit kompatibel sind.
Auch hier ist es besser, sich jetzt etwas Zeit zu nehmen, um sich später etwas Zeit und Ärger zu ersparen. Wir empfehlen dir, die Ankündigungen für neue Versionen auf WooCommerce.com, Änderungsprotokolle, GitHub-Probleme und die WordPress-Supportforen zu überprüfen.
Schritt 7: Klone deine Live-Webseite in deine Staging-Umgebung
Wenn du Plugins verwendest, die einen Staging-Modus haben, wie zum Beispiel WooCommerce-Abonnements, schalte sie ein oder deaktiviere sie einfach. Ebenso wirst du E-Mails deaktivieren wollen.
Vergewissere dich dann, dass deine Staging-Umgebung deine Live-Webseite so gut wie möglich imitiert. Wir empfehlen außerdem, an dieser Stelle den WordPress-Debug-Modus zu aktivieren, um bei der späteren Problemlösung zu helfen.
Wichtig: Nachdem du deine Webseite ins Staging gebracht hast, solltest du keine Aufträge verlieren, die durchkommen könnten. Um dies zu vermeiden, empfehlen wir dir, deinen WooCommerce-Shop in den Wartungsmodus zu versetzen. Dadurch wird sichergestellt, dass keine Bestellungen aufgegeben werden, während du Updates und Tests durchführst.
Aktualisierung von WooCommerce: Aktualisieren und Testen deiner Webseite (Eine 7-Schritte-Checkliste)
Jetzt, wo ihr vorbereitet und startklar seid, kommt der lustige Teil: die Aktualisierung eurer Staging Webseite. Das Tolle an Staging-Websites ist, dass es keine Rolle spielt, wenn deine Webseite kaputt geht, denn es ist nur eine Kopie. Werfen wir einen Blick auf die Schritte in diesem Teil des Prozesses.
Schritt 1: Mach einen Schnappschuss deiner Webseite mit WP Boom
Das erste, was du tun solltest, ist einen Schnappschuss deiner Webseite mit WP Boom zu machen. Dadurch erhältst du eine visuelle Basisaufnahme deiner Staging Webseite, vor dem Update.
Schritt 2: Starte dein Test-Tool und stelle sicher, dass deine Tests bestanden werden.
Wie wir bereits erwähnt haben, kannst du ein Ende-zu-Ende-Test-Tool wie Ghost Inspector oder Usetrace verwenden, um deine Tests zu automatisieren. Weiter unten in diesem Artikel werden wir euch erklären, wie ihr einen Test mit beiden Tools durchführen könnt, und überprüfen, ob die Tests erfolgreich sind.
Schritt 3: Aktualisiert eure Plugins und Themes
In der Vorbereitungsphase haben wir erwähnt, dass wir prüfen wollten, ob deine Plugins und dein Theme mit der neuesten Version von WooCommerce, auf die du aktualisierst, kompatibel sind. Wenn du bemerkt hast, dass deine Plugins oder Themes veraltet und nicht mehr mit der neuesten Version von WooCommerce kompatibel sind, ist es jetzt an der Zeit, sie auf eine Version zu aktualisieren, die kompatibel ist.
Schritt 4: Aktualisiere WooCommerce auf deiner Staging Webseite
Sobald ihr eure Plugins und Themes aktualisiert habt und sichergestellt ist, dass es keine Kompatibilitätsprobleme gibt, könnt ihr eure Staging Webseite auf die neueste Version von WooCommerce aktualisieren. Die Aktualisierung deiner Staging-Website ermöglicht es dir, mögliche Fehler zu erkennen und zu beheben, bevor du die WooCommerce-Aktualisierung auf deiner Live-Webseite durchführst.
Schritt 5: Überprüfe deine Logs auf Fehler
Nachdem ihr eure Plugins, Themes und WooCommerce aktualisiert habt, ist es klug, eure Logs zu überprüfen, um nach Fehlern zu suchen, die durch diese Updates entstehen. Mach einen Quick-Scan, um sicherzustellen, dass du immer noch Zugang zu deiner Homepage und deinem Adminbereich hast.
Wenn du einen White Screen of Death bekommst oder in einer anderen nicht wiederherstellbaren Situation steckst, ist jetzt ein guter Zeitpunkt, zu einem früheren Schnappschuss deiner Webseite zurückzukehren. Du kannst entweder selbst eine Lösung für dein Problem finden oder Hilfe suchen.
Schritt 6: Mach einen zweiten Schnappschuss, um die Änderungen zu vergleichen
Wenn bis jetzt alles gut läuft, lasse WP Boom noch einmal laufen und erhalte einen zweiten Schnappschuss. Vergleiche deine Vorher- und Nachher-Schnappschüsse, um zu sehen, was sich geändert hat.
Das Tolle an WP Boom ist, dass es dir zeigt, wie sehr sich deine Webseite seit deinem letzten Schnappschuss verändert hat.
Zum Beispiel könnte es eine visuelle Veränderung von 7% zwischen deinen beiden Schnappschüssen geben. Das bedeutet zwar nicht unbedingt, dass deine Webseite kaputt ist, aber es könnte bedeuten, dass du einige Stile anpassen musst.
Schritt 7: Ghost Inspector oder Usetrace erneut ausführen, um sicherzustellen, dass alles richtig funktioniert
Als nächstes machst du einen weiteren Test mit Ghost Inspector oder Usetrace (oder welches Ende-zu-Ende-Testtool du auch immer gewählt hast), um sicherzustellen, dass dein Checkout-Flow in einem einwandfreien Zustand ist. Du kannst auch manuelle oder automatische Checks für alle anderen Funktionen auf deiner Webseite durchführen, wie zum Beispiel die Kontaktformulare.
Wenn irgendetwas nicht so funktioniert, wie du es erwartest, ist es jetzt an der Zeit, dies zu melden und/oder zu beheben.
Wenn du benutzerdefinierten Code auf deiner Webseite laufen hast (d.h. Code, der nicht von einem Plugin-/Erweiterungsentwickler eines Drittanbieters gewartet wird), musst du ihn reparieren und sicherstellen, dass die Korrekturen vor oder nach dem Update (je nach Problem) auf deine Live-Webseite angewendet werden.
Versionskontrolle, wie zum Beispiel deine Webseite in Git zu haben, kann dir helfen, Änderungen besser zu verwalten. Wo du Fehler meldest, hängt davon ab, welche Plugins du verwendest und wie dein Support aussieht. Von hier aus müsst ihr entweder auf neue Versionen eurer Plugins / Themes warten und dann den Prozess erneut versuchen, oder selbst an den Korrekturen arbeiten und euren Code aktualisieren.
Die gute Nachricht ist, dass deine Live-Webseite nicht kaputt ist, deine Kunden können weiterhin Einkäufe tätigen. Außerdem kannst du dir die Zeit nehmen, den Prozess so lange zu wiederholen, bis du dich wohl fühlst und alles wie erwartet funktioniert.
Aktualisierung von WooCommerce: Aktualisieren und Testen deiner Live Webseite (Eine 8-Schritte Checkliste)
Sobald du deine Staging Webseite aktualisiert hast und sie reibungslos funktioniert, alle kaputten Funktionen behoben und alle Bugs ausgebügelt sind, kannst du deine Live Webseite aktualisieren.
Lass uns einen Blick auf die Schritte werfen, die mit der Aktualisierung deiner Live-WooCommerce-Webseite verbunden sind. Viele dieser Schritte werden denen ähnlich sein, die du während der Tests deiner Staging-Webseite durchgeführt hast.
Schritt 1: Sichere deine Live-Webseite
Der erste Schritt ist die Sicherung deiner Live-Webseite. Es ist wichtig, sicherzustellen, dass du diesen Schritt nicht verpasst. Wenn du ein Kinsta-Benutzer bist, hast du eine Vielzahl von Backup-Optionen zur Auswahl. Du kannst aber auch ein Backup-Plugin verwenden.
Schritt 2: Mach noch einen Schnappschuss von deiner Webseite
Als Nächstes möchtest du noch einen Schnappschuss deiner Webseite mit WP Boom machen. Dies bietet dir eine visuelle Basisaufnahme deiner Webseite vor dem Update.
Schritt 3: Lass Ghost Inspector oder Usetrace laufen und stelle sicher, dass deine Tests bestanden werden.
Auch hier könnt ihr entweder Ghost Inspector oder Usetrace verwenden, je nachdem, ob ihr eine Chrome-Erweiterung oder ein Online-Tool zur Aufzeichnung eurer Tests verwenden wollt. Dies bietet dir eine weitere Grundlinie für deine Webseite vor dem Update.
Schritt 4: Synchronisiere und schiebe deine Änderungen live
Als nächstes, abhängig davon, wie eure Staging- und Live-Umgebungen funktionieren, müsst ihr vielleicht einfach nur die Änderungen zwischen der Staging- und der Live-Webseite synchronisieren. Alternativ dazu müsst ihr möglicherweise eure Plugins und euren Code erneut aktualisieren.
Wenn du bei Kinsta bist, kannst du Änderungen mit einem Klick live übertragen:
Vergiss nicht, deinen WooCommerce-Shop zuerst aus dem Wartungsmodus zu nehmen.
Schritt 5: Überprüfe deine Logs auf Fehler
Wenn du mit dem Synchronisieren des Updates fertig bist, überprüfe deine Fehlerprotokolle noch einmal auf Probleme, die dadurch entstanden sein könnten. Vergewissere dich, dass du immer noch Zugriff auf die Startseite und den Adminbereich hast.
Wie bei der Staging-Webseite, wenn du einen White Screen of Death bekommst oder auf eine andere nicht behebbare Situation stößt, ist es am besten, zu einem früheren Schnappschuss deiner Webseite zurückzukehren und einige Fehler zu beheben oder Hilfe zu suchen.
Schritt 6: Mach einen weiteren Schnappschuss mit WP Boom
Als nächstes lässt du WP Boom noch einmal laufen, damit du einen zweiten Satz Schnappschüsse hast. Vergleiche deine Vorher- und Nachher-Schnappschüsse, um zu sehen, ob sich etwas geändert hat.
Schritt 7: Lasse Ghost Inspector oder Usetrace erneut laufen, um zu bestätigen, dass die Webseite richtig funktioniert.
Noch einmal: Du kannst dein automatisiertes Tool benutzen, um einen weiteren Test durchzuführen und sicherzustellen, dass alles so funktioniert, wie es sollte. An dieser Stelle kannst du auch alle anderen manuellen (oder automatisierten) Überprüfungen für andere Funktionen auf deiner Webseite durchführen, wie zum Beispiel Kontaktformulare.
Wenn du beim Aktualisieren deiner Staging-Webseite bereits früher Probleme behandelt und behoben hast, z. B. widersprüchliche Plugin-Codes und deinen eigenen benutzerdefinierten Code, sollten in diesem Stadium nicht allzu viele Probleme (wenn überhaupt) zu beheben sein.
Schritt 8: Abschließender visueller Check
Du bist fast fertig. Das Einzige, was noch zu tun bleibt, ist, deine Liste der kritischen URLs und Funktionen zu überprüfen, um sicherzustellen, dass alles funktioniert.
Wenn alles gut aussieht, war’s das! Dein WooCommerce-Update ist jetzt live.
Erste Schritte mit WP Boom
WP Boom ist ein visuelles Test- und Vergleichstool, das für WordPress entwickelt wurde. Sobald es eingerichtet ist, kannst du Screenshots vor und nach der Aktualisierung deiner Webseite vergleichen und erhältst Benachrichtigungen, wenn Auto-Updates visuelle Änderungen an deinen Webseiten verursachen:
Um mit WP Boom anzufangen, melde dich für einen kostenlosen Account an. Nachdem du deine E-Mail und dein Passwort eingegeben hast, erscheint ein Modal, das dich auffordert, eine neue Webseite zu verbinden:
Sobald du die Details eingegeben und auf Seite erstellen geklickt hast, macht sich WP Boom an die Arbeit und macht den ersten Schnappschuss deiner Webseite. Dies wird ein oder zwei Minuten dauern, je nachdem, wie viele Seiten deine Webseite enthält:
Wenn dieser Vorgang abgeschlossen ist, wird die Seite aktualisiert. Wenn du auf den Namen deiner Webseite klickst, siehst du eine Übersicht über deinen Schnappschuss, einschließlich der Zeit, zu der er aufgenommen wurde und wie viele Seiten auf deiner Webseite waren:
Wenn du bereit bist, einen zweiten Schnappschuss zu machen, kehre einfach zum WP Boom-Dashboard zurück, wähle die Webseite aus, die du fotografieren möchtest, und klicke auf „Snapshot Selected Sites„.
Ein paar andere nette Features, die WP Boom beinhaltet, sind die Möglichkeit, wöchentliche Schnappschüsse zu planen und Berichte per E-Mail zu versenden, die alle visuellen Änderungen auf deiner Webseite detailliert aufführen. Dies ist nützlich, wenn du eine Unmenge von Webseiten verwaltest und automatische Aktualisierungen hast.
Automatisierte Test-Tools: Ghost Inspector und Usetrace
Es ist wichtig zu testen und sicherzustellen, dass die Funktionalität auf deiner gesamten WooCommerce Webseite richtig funktioniert, nachdem du Aktualisierungen vorgenommen hast, nicht nur dein Kassiervorgang.
Denn wenn ein Kunde ein Kontaktformular ausfüllt oder versucht, den Live-Chat zu nutzen, und diese Funktionen nicht funktionieren, woher willst du wissen, ob du sie nicht getestet hast?
Es ist einfach, manuelle Tests durchzuführen: Klicke dich einfach durch deine Webseite, fülle Formulare aus und benutze dein Live-Chat-Fenster.
Um diesen Prozess zu automatisieren, kannst du zunächst eine Liste der kritischen Funktionen sowie Anweisungen für die manuelle Durchführung der Tests zusammenstellen (z. B. „Webseite öffnen, zur Kontaktseite navigieren, Formular ausfüllen usw.“). Auf diese Weise wird sichergestellt, dass du nichts verpasst, wenn du einen manuellen Test durchführst.
Wenn du es vorziehst, diesen Prozess zu automatisieren, mehr Kontrolle über deine automatisierten Tests haben möchtest oder eine sehr individuelle Webseite oder Funktionalität hast, empfehlen wir dir, dir Ghost Inspector und/oder UseTrace anzusehen.
Beide sind großartige Optionen, wenn du dich mit PHP nicht auskennst und nicht mit Skripten und programmiertem Code herumspielen möchtest. Diese Optionen bieten ähnliche Funktionen, um deine Checkout-Tests zu automatisieren.
Letztendlich hängt die Wahl der Option davon ab, ob du eine Chrome-Erweiterung oder ein Online-Tool zum Aufzeichnen deiner Tests verwenden möchtest. Alternativ, wenn du Entwickler bist und dir gerne die Hände schmutzig machst, ist Codeception eine gute Wahl für Entwickler.
Erste Schritte mit Ghost Inspector
Ghost Inspector ist ein Tool, mit dem du deine WooCommerce-Webseite automatisiert testen und sicherstellen kannst, dass sie richtig funktioniert. Das Beste daran ist, dass du keine Programmier- oder Testerfahrung brauchst, um es zu benutzen.
Ghost Inspector funktioniert, indem du eine Chrome- oder Firefox-Erweiterung zu deinem Browser hinzufügst. Dann zeichnet die Erweiterung deine Seite auf und führt die Tests automatisch durch.
Um anzufangen, besuche die Webseite von Ghost Inspector und klicke auf Start Your Free Trial. Gib deine Daten in das Formular ein und wähle dann Account erstellen:
Dadurch wirst du auf eine Willkommensseite umgeleitet. Klicke unten auf die Schaltfläche Test Recorder installieren:
Dadurch wird der Chrome-Webshop in einem neuen Browser-Tab geöffnet. Wähle Zu Chrome hinzufügen:
Die Ghost Inspector-Erweiterung wird automatisch zu deinem Browser hinzugefügt und erscheint oben rechts in der Ecke. Wenn ihr das erste Mal darauf klickt, werdet ihr aufgefordert, euch mit euren Zugangsdaten anzumelden:
Aktualisiere deinen Browser. Wenn du bereit bist, einen Test durchzuführen, besuche deine WooCommerce Webseite (vergewissere dich, dass du ausgeloggt bist) und klicke dann auf die Browsererweiterung.
Wähle im Dropdown-Menü die Option „Neuen Test erstellen“, gefolgt von der Schaltfläche „Aufzeichnung starten„:
Wenn ihr eure Webseite durchlauft und testet, wird der Ghost Inspector alle eure Aktionen aufzeichnen. Wenn du fertig bist, klicke wieder auf die Erweiterung, gefolgt von Ich bin mit der Aufzeichnung fertig:
Dann kannst du deinen Test benennen und speichern. Wenn du Meinen Test ansehen auswählst, bringt dich das zum Ghost Inspector-Dashboard:
Hier kannst du alle Details des Tests ansehen. Du siehst eine Liste der beteiligten Schritte und hast die Möglichkeit, diese zu bearbeiten. So erfährst du, ob der Test bestanden wurde, und wenn nicht, welche Schritte deine Aufmerksamkeit erfordern. Ausführlichere Informationen findest du in der Dokumentation von Ghost Inspector.
Erste Schritte mit Usetrace
Wenn du ein automatisiertes Test-Tool benutzen möchtest, das nicht spezifisch für einen bestimmten Browser ist, solltest du dich für Usetrace entscheiden. Mit diesem Tool erstellst du ‚Spuren‘, indem du deine Arbeitsabläufe durch den Usetrace-Online-Editor aufzeichnest. Dann kannst du sie benutzen, um deine Webseite automatisch zu testen.
Um anzufangen, besuche die Usetrace Webseite und klicke auf Anmelden und beginne jetzt mit dem Testen. Nachdem du einen Account erstellt hast, wirst du zum Usetrace Dashboard weitergeleitet. Wähle Start by creating a new trace:
Im Fenster links sind deine Schritte und Einstellungen zu sehen. Auf der rechten Seite ist die Webseite, die du testest. Um zu beginnen, klicke auf Schritte aufzeichnen:
Das Programm beginnt damit, die Interaktionen deiner Webseite aufzuzeichnen. Jedes Mal, wenn du eine Aktion durchführst, wie z.B. das Hinzufügen eines Artikels in deinen Warenkorb oder das Ausfüllen eines Kontaktformulars, wird es einen Kontrollpunkt zu den Trace Steps auf der linken Seite hinzufügen.
Wenn du fertig bist, klicke auf die Schaltfläche Save Steps:
Um durch den gesamten Trace zu laufen, um zu bestätigen, dass alles funktioniert, wähle Run Trace in der linken unteren Ecke:
Nachdem das abgeschlossen ist, solltest du eine Erfolgsnachricht sehen:
Du kannst auf Details klicken, um mehr über jeden Schritt zu erfahren, oder OK wählen, wenn du fertig bist. Für detailliertere Anleitungen und Instruktionen kannst du in der Usetrace-Dokumentation nachschlagen.
Zusammenfassung
Mit den richtigen Tools, etwas Vorbereitungszeit und einer soliden Checkliste solltest du keine Probleme haben, WooCommerce-Updates zu testen und zu implementieren. Um die Ängste vor der Aktualisierung von WooCommerce zu beseitigen, ist es wichtig, den Prozess zu entmystifizieren, was wir hier getan haben. Wir hoffen, dass diese Anleitung dir eine solide Grundlage bietet, um deine WooCommerce Webseite auf dem neuesten Stand zu halten.
Wir sollten auch betonen, dass es wichtig ist, auch die Transaktions-E-Mails deines Shops zu testen, aber das ist ein ganz anderer Weg.
Nun, zurück zu dir: Benutzt du Visualisierungs- oder Screenshot-Tools, wenn du WooCommerce und WordPress aktualisierst? Welche anderen Tools und Workflows benutzt du für Updates? Teile sie mit uns in den Kommentaren unten!
Schreibe einen Kommentar