Jump to content

Change the font style in the script itself (see below script)

Recommended Posts

Posted

Site URL: https://www.xystema.com/

Hi!

I have a script below to change the text inside a block:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
  $(document).ready(function() {  
	$(".product-price").html(function() { 
          return $(this).html().replace(".00", " /mo");
  });
});
</script>

I am wondering if there is a way for this to incorporate the changing of the font style. I want the " /mo" to change the font-size and font-color.

I will appreciate any help here. Many thanks.

  • Replies 4
  • Views 761
  • Created
  • Last Reply
Posted

If you change your replacement value from " /mo" to " <span>/mo</span>" you can then change the mo the way you want. You can of course add class, id or style attributes.

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.

Posted
55 minutes ago, creedon said:

If you change your replacement value from " /mo" to " <span>/mo</span>" you can then change the mo the way you want. You can of course add class, id or style attributes.

Let us know how it goes.

It did not work. Here's the code after I replaced. Please let me know if I missed something somewhere.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
  $(document).ready(function() {  
	$(".product-price").html(function() { 
      return $(this).html().replace(".00", "<span style="color:blue;font-weight:bold">/mo</span>");
  });
});
</script>

 

Posted

"<span style="color:blue;font-weight:bold">/mo</span>"

You can't have double double quotes without escaping the inner quotes.

It should be...

"<span style=\"color:blue;font-weight:bold\">/mo</span>"

...or...

'<span style="color:blue;font-weight:bold">/mo</span>'

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.

Posted
3 hours ago, creedon said:

"<span style="color:blue;font-weight:bold">/mo</span>"

You can't have double double quotes without escaping the inner quotes.

It should be...

"<span style=\"color:blue;font-weight:bold\">/mo</span>"

...or...

'<span style="color:blue;font-weight:bold">/mo</span>'

Let us know how it goes.

Both works! Amazing! I can now control this text. Thanks so much @creedon

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.