Shopify themes, liquid, logos, and UX
Hello. How I could change the code to picture discount code section a bit above? Screenshot attached.
Solved! Go to the solution
This is an accepted solution.
Hey @manter,
Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.
<style>
.tt-shopcart-col div:has(> #pickup-wrapper) {
display: flex !important;
flex-direction: column-reverse !important;
position: relative !important;
}
.tt-shopcart-col div:has(> #pickup-wrapper) button[name="checkout"] {
position: absolute !important;
width: 95% !important;
left: 50% !important;
transform: translateX(-50%) !important;
bottom: -35px !important;
}
.tt-offset-small.container-indent.tpivsectiontemplate--19999672369478__index_section_text_plus_image_vertical_aazxTq {
margin-top: 70px !important;
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
@manter , hope you are well,
you can achieve with CSS flex, can you share your URL so I can check and give you css code
Thank you
This is an accepted solution.
Hey @manter,
Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.
<style>
.tt-shopcart-col div:has(> #pickup-wrapper) {
display: flex !important;
flex-direction: column-reverse !important;
position: relative !important;
}
.tt-shopcart-col div:has(> #pickup-wrapper) button[name="checkout"] {
position: absolute !important;
width: 95% !important;
left: 50% !important;
transform: translateX(-50%) !important;
bottom: -35px !important;
}
.tt-offset-small.container-indent.tpivsectiontemplate--19999672369478__index_section_text_plus_image_vertical_aazxTq {
margin-top: 70px !important;
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
Learn what's possible with customizing Shopify Checkout beyond what's available out of...
By Shopify Feb 19, 20252m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025