FROM CACHE - de_header
Gelöst

Button auf banner ändern

SINRELLA
Entdecker
23 0 2

Hallo zusammen. Ich habe mir von einem anderen theme ein Abschnitt kopiert und in meinem aktuellen theme eingefügt . Das Problem ist das der Button jetzt so durchsichtig aussieht und größer als bei dem anderen . Ich möchte den gerne auch so klein haben und füllig an Farben . Welchen css Code kann ich wo anwenden ? Ich bedanke mich recht, herzlich im Voraus. 

IMG_3921.jpeg

IMG_3920.jpeg

1 AKZEPTIERTE LÖSUNG
Gabe
Shopify Staff
17365 2750 4056

Erfolg.

@SINRELLA 

 

Das kannst du wie folgt einfügen - unsere Anleitung erklärt das hier: Hinzufügen von benutzerdefiniertem CSS zu deinem Theme.

 

Und nicht vergessen, dass wir das ggf. 👀 können als Teil deiner 60-Min Design Time dass du mit einem Shopify Free Theme bekommst, wenn du das an uns sendest.

 

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

Lösung in ursprünglichem Beitrag anzeigen

5 ANTWORTEN 5

Gabe
Shopify Staff
17365 2750 4056

Hey @SINRELLA 

 

Danke für die Bilder und das habe ich jetzt in meinem eigene Testshop in der Dev Console getestet und folgender CSS hat in meinem Theme jegliche Transparenz im Button entfernt und auch den Button kleiner gemacht. 

 

Um den Button vollständig undurchsichtig (nicht transparent) zu machen, setze die opacity-Eigenschaft auf 1. Wenn der Button eine Hintergrundfarbe hat, die teilweise transparent ist (z.B. RGBA), stelle sicher, dass die Alpha-Komponente auch auf 1 gesetzt ist.

 

Die Größe des Buttons kannst du durch Anpassung der padding, font-size, und eventuell border Eigenschaften steuern. Dies hängt von deinem gewünschten Aussehen des Buttons ab. Hier ein Beispiel CSS Code:

 

.banner-text .theme_buttons.banner_btn_t {
    opacity: 1; /* Entfernt die Transparenz */
    background-color: #ff0000; /* Setze bevorzugte Button-Farbe */
    color: #ffffff; /* Textfarbe des Buttons */
    padding: 10px 20px; /* Verkleinert den Button durch weniger Innenabstand */
    font-size: 14px; /* Kleinere Schriftgröße */
    border: none; /* Entfernt den Rahmen, falls vorhanden */
    /* Optional: Füge Übergänge für Hover-Effekte hinzu */
    transition: background-color 0.3s ease-in-out;
}
/* Hover-Effekt für den Button */
.banner-text .theme_buttons.banner_btn_t:hover {
    background-color: #e60000; /* Dunklere Farbe beim Darüberfahren */
}

 

Um eine spezifische Farbe oder Größe anzuwenden, die Werte der Elemente background-color, padding, und font-size entsprechend anpassen.

 

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

---
Habt ihr auch den Shop auf Ostern eingestellt das jetzt um die Ecke liegt? Warum nicht eine Ostereierjagd 🐣 in das Shop einbauen, um deinen Kunden etwas Gamification und 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

SINRELLA
Entdecker
23 0 2

Hey ich danke dir.. dürfte ich den Code auch bekommen und die Stelle, wo er eingefügt wird? Theme ist Ride. Ich danke dir 

SINRELLA
Entdecker
23 0 2

Hey, entschuldige. Der wurde mir gerade nicht angezeigt. Ich teste das mal umgehend und halte dich auf dem Laufenden. 

Gabe
Shopify Staff
17365 2750 4056

Erfolg.

@SINRELLA 

 

Das kannst du wie folgt einfügen - unsere Anleitung erklärt das hier: Hinzufügen von benutzerdefiniertem CSS zu deinem Theme.

 

Und nicht vergessen, dass wir das ggf. 👀 können als Teil deiner 60-Min Design Time dass du mit einem Shopify Free Theme bekommst, wenn du das an uns sendest.

 

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

SINRELLA
Entdecker
23 0 2

Ich nochmal . Wo genau füge ich diesen ein ? Lg