Jump to content

Custom header or paragraph style?

Recommended Posts

  • Replies 2
  • Views 252
  • Created
  • Last Reply

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

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.