How do I create custom cursor with png?

I want to add a custom cursor to my site, I followed the instructions on previous forums but it doesn't seem to be working for me.

I navigate to: DESIGN>CUSTOM CSS>MANAGE CUSTOM FILES 

<style type="text/css">
  body, html {
        cursor:https://static1.squarespace.com/static/5d794acf629a072d75bbfffd/t/5ff5e3a90486da2d7a89bf21/1609950121967/SHAKERA+ALEXIS+LOGO+copy.png
       }
  </style>

is anyone able to clarify what i've done wrong here? I'm new to this so any help would be appreciated

Thank you!

If using  design custom css the <style> command is not used at either end. 

I created one for one page by putting it in advanced header code injection for that page:

<style>

type="text/css">
a:hover {
        cursor: url (put url here .png),  auto;
      }<
  </style>

For another one, I used a custom cursor for  all pages. I put this in design custom css:

body {
         cursor: url  ( put url here.png), default ;
     }

For both sites (7.0) I uploaded the cursor to  custom css files first of course.  I grabbed the url address from there. FYI the custom cursor will not work with a png file in MS edge. 

Thank you for your response

style type="text/css">
a:hover {
        cursor: url (https://static1.squarespace.com/static/5d794acf629a072d75bbfffd/t/5ff5e3a90486da2d7a89bf21/1609950121967/SHAKERA+ALEXIS+LOGO+copy.png),  auto;
      }<
  </style>

so would i paste this into code injection ?

33 minutes ago, derricksrandomviews said:

If using  design custom css the <style> command is not used at either end. 

I created one for one page by putting it in advanced header code injection for that page:

<style>

type="text/css">
a:hover {
        cursor: url (put url here .png),  auto;
      }<
  </style>

For another one, I used a custom cursor for  all pages. I put this in design custom css:

body {
         cursor: url  ( put url here.png), default ;
     }

For both sites (7.0) I uploaded the cursor to  custom css files first of course.  I grabbed the url address from there. FYI the custom cursor will not work with a png file in MS edge. 

Ok thanks for this!

I have retried it but still no luck, have I pasted the information in correctly?

What is the size of your png file? If it is too big it will be ignored.

1080 x 1080 px png, I tried as small as 32 x 32 px but it still didn't work

My largest is 2.2 kbs in size. 

I have compressed it to 2kb and uploaded it. should the cursor change instantly?

1 minute ago, shakeraalexis said:

I have compressed it to 2kb and uploaded it. should the cursor change instantly?

My largest is 2.2 kbs in size. Lets start from the beginning. Remove all code you have put in for this and lets use instructions that  I know works: 

First you upload your cursor image as a png or cur file. You paste the following css code into the page advanced settings for the page you want to use the cursor, but you need to copy  the url of the cursor file into the code string where you see URL of cursor goes here, remove those words of course.  

<style type="text/css">
  body, html {
        cursor:
 url of cursor file goes here      }
  </style>

For Site wide custom cursor, post in design advanced custom css without the <style> head and foot. Make sure spaces all look like the above. 

I am doing this for one page on my site here: https://www.myrandomviews.com/views-images 

Does not work with MS edge using png file , has to be a cur file. 

The cusor image, after upload,  that you paste  will be a squarespace static 1 file with a very long id number, just to let you know. 

To upload a file do the following:

 Highlight any text and the editor comes up

In the link editor, click  in the URL field.

1. Click the File tab.
2. upload your cursor file. All files uploaded to your site appear above the Upload File area.
3. Click the file in the list. A checkmark appears beside the selected file.
4. Click Save.
5. go back to the linked text copy the URL
6. you now have the cursor address to paste into the code I pasted here. I would use wordpad to copy it all before, make sure it looks right,  putting on the site, The cur url will work in an address bar and pull up the image, good way to make sure that part works as well beforehand.

1 minute ago, shakeraalexis said:

I have compressed it to 2kb and uploaded it. should the cursor change instantly?

Only if it has the same url, so I don't think it wll. You need to repost the url in the code.