Change color a word in Accordion Block

Pro Tips Other Tips
1

To change a specific word on Accordion Block in Squarespace, you can follow these steps
Suppose you have text “FORGED” appears on some items on Accordion, and you want to change its color.
You can use this code to Website Tools (under Not Linked) > Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("div.accordion-block p").each(function() {
    $(this).html($(this).html().replace(/FORGED/g, "<span>FORGED</span>"));
});
});
</script>
<style>
div.accordion-block p span {
    color: rgb(235, 113, 20);
}
</style>

Result

image
image1533×414 43.6 KB

Explain

  • In the script code, you will see 2 FORGED text, just change both to word you want to change
  • In code, you will see color, just change rgb(235, 113, 20) to color what you want. You can use rgb color, or hex color: #f1f2f3 or color name: blue, red, violet
2 Likes