Liquid, JavaScript, Themes
Hallo Community! Es geht um das Shopify Theme Prestige versión 4.14.5. Ich habe hier im "Newsletter-Feld" einen Text mit dunkelgrau hinterlegtem Schatten, der Screenshot ist unscharf, ich hoffe, man kann es trotzdem erkennen. Ich weiss nicht mehr, ob ich ihn irgendwann selber irgendwie hinzugefügt habe. Ich möchte ihn jetzt entfernen, weil es unschön und unleserlich aussieht. Meine anderen Texte haben keinen Schatten, er befindet sich nur in diesem Rich-Text Image. Ich finde aber nirgendwo eine Möglichkeit, diesen Schatten zu entfernen. Hat hier jemand einen Tip für mich? Ich würde mich sehr freuen!
Gelöst! Zur Lösung
Erfolg.
Hey @Almakaia
Das habe ich jetzt in meinem Prestige Theme getestet und eine Theme Einstellung für Textschatten gibt es anscheinend nicht im Prestige Theme.
Aber führe bitte folgendes aus und dann dürfte sich das Problem des Textschatten im Newsletter Section lösen:
Hoffe das hilft dir weiter - lass wissen falls nicht! 😉
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hey @Almakaia
Danke für das Bild aber bei so einem Fall wäre ein befristeter Vorschaulink oder Link zu einem Beispiel sehr hilfreich das schneller zu analysieren.
Und du hast recht, ein Textschatten ist in deinem Bild leider nicht explizit zu erkennen. Du könntest dennoch eine CSS-Regel hinzufügen, um den Schatten zu entfernen - hier ein Beispiel für eine CSS-Regel, die den Textschatten entfernen könnte:
.ImageHero__ContentOverlay .SectionHeader__SubHeading,
.ImageHero__ContentOverlay .SectionHeader__Heading,
.ImageHero__ContentOverlay .SectionHeader__Description p {
text-shadow: none !important;
}
Wenn der Schatten nach diesen Änderungen immer noch vorhanden ist, könnten weitere spezifische Stile im Theme den Schatten beeinflussen und somit müsstest du den spezifischen Selektor noch genauer definieren oder den !important
-Modifikator verwenden, um sicherzustellen, dass die Regel nicht auf Top-Level überschrieben wird.
Wenn du in die Dev Console gehst (siehe meinen Blog dazu hier) dann kannst du auch prüfen, ob der Textschatten durch die .ImageHero__ContentOverlay
-Klasse definiert wird. Um diesen Textschatten zu entfernen, die CSS-Eigenschaft text-shadow
für diese Klasse überschreiben.
Hier ein CSS-Code, um den Textschatten zu entfernen:
.ImageHero__ContentOverlay {
text-shadow: none !important;
}
Hoffe das hilft dir weiter - lass wissen falls nicht! 😉
---
Warum nicht etwas Gamification in das Shop einbauen, um deinen Kunden etwas Fun im Shop anzubieten? Gerne kann ich bei Interesse Tipps dazu geben!
Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hallo Gabe, vielen Dank für deine ausführliche Antwort. Ich kann leider nicht coden, deshalb sind diese Lösungswege schwierig für mich. Ich denke, dass ich das in den Settings irgendwo selber ohne zu coden eingestellt habe. Hier ist der Link: www.almakaia.com.
Deshalb dachte ich, dass es irgendwo in den Settings sein muss und ich es einfach nicht finde.
Hast du eine Idee dazu?
Erfolg.
Hey @Almakaia
Das habe ich jetzt in meinem Prestige Theme getestet und eine Theme Einstellung für Textschatten gibt es anscheinend nicht im Prestige Theme.
Aber führe bitte folgendes aus und dann dürfte sich das Problem des Textschatten im Newsletter Section lösen:
Hoffe das hilft dir weiter - lass wissen falls nicht! 😉
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Genial! Vielen Dank!
Gerne! 😉
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hallo Gabe, ich habe eine weitere, ähnliche Frage. Bei diesem Image-with-text-Overlay möchte ich das Textfeld links und rechts erweitern. Ich schicke zwei Screenshots mit. Auf dem ersten sieht man nur das enge Textfeld, auf dem zweiten sieht man oberhalb den gleichen Text in einem HTML-Feld. Der Text im Image-with-text-Overlay sollte etwa genauso breit sein.
Ausserdem möchte ich auch hier den Schlagschatten vom Text entfernen. Könntest du mir einen CSS Code geben, der beides abdeckt?
Ich würde mich sehr freuen. Vielen Dank für die Aufmerksamkeit!
Hey @Oceana
Ich sehe was du meinst in deinen Bilder aber wenn ich einen Image with Text Overlay Abschnitt in meinem Prestige Test Theme einrichte (Prestige 9.3.0) geht der Text im Paragraph Block in die volle Breite wie du unten sehen kannst. Nicht vergessen du kann in diesem Abschnitt auch einen Liquid Block verwenden wo du mehr Kontrolle über die Gestaltung deines Texts hast:
Kann es seine dass du die Texte von einer externen Quelle in diesen Block per Copy & Paste einfügst (preformatted text)? Das würde erklären warum dein Text 1) mit <br>
HTML Tags versehen ist, die deine Zeilen enger machen bzw. sehr verkürzen, sowie 2) den Schlagschatten Font Style mit importieren. Von wo aus bzw. aus welcher externen Quelle kopierst du den Text in den Block rein?
Hoffe das hilft dir weiter - lass wissen falls nicht! 😉
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Teil 2 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 16, 2024Teil 1 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 9, 2024Anpassungen des benutzerdefinierten Codes an Shopify-Themes (CSS) leicht gemachtIn diesem...
By Gabe Aug 28, 2024