How to Reduce the Size of the "Shop Now" Button in Mobile View?

Hello,

How can I reduce the size of the “Shop Now” button in the mobile view?

Here is the link https://tekaifaswg23rye9-71988969740.shopifypreview.com

Thanks in advance for the support.

Hey @Esra47

Danke für den Link und du hast hier die Deutsche Community erreicht. Auf Mobile muss man auch bzgl. den Barrierefreiheiten und der Zugänglichkeit vorsichtig sein die Buttons nicht zu klein zu machen denn dann sind sie ggf. schwer mit dem Finger anzutappen.

Du kannst es aber mit einem CSS Code und Media Query versuchen. Folge einfach unsere Anleitung dafür hier.

Hier ist ein CSS den du testen kannst:

@media (max-width: 767px) {
   .banner__box .banner__buttons .button--primary {
       font-size: 12px; /* Adjust the font size as needed */
       padding: 8px 16px; /* Adjust the padding as needed */
       line-height: 1.2; /* Adjust line-height if necessary */
   }
}

Hoffe das hilft dir weiter - lass wissen falls nicht! :wink:


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.

1 Like

Hab den Code eingegeben und es ist deutlich besser geworden, vielen Dank :slightly_smiling_face:

@Esra47

giphy

1 Like