Rjafadi Posted September 8, 2022 Share Posted September 8, 2022 Site URL: https://www.prsnlhb.com/view-all/nlt82a0v7ai136xxx613j8xrnhqoep Hi Everyone, Can some help me with this issue, I'm trying to move the price number to the product title. Thank you! Link to comment
creedon Posted September 8, 2022 Share Posted September 8, 2022 Add the following to Store Settings > Advanced > Page Header Code Injection for the store page. Please see per-page code injection. <style> /* store product detail price move to right of title desktop */ .ProductItem-details .product-price { order : 1; } @media screen and ( mix-width : 641px ) { .ProductItem-details:not( .ProductItem-details--mobile ) { display : grid; grid-template-columns : repeat( 5, 1fr ); } .ProductItem-details > * { grid-column : 1 / 6; } .ProductItem-details h1.ProductItem-details-title { grid-column : 1 / 3; } .ProductItem-details .product-price { grid-column : 3 / 6; } } </style> This is for v7.0 using the Brine template family. It is not easily possible to achieve the effect you want on mobile because of the structure of the page. Let us know how it goes. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
Rjafadi Posted September 8, 2022 Author Share Posted September 8, 2022 (edited) @creedon Thank you! Could it be possible if it was on the same line as the product name for desktop? For Mobile 1. Is there a way the price could be under the product title 2. Create some distance the image - product title - price - sizes ? Edited September 8, 2022 by Rjafadi Link to comment
creedon Posted September 8, 2022 Share Posted September 8, 2022 Quote Could it be possible if it was on the same line as the product name for desktop? Possible yes. but as I stated previously not easy. I think it would take some JavaScript to move elements around on the page. I do not know of any code to do this. CSS can't get the job done. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
nys Posted October 1, 2022 Share Posted October 1, 2022 Hey there, How did you make your sizing section look like this with squares around each size? And how did you add the "garment information / delivery and returns" Any help would be amazing. Link to comment
paul2009 Posted October 1, 2022 Share Posted October 1, 2022 18 minutes ago, nys said: How did you make your sizing section look like this with squares around each size? Take a look at the Swatch Variants paid plugin. Their product allows you to show sizes in this way. About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥. Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links. Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional. Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment