Customize cursor

Hi everyone,

I would like to customise my cursor on my all website and have this GIF instead : https://media0.giphy.com/media/1NRTjcHswoIzdGsUBx/source.gif

I tried to update the CSS but nothing is happening. Could you please help me ?

Thanks a lot.

Florian

You first have to upload the image file to custom css files, in design-advanced, the file button is at the bottom of the panel/window. The gif can't be too large or the site will just ignore your css. I am not sure a gif will work, usually the cursor is a .cur or .png file, but its worth a try.  Optimal size 100x78 pixels.  

The code you use will look like this with your .gif file url location in between the () in place of the xs. You will find the url by clicking on the file name in Custom css, it shows at the top of the window, you copy and paste it, but don't save the window. You put this code on the page advance header code injection of any page you want to use it. If you plane on using it on all pages remove the style commands (first and last lines) and paste the remaining code directly into custom css. 

<style type="text/css">
  body, html {
        cursor: url(xxxxx), auto;
      }
  </style>

Does this work for squarespace 7.1?