Shopify themes, liquid, logos, and UX
To continue receiving payouts, you need to secure your account by turning on two-step authentication. If two-step authentication is not turned on your payouts will be paused. Learn more
Want to know how I can make the product title and price on the same with. With a coloured box around it.
Here is how the current design looks:
This is what I want it to look like:
Url: https://flaud.world/
Password: 202135283
Thanks,
B
Solved! Go to the solution
This is an accepted solution.
Float the title to the left and the price to the right
.card-information__wrapper .price { float:right; }
Quickfix
Add a custom html/liquid section with the following style rule
<style>.card-information__text { float: left; } </style>
Note the float version does not account for long titles or bigger price areas.
Alternative:
<style>
.card-information__text { display: inline; }
.card-information__wrapper .price { display: flex-inline; }
</style>
Test both throughly with long content, sale prices, etc
Beyond that you would need to combine the product cards title header with the price block which is set to flex by default so they wont mesh together very well without work.
Contact me if you need this type of customization, paull.newton+shopifyforums@gmail.com
FYI: assuming your still developing but just in case "copy" in product names is something to be really avoided i.e. /products/copy-of-copy-of-copy-of-copy-of-copy-of-sweatsuit-pullover
After adding custom html/liquid, it looked like this:
I tried changing the float to right, which is where I want the price to be and it looked like this:
What do I do to make the title on the left, and price on the right?
Thank you for the heads up, just added copies quickly to work on the look.
This is an accepted solution.
Float the title to the left and the price to the right
.card-information__wrapper .price { float:right; }
It looks even now:
uneven**
User | RANK |
---|---|
126 | |
95 | |
78 | |
54 | |
46 |
Would you love to unleash the unbridled power of the Google Shopping Channel into your sho...
By Gabe Jan 6, 2023How can you turn a hobby into a career? That’s what Emmanuel did while working as a wa...
By Skye Dec 30, 2022Shipping can be one of the most vital parts to set up and manage your business. Understand...
By Ollie Dec 16, 2022