Plötzlich können Tabellen und Punkte nicht mehr entfernt werden

[MrSDC]

Liebe Community,

ich kann Plötzlich in der Produktbeschreibung keine Tabellen und Punkte (aus Aufzählungsliste) mehr entfernen.

Das erstellen von tabellen ist auch nicht mehr möglich. Die Tabelle ist zwar in der Produktbeschreibung zu sehen, wird aber im Shop nicht angezeigt. 

Ich habe irgendwo mit dem Kürzel <br> gespielt, um Sätze untereinander zu platzieren.

Wo steckt der Fehler? Was könnte das Problem sein?

Vielen Dank und Grüße in die Runde

MrSDC

[Gabe]

Hey @MrSDC 

Um dir dabei behilflich zu sein, wird unser Team das 👀 müssen. Hast du bereits ein Ticket bei unserem Support-Team geöffnet? 

Falls nicht, sende bitte eine E-Mail an unseren Support wie hier demonstriert von der E-Mail-Adresse, die du zur Anmeldung in deinem Shopify-Shop verwendest, und gib deine myshopify.com-URL da auch ein. Sobald die dein Konto authentifiziert haben, können sie dir weiterhelfen.

[MrSDC]

Hallo,

nein, das Problem ist immer noch da.

Ich benötige Hilfe von einem Programmierer, denke ich.

Wie beschrieben:

Ich kann in der Beschreibung Tabellen einfügen, die aber im Shop nicht angezeigt werden.

Mit der Backspace Taste kann ich in der Produktbeschreibung die Tabellen nicht mehr löschen/ entfernen oder bearbeiten.

LG MrSDC

[Gabe]

Hey @MrSDC 

Verstehe. Vielleicht kann ich hier ein paar Tipps dazu abgeben aber letztendlich wird das einen tieferen 👁️ in deinen Admin verlangen. 

Wenn du den HTML Code des RTEs (rich text editor) dieses eines Produktes hier postest kann ich mal einen Blick in den Code hineinwerfen.Ein häufiges Problem bei der Verwendung von WYSIWYG-Editoren (What You See Is What You Get) wie der RTE in Shopify sind Konflikte zwischen visueller Darstellung und HTML-Tags.

Aber da du das <br> Tag verwendet hast, um den Satzaufbau zu ändern, könnte dies das Layout beeinflusst haben. Entfernen mal vor dem Hinzufügen neuer Inhalte oder Änderungen die bestehende Formatierung im HTML Code, indem du den Text markierst und "Formatierung entfernen" auswählst oder spezifische HTML-Tags entfernst. Stelle auch sicher, dass keine widersprüchlichen HTML-Tags wie <br> oder andere Layout-Tags vorhanden sind, die die Tabellen anders rendern oder das Bearbeiten verhindern könnten.

Hier ein paar weitere Tipps dazu:

1. Überprüfung des HTML-Codes: Da die Verwendung von HTML-Tags wie <br> und <address> die Anzeige und Funktionalität der Produktbeschreibungen beeinflussen kann, den HTML-Code mal sorgfältig überprüfen. Sicherstellen, dass Tags korrekt eingefügt und nicht ineinander verschachtelt sind, ist wichtig, um Formatierungsprobleme zu vermeiden.

2. Kopieren im Textformat: Um Fehler aus dem HTML-Code zu entfernen, kannst du die Produktbeschreibung im Textformat (statt HTML) zu kopieren und wieder einzufügen. Dadurch kann die Formatierung in einem einheitlichen Stil gehalten und Fehler minimiert werden.

3. Zurücksetzen von Änderungen: Falls in den .liquid-Dateien des Themes Veränderungen vorgenommen wurden, die das Problem verursachen könnten, kann man diese auf die vorherige Version zurücksetzen. Dies kann helfen, das ursprüngliche Layout und die Funktionsweise der Produktbeschreibungen wiederherzustellen.

4. Externe HTML-Prüfung: Eine zusätzliche Option ist die Verwendung eines HTML-Strippers wie "StripHTML", um die Produktbeschreibung von unerwünschten HTML-Elementen zu befreien, bevor sie in Shopify eingefügt wird. Dies kann die potenzielle Konflikte zwischen HTML-Tags und dem Shop-Design minimieren.

5. Page-Builder-Apps: Um die Produktbeschreibungen in Shopify zu bearbeiten, ohne sich mit HTML auseinandersetzen zu müssen, können Page-Builder-Apps wie Shogun, PageFly oder Page Studio verwendet werden. Diese Apps bieten eine Drag-and-Drop-Oberfläche und ermöglichen eine reibungslose Erstellung und Bearbeitung der Produktseiten.

Unsere Page Builder Apps können somit das einfach viel besser als der eingebaute RTE

Es gibt verschiedene Apps und Plugins, die eine fortschrittlichere Textbearbeitung für Shopify ermöglichen und als Alternativen zum eingebauten Rich Text Editor (RTE) dienen und können dir helfen eine richt professionell-aussehende PDP zu erstellen die Wow-Faktor haben.

Hier sind einige der gängigsten Optionen:

1. Shogun: Shogun ist eine beliebte Page-Builder-App, die eine Drag-and-Drop-Oberfläche bietet, um Inhalte auf Shopify-Seiten zu erstellen und zu bearbeiten. Sie unterstützt umfangreiche Layoutoptionen, Tabellen, Formulare, und vieles mehr. Damit kann man nicht nur Produktbeschreibungen, sondern auch gesamte Seiten bearbeiten.

2. GemPages: Ähnlich wie Shogun bietet GemPages eine intuitive Drag-and-Drop-Oberfläche und zahlreiche vorgefertigte Elemente, darunter Tabellen, Aufzählungspunkte und vieles mehr. Die App lässt sich nahtlos in Shopify integrieren und ermöglicht die Erstellung ansprechender Produktseiten.

3. PageFly: PageFly ist ein weiterer Page-Builder für Shopify, der vielfältige Bearbeitungsfunktionen bietet. Damit lassen sich komplexe Seitenlayouts erstellen, und es gibt auch die Möglichkeit, Tabellen und Aufzählungspunkte direkt in den Produktbeschreibungen hinzuzufügen.

4. ReConvert Upsell & Cross Sell: Diese App ist zwar hauptsächlich auf Upsell und Cross-Sell ausgerichtet, bietet jedoch auch eine praktische Möglichkeit, Produktseiten individuell zu gestalten. Damit können Inhalte wie Tabellen oder Aufzählungspunkte direkt eingebunden werden.

5. Tiptap Editor: Diese App bietet eine erweiterte Textbearbeitungsoberfläche für Shopify. Sie unterstützt zahlreiche Formate, einschließlich Tabellen und Aufzählungspunkten, und kann direkt in den Produktseiteneditor eingebunden werden.

Wenn du eine dieser Apps in Erwägung ziehst, lohnt es sich, die Funktionen im Detail zu vergleichen und auch Kundenbewertungen zu prüfen, um die beste Lösung für deine Bedürfnisse zu finden.

Hoffe das hilft dir weiter - lass wissen falls nicht! 😉

[MrSDC]

Hallo Gabe,

das Problem habe ich bei allen Produkten, auch bei denen, die ich vor 5 Wochen eingestellt habe. 

Ich habe auch festgestellt, dass ich die Formatierung für die Aufzählungslisten, wie hier unten dargestellt, nicht ändern kann.

Die Formatierung hingegen für Überschriften, Farben oder unterstrichene Zeilen, kann ich ändern...

Aufzählungslisten, wie hier, lassen sich in keinem meiner Produkte mehr formatieren...:

• besonders leise durch die schwingungsarme Konstruktion und Schalldämmung
• lange Lebensdauer
• sehr wartungsfreundlich
• optimale Luftqualität 

Kann sich das ein shopify Profi in meinen shop ansehen?

Dann würde mein Problem bestimmt schneller gelöst werden können.

Danke Dir

[Gabe]

Hey @MrSDC 

Du beschreibst oben viele Probleme, dennoch habe ich keine konkrete Beispiele die ich analysieren kann, sprich, keine Bilder, oder Links zu einem Beispiel im Frontend. Bei so einem Fall wäre ein befristeter Vorschaulink oder Link zu einem Beispiel sehr hilfreich das schneller zu analysieren. Ich müsste beispielweise den HTML Code, den du angewendet hast, der deine Aufzählungslisten nicht formatieren lässt, in meinen eigenen Produkte RTE testen können, um das Problem zu reproduzieren. Wenige verstehen, dass Entwickler nur so viel tun können, wie sie in der Hand haben um ein Problem im Code replizieren zu können. So funktioniert die Fehlerbehebung. Viele hier in der Community denken zu oft, dass eine einfache wörtliche Beschreibung ausreicht und wir haben dann genug i.d.H. haben, um das analysieren zu können. Stimmt leider nicht.

Oder, wenn du die Page Builder Apps nicht verwenden möchtest, warum verwendest du nicht eine unserer Tabellen Apps mit denen du ganz professionell-aussehende Tabellen für deine PDPs erstellen kannst die deine Kundenerfahrung enorm verbessern können? Siehe eine Demo dieser Apps hier und auch hier.

Hast du beispielsweise den Tabellen Code von Extern genommen, wie auf Google gefunden, und dann in den Shopify RTE kopiert? Wenn ja, dann sind solche Probleme die du beschreibst zu erwarten und das wird nicht funzen leider. Aber siehe meine Tipps dazu unten, wie z. B. die Tabelle von Grund auf nochmal aufzubauen mit den besten Praktiken der W3Schools.

Somit kann ich zwar deine Punkte oben verstehen, kann aber ohne konkrete Code Beispiele wenig damit anfangen. Ein Experte müsste somit einen Deep-Dive in dein Shop und die Produkte machen, um das besser analysieren zu können. Bist du auch meine Empfehlung gefolgt, einen HTMLStripper anzuwenden um unnötigen HTML aus dem Code zu entfernen denn du von der externen Quelle mit in den RTE kopiert hast? 

Warum baust du nicht deine Tabellen von Grund auf, indem du die Anweisungen der W3Schools folgst hier? Möglicherweise sind in deinem externen HTML Code fehlerhafte HTML-Tags eingefügt, die die Anzeige und Bearbeitung beeinflussen. Das <br>-Tag für Zeilenumbrüche kann andere Elemente stören, wenn es falsch eingesetzt wird. Überprüfe, ob die <br>-Tags oder andere HTML-Tags korrekt gesetzt sind. Wenn du kürzlich Änderungen in den Liquid-Dateien vorgenommen hast, könnten diese auch die Produktbeschreibungen beeinflussen.

Hoffe das hilft dir weiter - lass wissen falls nicht! 😉

[MrSDC]

Hallo Gabe,

kannst Du mir eine Mail schicken unter info@sdc-dental.de?

Dann sende ich dir alle Daten und du kannst dir den shop ansehen..?

Ist das möglich?

LG

[Gabe]

Hey @MrSDC 

Klicke am besten auf meinem Avatar und dann müsstest du folgendes sehen können:

[Gabe]

Zusatz: Probier mal bitte ALLE unten aufgelisteten Schritte um ein Browser Problem auszuschliessen:

Hier sind einige weitere Schritt für deinen Browser, die du lokal durchführen kannst, um das Problem zu beheben:

• Cache und Cookies löschen: Manchmal können veraltete oder beschädigte Cache-Daten und Cookies Probleme auf Websites verursachen. Lösche den Cache und die Cookies in den Browsereinstellungen und versuche dann, die Seite erneut zu laden.
• Browser-Erweiterungen überprüfen: Deaktiviere alle Browser-Erweiterungen, insbesondere solche, die das Verhalten von Webseiten beeinflussen können (wie z.B. Werbeblocker, Skript-Blocker oder ähnliche Tools), und sieh nach, ob das Problem damit behoben wird.
• Shopify-Theme überprüfen: Gehe zu deinem Shopify-Admin-Bereich und überprüfe das verwendete Theme. Manchmal können Probleme durch Updates oder Änderungen an den Themen-Einstellungen entstehen. Überprüfe auch, ob kürzlich Änderungen am Thema durchgeführt wurden und setze diese gegebenenfalls zurück.
• Konflikte mit JavaScript/CSS prüfen: Wenn du benutzerdefinierte Skripte oder Stylesheets zu deinem Shop hinzugefügt hast, könnten diese Konflikte verursachen. Prüfe den Code auf Fehler oder Inkompatibilitäten.
• Reaktion des Ladens bei unterschiedlichen Bildschirmgrößen testen: Öffne deinen Shop auf einem Desktop und verkleinere oder vergrößere das Browserfenster, um zu sehen, ob das Scrollen bei bestimmten Größen funktioniert. Dies könnte auf ein responsives Design-Problem hinweisen.
• Prüfe das Konsolen-Log: Öffne die Entwicklertools in deinem Browser (in der Regel mit F12 oder Rechtsklick und „Untersuchen“ zugänglich) und überprüfe die Konsole auf Fehlermeldungen beim Laden der Seite und beim Versuch zu scrollen.
• Überprüfen auf kürzlich installierte Apps: Manchmal können Shopify-Apps Konflikte verursachen. Überprüfe, ob du kürzlich Apps installiert hast und deaktiviere sie gegebenenfalls temporär.

Wenn das Problem weiterhin besteht, führe bitte alle folgenden Schritte durch um ein lokales Problem auszuschließen. 

Lokale Fehlerbehebungs-Schritte - Um sicherzustellen, dass es sich nicht um ein Problem mit deinem Browser, deinem Gerät oder deiner Internetverbindung handelt, versuche bitte Folgendes:

1. Lösche den Cache und die Cookies (verwende in Chrome die Zeitspanne "Alle Zeiten").
   • Warum: Dadurch werden gespeicherte Informationen aus dem Browser entfernt, die Fehler verursachen.
     Lösung: Lösche regelmäßig Cache und Cookies.
      
2. Stelle sicher, dass die Cookie-Einstellungen des Browsers NICHT auf "Alle Cookies blockieren" eingestellt sind.
   • Warum: Wenn sie "Alle Cookies blockieren", werden einige Apps wie Flow, Scripts, Launchpad oder andere Apps in der Verwaltung möglicherweise nicht richtig angezeigt.
     Lösung: Stelle entweder "Alle Cookies zulassen" oder "Cookies von Drittanbietern im Inkognito-Modus blockieren" ein.
      
3. Versuche es mit einem anderen Webbrowser UND im Inkognito-Modus des Browsers.
   • Warum: Das schließt den Browser oder die Version des Browsers aus, die Fehler verursacht.
     Lösung: Aktualisiere den Browser, deinstalliere ihn und installiere ihn neu.
      
4. Wenn du im Inkognito-Modus immer noch ein Anzeigeproblem hast, überprüfe, ob sie die Browsererweiterungen deaktiviert haben, da diese das Aussehen der Seiten verändern können.
   • Warum: So werden Erweiterungen, die Fehler verursachen, ausgeschaltet.
     Lösung: Lösche ungenutzte Erweiterungen, schalte Erweiterungen aus.
      
5. Vergewissere dich, dass der Webbrowser auf dem neuesten Stand ist (wir unterstützen nicht jeden Browser, aber diese hier).
   • Warum: So vermeidest du, dass die Browserversion zu Fehlern führt.
     Lösung: Aktualisiere den Browser, deinstalliere den Browser und installiere ihn neu, verwende einen unterstützten Browser.
      
6. Probiere ein anderes Gerät aus, z. B. einen anderen Computer oder ein Mobiltelefon.
   • Warum: Dadurch wird das Gerät, das die Fehler verursacht, ausgeschaltet.
     Lösung: Starte das Gerät neu, aktualisiere das Betriebssystem.
      
7. Versuche es mit der Shopify Mobile App.
   • Warum: Dadurch wird verhindert, dass die webbasierte Version von Shopify Fehler verursacht.
     Lösung: Geräteabhängiges Problem, andere Beispiele in dieser Liste können helfen, die Lösung zu finden.
      
8. Probiere eine andere Internetverbindung aus (wechsle z.B. mit deinem Telefon zu einem Mobilfunknetz statt zu WLAN).
   • Warum: Dies schließt eine schwache Internetverbindung oder ein ISP-Problem aus, das zu Fehlern führt.
     Lösung: Internetbasiertes Problem, sprich mit dem Internetanbieter.
      
9. Stelle sicher, dass im Webbrowser keine Pop-ups blockiert werden.
   • Warum: So kannst du verhindern, dass Pop-ups übersehen werden, z. B. wenn für eine Funktion ein neuer Tab geöffnet werden muss.
     Lösung: Wähle "Popups zulassen" im Gerät/Browser. Google den Browser/das Gerät, um passende Lösungen zu finden.
      
10. Vergewissere dich, dass auf deinem Gerät oder Netzwerk keine Firewalls oder VPNs (virtuelle private Netzwerke) aktiviert sind, die Shopify blockieren.
    • Warum: Dadurch wird verhindert, dass Firewalls oder VPNs Fehler liefern. Beispiel: Kaspersky kann Shopify blockieren.
      Lösung: Stelle sicher, dass Shopify nicht blockiert wird, verwende einen anderen Standort für VPN, schalte VPN aus.