x

Disabling RightClick Downloading of Images in Online Store

I'm a photographer selling online prints of my photos, and I'm considering using the online store to host my site. Is there a way to disable right-clicking of images to prevent digital downloads? I'm not a huge fan of watermarks, because I think they detract from the image (which is contrary to the whole point), so I'm hoping there's a way to prevent (or at least make it harder!) for people to right click and save the image I'm selling without me using those.

 

I hope that makes sense! Thanks for your help!

5,965 Views
Message 1 of 24
Report
1 Best Answer

Best Answer

I figured out the answer to my own question, but I'll put it here for anyone else who is looking to do this.

 

In the Online Store Dashboard page, go to Website -> Integrations -> Add Custom Header Code -> Add New Code

 

Add this code:

 

<!-- Following code will prevent right click on images place is just above closing </body> tag -->
<script>

document.oncontextmenu = function(e){
var target = (typeof e !="undefined")? e.target: event.srcElement
if (target.tagName == "IMG" || (target.tagName == 'A' && target.firstChild.tagName == 'IMG'))
return false

}

</script>
<!-- code to prevent right click ends here -->

 

And click on "End of Body" where it asks where the code should be placed. 

 

(Note, I didn't write this code, only grabbed it from another Weebly forum, here: https://community.weebly.com/t5/Vote-on-Features/Disable-Right-Click-On-Photos/idi-p/7662# )

 

Hope that helps someone else looking to protect their images. 😀

View Best Answer >

5,934 Views
Message 2 of 24
Report
23 REPLIES 23

Best Answer

I figured out the answer to my own question, but I'll put it here for anyone else who is looking to do this.

 

In the Online Store Dashboard page, go to Website -> Integrations -> Add Custom Header Code -> Add New Code

 

Add this code:

 

<!-- Following code will prevent right click on images place is just above closing </body> tag -->
<script>

document.oncontextmenu = function(e){
var target = (typeof e !="undefined")? e.target: event.srcElement
if (target.tagName == "IMG" || (target.tagName == 'A' && target.firstChild.tagName == 'IMG'))
return false

}

</script>
<!-- code to prevent right click ends here -->

 

And click on "End of Body" where it asks where the code should be placed. 

 

(Note, I didn't write this code, only grabbed it from another Weebly forum, here: https://community.weebly.com/t5/Vote-on-Features/Disable-Right-Click-On-Photos/idi-p/7662# )

 

Hope that helps someone else looking to protect their images. 😀

5,935 Views
Message 2 of 24
Report

thank you

5,243 Views
Message 3 of 24
Report

They must have changed things up. I cannot find a way to disable right click on images, and even followed your source link to the weebly forum. I am trying to follow the direction provided but cant find header code entry. Am I going to have to go to each image individually!? Ill keep digging, but now I have the code and don't know where to put it... artist, not a programmer. 

5,119 Views
Message 4 of 24
Report
Beta Member

Just curious - how can you prevent someone from just doing a screenshot - they can still get the photo ??

4,589 Views
Message 5 of 24
Report

As a photographer, I don't know that the quality of a screenshot would be good enough to make and sell prints, so I guess it doesn't concern me that much. However, I can see where this could be a concern for others, so I can think of 3 solutions:

 

- Create a watermark across the center of a photograph, so it couldn't be cropped out. 

- For the item photos, instead of the photo itself, you could use a photo of what the print would look like framed and on the wall

- You could also take a photo of the print at a slight angle dimensionally, kind of like what fine art America does here: https://fineartamerica.com/shop/canvas+prints

 

Honestly though, if someone wants to steal your image badly enough, they will find a way. My goal was just to make it not super easy for them to do so. 😄

4,529 Views
Message 6 of 24
Report

Before adding images to the web I change the resolution to the SQUARE recommended resolution settings which render well on devices but are not of sufficient quality for printing.  This is 72ppi. They also recommend the length of the longest side be 1000pixels. I use GIMP, a free equivalent of Photoshop and use the  "Scale Image" function. I also use GIMP to watermark my images either by working online or running a batch plugin (BIMP) to watermark all images in a directory. The resulting output can be directed to a new directory to not overwrite the original files. I created my business logo in GIMP, tiles it and saved this in GIMP as a pattern. From here I can use the "bucket-fill" option to fill the selected area. I also created a 1000 x 715 pixel 72ppi white layer as my base layer and I copy all my art onto this layer. This ensures the image will format correctly on mobile devices for some of the image gallery options. This may seem like a trivial issue but for art work of various sizes SQUARE ONLINE has a generic aspect ratio that just doesn't work for custom size art work. Was it worth it? YES! With the 72ppi 1000pixel max option my web site snaps open whereas before it took too long to load and I believe this affects Google SEO ranking. That's where I am up to on my learning curve.

 

I also followed the the recommendation in this post to turn off right clicking and it works for me. ARIE below updated the names of the current menu names to get to the same. spot

 

Thanks all

 

Jeff

4,076 Views
Message 7 of 24
Report

The white layer I create is 700 x 1050  this corresponds to the 2:3 aspect ratio I set:

 

Item preferences
Layout
Edit
Item image ratio
2:3
4,000 Views
Message 8 of 24
Report

Correction, I set the ratio to 2: 3 in Layout and the background I created  tp lay my images on is 700 x 1050

 

  • Items
  • Item preferences
    Layout
    Item Image Ratio
     
3,998 Views
Message 9 of 24
Report

I guess where I am going with this to provide a bit more protection is that there can be a great reduction in image quality copied for unauthorised use without affecting the online experience, SO

  1. set Right Click off
  2. reduce image quality to industry standard and SQUARE recommendation, scale images in a tool like GIMP 72pp1, 700 x 1050 pixel for 2:3 aspect ratio
  3. Use watermarks

There are excellent YouTube videos on GIMP by Davies Media Design, from installing to advanced many others as well and online documentation. This should allow you to Watermark and correct image sizes and lay them on an appropriate layer with the desired aspect ratio. I had hesitations about using SQUARE ONLINE for artwork at first but came up with this work around

3,998 Views
Message 10 of 24
Report
Beta Member

Hi,

 

I see this was posted from 2020 and Square has done so many updates since then. Do you have a recommendation for how to do this now on my website? I sell extensions and its very common for other vendors to steal photos and say its their product so I also want to make it harder for them to save my photos. As of right now I just put watermarks over everything but I really don't like it. How can prevent this for Square's newer version?

 

Thanks in advance!

2,955 Views
Message 11 of 24
Report
Square Community Moderator

Hey @aoptoni,

 

Thanks for being a member of the community.

 

Have you had a chance to check out this Best Answer from above? Currently, we do not have a way to prevent people from saving or downloading images. Feel free to also share your suggestions in our Ideate Room here - Our Product Team keeps an eye on this forum as they are constantly improving our products based on feedback like this.

 

Please let me know if there's anything else I can help you with.

2,894 Views
Message 12 of 24
Report

Hi @aoptoni! I can verify that this code still works on the current Square Website. 👍

 

I totally understand what you mean about people stealing your product photographs and selling them as their own. You could periodically do reverse image searches here https://images.google.com/ and then if you find them, issue them a DMCA takedown notice. I know that's a lot of work but it really does help keep that stuff to a minimum.

 

I hope that helps and I wish you the best of luck! 

2,849 Views
Message 13 of 24
Report
Beta Member

Thanks @EBPhotography I would love to try the code but I can't find integrations. How can I find it?

2,781 Views
Message 14 of 24
Report

Hi, so if you use the same code provided earlier in this thread it still works.

 

Go to your Square Dashboard -> then click Online under Quick Access -> Click Settings on drop down menu -> Tracking Tools ->  + Add New Code

 

Here is where you will place the code provided above. Name your code (I named it No Right Click), Then add the code in the box provided. Then it asks where you would like to place the code, Click the bubble that says -> End of <body>

 

Click Save.

 

That should be it. This worked for me on the free version of my square site where I sell art prints and stickers.

Good luck!

2,567 Views
Message 15 of 24
Report
Beta Member

Hi! Thanks it worked online on a desktop but on my phone I can still press and hold and then save a photo from my website. Is there a way I can fix this?

2,207 Views
Message 16 of 24
Report

You all rock! That code worked like a charm and I appreciate the update on where to find that setting!

2,163 Views
Message 17 of 24
Report
Alumni

Looks like you beat us to the punch here, @EBPhotography 😊

 

Thank you for posting the solution you discovered here for others to see! I'm sure this will be incredibly helpful for other photographers and artists hoping to mitigate art theft while maintaining the integrity of their art. Thanks again, and please don't hesitate to reach out directly if needed!

Valentina
Community Moderator, Square
Sign in and click Mark as Best Answer if my reply answers your question.
5,646 Views
Message 18 of 24
Report

How do you fix the right click protect for photographs on webpage?

4,772 Views
Message 19 of 24
Report
Square Community Moderator

Hi @csnfoto

 

Thanks for writing in to our Seller Community! I noticed it's your first post, welcome! 

 

You can use the code shared in the Best Answer in this thread and insert it on your Square Online Dashboard by heading to Settings > Tracking tools > Add custom header code

 

Please let us know how you go 🙂

4,653 Views
Message 20 of 24
Report

Hi

I have done this for my own site but it has no effect and I can still right click and save images. Please can you help? I know people can just take a screenshot but if I can cut out this easiest method then I will feel more secure about my images.

Thanks

4,416 Views
Message 21 of 24
Report