Looking for help adding text below add to cart button

Site URL: https://www.firocreations.com/shop-all/p/royal-square

Hello, 

I'm working on putting together a jewelry store through square space and have been having issues providing options on a full array of ring sizes without maxing out variant options.

One workaround I thought of was to provide a forum upon checkout which would give the customer a checklist of sizes so they could provide us with an exact ring size.

I want to provide some form of indicator that they can select a ring size so I was thinking of a way to add a fine print text notifying the customer they can "select a ring size upon check out".  below or above the add to cart button.

is this possible? If so, i will be remove my 4-8 sizes currently on the page and add a full list of ring sizes in the check out forum. 

Thank you,

Yedno

Hi,

Same text for all products or different text?

Can you share link to a product?

Hi Tuan,

Here's an example of the test page - https://www.firocreations.com/shop-all/p/royal-square-8wpaz-gm5hz I created with the sizing option. Currently I've set up a forum to appear when clicking add to cart. I also included a forum at the checkout page as I am not sure if the forum or the checkout forum details will be saved in the order details. (still working this part out with stripe).

Highlighted in the image below is where I want the text to go. It will say " Please specify your ring size upon adding item to cart." Once the customer adds the item the sizing options will appear.

I want text to only appear on rings so I've categorized them through tags and categories.

Thank you for your help.

Add to Design > Custom CSS

/*
- Add text under add to cart button
- Run on Lab tag only
*/
.tag-lab .sqs-add-to-cart-button-wrapper:after {
    content: "Please specify your ring size upon adding item to cart.";
    font-size: 14px;
    margin-top: 5px !important;
    display: block;
}

19 hours ago, tuanphan said:

/*
- Add text under add to cart button
- Run on Lab tag only
*/
.tag-lab .sqs-add-to-cart-button-wrapper:after {
    content: "Please specify your ring size upon adding item to cart.";
    font-size: 14px;
    margin-top: 5px !important;
    display: block;
}

Thank you Tuan,

This worked perfect! https://www.firocreations.com/shop-all/p/royal-square-8wpaz-gm5hz-hpdcn-ed3k9-w87eh-5eylx

Appreciate all of your help!

On 9/19/2021 at 5:04 AM, tuanphan said:

Add to Design > Custom CSS

/*
- Add text under add to cart button
- Run on Lab tag only
*/
.tag-lab .sqs-add-to-cart-button-wrapper:after {
    content: "Please specify your ring size upon adding item to cart.";
    font-size: 14px;
    margin-top: 5px !important;
    display: block;
}

 

Hi, @tuanphan how can I link this text to some other link/page.  I am adding shipping policies here which needs to be linked to policies page.

Thanks in advance

On 1/27/2022 at 4:34 PM, Asiya said:

Hi, @tuanphan how can I link this text to some other link/page.  I am adding shipping policies here which needs to be linked to policies page.

Thanks in advance

Hi. You will need a new code (Above code can't add link). Can you share link to a product on your site? We can test new code easier

Hi @tuanphan were you able to create code that can add a link? I've been looking and couldn't find anything. But I'd like to add an email address link to the same code in this topic. Thanks!

5 hours ago, NH85 said:

Hi @tuanphan were you able to create code that can add a link? I've been looking and couldn't find anything. But I'd like to add an email address link to the same code in this topic. Thanks!

It is possible, but need you share link to a product, we can check & give code easier

@tuanphan Great, here's the link https://www.thamesworkshop.com/strainers/p/small-strainer-x78kx-xymr3

I would like to add the email address: hi@thamesworkshop.com in the text under the Add To Cart button.

Thanks!

On 8/17/2023 at 8:14 AM, NH85 said:

@tuanphan Great, here's the link https://www.thamesworkshop.com/strainers/p/small-strainer-x78kx-xymr3

I would like to add the email address: hi@thamesworkshop.com in the text under the Add To Cart button.

Thanks!

Add to Settings > Developer Tools > Code Injection > Footer or Website > Website Tools > Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
jQuery(document).ready(function($){
  $('<p class="p-text">Dont see a size you are looking for? <a href="mailto:hi@thamesworkshop.com">Email us</a> and we will add it to the site.</p>').appendTo('.sqs-add-to-cart-button-wrapper');
})
</script>
<style>
  p.p-text {
    font-size: 14px;
    font-style: italic;
    margin-top: 5px !important;
    display: block;
}
  p.p-text a {
    border-bottom: 1px solid #f1f;
}
</style>

@tuanphan Thank you!!