Liquid, JavaScript, Themes
Hallo gemeinsam,
meine Frage wäre, wie ich es hinkriege die Überschriften von Abschnitten, wie z.B. von der vorgestellten Kategorie, zu zentrieren. Ich glaube es muss im Code passieren, aber ich finde die Stelle nicht. Es wäre super nett, wenn mir jemand helfen könnte.
Hey @EMK68
Danke für die Frage und in der Tat ist es so, dass im Dawn Theme die Überschriften, beispielsweise, der Featured Kategorie Abschnitts auf der Seite ge-hardcoded sind und dass müsste man im CSS ändern:
Die Theme Einstellung Produktkarten macht es wahrscheinlich nicht was du erreichen möchtest wie man hier sieht:
Bitte beachte, dass Codeänderungen immer zuerst in einer Testumgebung getestet werden sollen und nicht im Live-Theme, und am besten mit einem Programmierer. Beachte auch das Codeänderungen dein Dawn Theme aus den Theme Updates ausschließen können, wie man hier aus meinem Test-Shop sieht:
Du könntest beispielsweise den folgenden Code im Assets -> base.css
ganz unten einpflegen (bitte den Code nach euren Bedürfnissen anpassen) der aber auch andere Elemente zentriert (einfach die rausnehmen die ihr nicht braucht):
@media (max-width: 750px) {
.featured-product-section .product__info-container {
text-align: center;
}
.featured-product-section .product .price {
justify-content: center;
}
.featured-product-section .product-form__quantity {
margin: 0 auto;
}
.featured-product-section .product-form__quantity .quantity {
justify-content: center;
margin: 0 auto;
}
}
Ein weiterer Code im base.css
das man testen könnte wäre folgender:
.title-wrapper--no-top-margin {
justify-content: center !important;
}
Die max-width
oben ist 750px was bedeutet, dass der Code nur auf Mobile greift. Du kannst aber die px gerne erhöhen um auch Desktop mit einzuschließen.
----
Ein paar weitere wachstums-Tipps:
Habt ihr schon über Ostern nachgedacht? Warum nicht etwas "Easter Egg Gamification" im Vorfeld Osterns in den Shop einbauen? Man kann z. B. eine Annonce auf der Homepage zeigen, dass Oster Eier im Shop versteckt sind und wenn diese gefunden werden, werden sie automatisch als Geschenk zum Warenkorb ergänzt. Gerne können wir hier weiter darüber plaudern!
Lass wissen, wenn du weitere Fragen hast zum Shop und Business und gerne können wir das hier weiter besprechen! 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
Danke für deine Tipps. Ich komme mit denen, aber leider nicht weiter. Ich habe im Abschnitt section-multicolumn.css was hinzugefügt.
@media screen and (max-width: 749px) {
.multicolumn .title-wrapper-with-link {
margin-bottom: 3rem;
text-align: center;
}
Mobile wird die Überschrift jetzt mittig, aber auf dem Desktop nicht. Kannst du mir helfen?
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