Show Section after X seconds

Log in to see all code & get support.

You need

  • Business Plan or higher

In this post, I will share code to “show section after X seconds”. Like this demo

Find Section ID.

Each section has ID. You need to find Section ID first.

Right-click anywhere on the section which you want to create the effect > Click “Inspect” or “Inspect Element”

Scroll the mouse up the element at the top, you will see.

data-section-id=”5e800104854e1012beefbe7d”

It is Section ID.

Add JS Code

Add this code to Page Settings > Advanced > Header

Remember changing Section ID in below code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
  $(document).ready(function() { 
  $('[data-section-id="5e800104854e1012beefbe7d"]').hide();
setTimeout(function(){
  $('[data-section-id="5e800104854e1012beefbe7d"]').show();
},3000);
  });
</script>

Save. Done!

If you use Squarespace 7.0 and the code doesn’t work. Try disabling Ajax Loading.

If you have any problems, just send to my email via form in bottom right corner.