Shopify themes, liquid, logos, and UX
How do i change the position of the log in button to be centered? This is a locksmith page.
here is the page link: https://maisonsaintil.com/pages/members-only
Solved! Go to the solution
This is an accepted solution.
Hello @Sab24
You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid
<style>
main#MainContent .page-width>div {
display: flex;
align-items: center;
max-width: 100%;
flex-direction: column;
margin-bottom: 10px;
}
</style>
my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Hi @Sab24
This is Amelia from PageFly - Landing Page Builder App
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file theme.liquid
Step 3: paste bellow code in tag </body> -> save.
<style>
p {
color: initial;!i;!;
}
.page-width>div {
display: flex;
flex-direction: row;
justify-content: center;
margin-bottom: 10px;
}
</style>
Hope that my solution works for you.
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.
Hi @Sab24
Try this one.
div a.btn.btn-primary.btn-block.button.button--primary {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
main#MainContent {
position: relative;
}
Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better!
it worked for the memebership page, but the rest of my pages look like this:
This is an accepted solution.
Hello @Sab24
You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid
<style>
main#MainContent .page-width>div {
display: flex;
align-items: center;
max-width: 100%;
flex-direction: column;
margin-bottom: 10px;
}
</style>
my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
I had the same issue with centering a button on my locksmith page. What worked for me was going into the theme editor and adding a little CSS to fix it. Here's what I did:
Go to Online Store -> Theme -> Edit code.
Find the CSS or theme.liquid file.
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024