Squarespace: Using Code and HTML in Image Titles

Back in September of 2018, Squarespace decided to no longer allow code to be used in titles. Here’s a fix to give you back that functionality. Simply enter this code into SETTINGS > ADVANCED > CODE INJECTION.

If you have AJAX LOADING on your website, disable that first by going to DESIGN > SITE STYLES and unchecking the option for AJAX LOADING (only some of the newer templates have this option so if you’re using an older template, you can ignore this step.)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script>
$(function(){
$(".image-slide-title").each(function(){
$(this).html($(this).text());
});
});
</script>

P.S. You may have to change “.image-slide-title” depending on how you’re using titles.

MORE VIDEO TUTORIALS

Want more help? We have tons of YouTube tutorials on customizing your Squarespace website. Subscribe to our channel so you will know when a new tutorial is out.

Vigasan Gunasegaran About the author
vigasan@live.com

I've been working on Squarespace and WordPress websites for quite some time now. I enjoy how easy it is for clients to make updates to their own websites while using a CMS system. Outside of website design, I love good food, Netflix, and video games.

Comments:
  • David
    Reply

    This works, but not if the gallery page is within an index page. Do you experience this? Is there a workaround? Any help would be greatly appreciated.

    January 6, 2019 at 10:58 AM
      • Juan
        Reply

        Hi Vigasan,

        You have a solution for the line brake on the product title on squarespace?

        June 27, 2019 at 10:07 AM

Leave a Reply