Generally most people accept that whatever you upload content to the internet, it can be viewed by the public and is at risk of being copied or retransmitted. Quite often no harm is done, and in many instances the ability for people to copy and share information can be a big plus and help promote your products or services. However in some other instances, copying of website content can be seen as a more deceitful activity, especially if their is financial gain involved. In truth, there is absolutely nothing you can do to 100% bullet-proof a website against content thieves - it is very easy to screen grab content and a determined content thief will find many other methods of getting at your content.

The recently updated Protector stack (formally the Content Protector stack) offers a basic solution to the problem, which may help thwart novice attempts to steal content. Similar to systems already in place on websites like Amazon and eBay, the Protector stack places your content behind an invisible window. This creates a barrier and limits the ability for a user to select or copy the content behind. The protection is achieved using pure CSS, so it will still work if a user switches off Javascript.

Version 1.1 of the Protector stack introduces the ability to place a copyright watermark over your content. It also introduces options to place a horizontal or vertical line over the content. Although these are purely cosmetic embellishments, to a casual onlooker, it would look as if you've edited images to include copyright text or watermarks. And again these elements are placed behind the invisible window, to give the appearance of being part of the content. Here are some examples of the Protector stack:



Some protected images...

Stacks Image 179
Copyright © Will Woodgate
Stacks Image 183
Copyright © John Smith, All Rights Reserved.
Stacks Image 181
Copyright © John Smith, All Rights Reserved.

An example of some protected text (try to click and highlight it)...

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet. Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet. Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet. Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet. Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.
Copyright © John Smith, All Rights Reserved.


Important! Obviously it should be emphasised again that the Protector stack is only designed to offer a minimum amount of pretection. It should be considered as a deterent, rather than a bullet-proof solution. If you dive into the page source code or view the browser activity monitor, all of this content will still be available and fully accessible. Also remember that content you place inside the Protector stack cannot be clicked or selected - that includes all links, buttons and form fields. Only use this stack if you definitely need to.

Setup

  1. Once installed, drag and drop a Protector stack into your page
  2. Drag and drop content (such as images, text or video) into the central placeholder
  3. Optionally you can also apply copyright text, or watermark lines, using the provided Protector settings