Shanika Posted June 25, 2020 Share Posted June 25, 2020 Site URL: http://cleanr.com Hi I need help I want to put "excluding VAT" under the £ price on the shop page. I haven't been able to find any codes for doing that. Please see the example on what I want it to look like. Link to comment
Solution paul2009 Posted June 25, 2020 Solution Share Posted June 25, 2020 (edited) On 6/25/2020 at 6:53 PM, Shanika said: I need help I want to put "excluding VAT" under the £ price on the shop page. You can do this by adding the following to Design > Custom CSS: .product-price:after { content: 'Excluding VAT'; display: block; margin-top: 7px; color: red; text-transform: uppercase; } Updated in August 2022 due to the Squarespace Price Formatting update (23 August 2022). Edited August 28, 2022 by paul2009 Squarespace Price Formatting update About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links. Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.Improve your online store with our extensions. Link to comment
Shanika Posted June 25, 2020 Author Share Posted June 25, 2020 5 minutes ago, paul2009 said: You can do this by adding the following to Design > Custom CSS: .product-price .sqs-money-native:after { content: 'Excluding VAT'; display: block; margin-top: 7px; color: red; text-transform: uppercase; } Hi Paul, THANK YOU! I tried that still I don't see anything. I am using version 7.1. Please see attached. Am I doing something wrong? sorry new to this Link to comment
Shanika Posted June 25, 2020 Author Share Posted June 25, 2020 1 minute ago, Shanika said: 10 minutes ago, paul2009 said: You can do this by adding the following to Design > Custom CSS: .product-price .sqs-money-native:after { content: 'Excluding VAT'; display: block; margin-top: 7px; color: red; text-transform: uppercase; } Never mind I removed the other css and it worked 🙂 amazing thank you so much! Link to comment
Guest Posted August 27, 2020 Share Posted August 27, 2020 Hello Paul Sorry to hijack Shanika's thread but is it possible to go one step further and instead of adding Excluding VAT on next line to add it as a suffix to price? If so is it also possible to do a calculation based on ex vat price and show inc vat pricing something like below... £100.00 + VAT [£120.00 inc VAT} Thanks in advance Nick Link to comment
paul2009 Posted August 28, 2020 Share Posted August 28, 2020 (edited) On 8/27/2020 at 10:37 AM, nickcadsoftuk said: is it possible to go one step further and instead of adding Excluding VAT on next line to add it as a suffix to price? If so is it also possible to do a calculation based on ex vat price and show inc vat pricing You can add the label as a suffix by removing some of the lines of code that I supplied. For example: .product-price:after { content: '+VAT'; } However, this will only work for products without variants. Also, if you want to show the ex/inc pricing, you’ll need to do it entirely differently, using JavaScript. Updated because of the Squarespace Price Formatting update that started rolling out on 23 August 2022. Edited August 28, 2022 by paul2009 Updated due to Squarespace Price Formatting update About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links. Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.Improve your online store with our extensions. Link to comment
Guest Posted August 28, 2020 Share Posted August 28, 2020 Thanks Paul, is this something you'd consider as paid for job via SF Digital? All the best Nick Link to comment
HG-Design Posted July 11, 2022 Share Posted July 11, 2022 HI @paul2009, thank you for posting this solution which works great however as the product has variables, once you select the dropdown options, the added ex vat test is not displayed. Page: https://wvcharge.squarespace.com/waev-charge-store/p/waev-charge-ev1 Is there an additional bit of CSS to make it remain permenatly please? Thank you in advance, Joe Link to comment
paul2009 Posted July 11, 2022 Share Posted July 11, 2022 1 hour ago, HG-Design said: as the product has variables, once you select the dropdown options, the added ex vat test is not displayed When a valid variant is selected, the span with the sqs-money-native class will disappear but the parent div with the product-price class will still exist and can be used instead. About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links. Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.Improve your online store with our extensions. 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