Shopify themes, liquid, logos, and UX
I am trying to change the space between the "View All" button on my homepage. I would not like there to be so much space between the bottom of the collection above the button, and the collection below the button. It seems a bit large (especially on mobile). I dont have any options on my "Customize Theme" editor to adjust button radius, height, etc. Only color and font style. Any help is much appreciated! (www.nstlga.la)
Hello @nostalgiaLTD
This is Amelia at PageFly - Shopify Advanced Page Builder app.
You can try the following steps I have provided to help you solve the problem you are facing:
Step 1: Online Stores > Themes > Edit code
Step 2: Choose file base.css
Step 3: Add code
/* You can change the value of 20px and 10px to the value you want */
.hr--invisible {
margin-top: 20px !important;
margin-bottom: 10px !important;
}
Hoping my solution helps you solve your problem.
Best regards,
Amelia | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)
➜ Weekly updated Shopify tutorials on YouTube
All features are available from Free plan. Live Chat Support is available 24/7.
This is Noah from PageFly - Shopify Page Builder App
Please add code here to change space content and button and set style button:
Step 1: Online Stores > Themes > Edit code
Step 2: Choose file theme.liquid
Step 3: Add code above the tag </head>
<style>
.shopify-section .hr--invisible{
margin: 30px 0px !important; //change space content and button
}
//you can change param different
.shopify-section .text-center .btn{
background: red !important;
font-size: 14px !important;
padding: 10px 20px !important;
border-radius: 5px !important;
}
</style>
Hope my solution will help you resolve the issue.
Best regards,
Noah | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
@nostalgiaLTD@nostalgiaLTD, do this to fix it in 20 seconds:
1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.css and paste this at the bottom of the file:
.hr--invisible{
margin-top: 10px !important;
margin-bottom: 10px !important;
}
You can change the 10px value as per your wish.
If it helps you please click on the "like" button and mark this answer as a solution!
Thank you.
Kind regards,
Diego
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024