bottom smaller mobile version

[Debora]

 

 

I would like to know how I can make the “shop now” button a little smaller in the mobile version. What code can I use and how do I do it step by step?

[BSSCommerce-HDL]

Hi @Debora,
Can you kindly share your store link with us? We will check it and suggest you a solution if possible.

[Debora]

https://labelleboutiquehair.de

[Moeed]

Hey @Debora 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
@media screen and (max-width: 767px) {
a.button.button--primary {
    min-height: 30px !important;
}
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Debora]

Thank you sooo much I manage to fix with your code.

[BSSCommerce-HDL]

Hi @Debora, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

<style>
@media screen and (max-width: 749px) {
.banner__buttons a {
    font-size: 12px !important;
}
.banner__buttons a.button {
    min-height: 38px !important;
}
}
</style>

 Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[topnewyork]

Hi @Debora ,

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head>

<style>
@media screen and (max-width: 767px) {
a.button.button--primary {
     min-width: 100px !important;    
     min-height: 35px !important;
}
</style>

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!

[Rahul_dhiman]

Hello @Debora 
Please provide URL and password of the store.

[Sangeetanahar]

hello @Debora 

Please provide URL and password of the store.

thanks

[Moeed]

Hey @Debora 

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

[Rahul_dhiman]

Hello @Debora 

Go to online store ----> themes ----> actions ----> edit code---->base.css
add this code at the end of the file.

a.button.button--primary {
min-height: 30px !important;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

[Debora]

I tried but it appears that is not possible to publish with the code someone know what is this or what I doing wrong?

[Debora]

[topnewyork]

Hi @Debora ,

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head>

<style>
@media screen and (max-width: 767px) {
a.button.button--primary {
     min-width: 100px !important;    
     min-height: 35px !important;
}
</style>

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!