Jump to content

Custom header or paragraph style?

Recommended Posts

Sure. Here's an idea.

Let's say the sentence in question is, "I like turtles."  The code below will find all instances of this sentence in headers of any size and in paragraphs, regardless of capitalization, and color the text red while giving it a green background. Add it to your footer injection and any time you type this sentence, it should be red and green.

<style>
.turtles {
  color: red;
  background: green;
}
</style>
<script>
document.querySelectorAll("h1, h2, h3, h4, h5, h6, p").forEach(function(el){
    el.innerHTML = el.innerHTML.replace(/i like turtles/gi, function(text){
        return "<span class='turtles'>" + text + "</span>";
    })
})
</script>

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.