Защита контента от физического копирования

Защищаем контент посредством CSS и JavaScript

Защита контента от физического копирования

Вопрос защиты контента стоит ребром для каждого человека, который создаёт уникальный контент для своего сайта или для тех людей, которые платят деньги за уникальный контент, который для них создают другие люди.

В том или другом случае хочется, чтобы уникальный контент и дальше оставался «уникальным», но, к сожалению, от пронырливых «копипиздеров», которые копируют всё, что только можно, не утруждаясь при этом изменить хотя бы пару слов синонимами, никуда не деться.

На самом деле, если при копировании тех или иных материалов с сайта размещалась бы обратная активная ссылка, ведущая на копируемый материал, то ситуация в корне изменилась бы. Такое копирование приветствовалось бы практически на каждом сайте!

К сожалению в Рунете об этом можно лишь помечтать и приступить к сооружению «забора», который усложнит процесс копирования материалов с сайта.

Запрещаем выделение текста мышью

При помощи класса в CSS

Размести этот кросс-браузерный класс в основной таблице стилей своего шаблона

.noselect {
	-moz-user-select: none;
	-webkit-user-select: none; 
	-ms-user-select: none;
	-o-user-select: none; 
	user-select: none;
}

Сохрани и опробуй его на деле, дописав класс .noselect к блоку с выводимым текстом, например:

Этот текст ты не сможешь выделить мышью, потому что к нему применён класс, описанный выше.

<p class="noselect">Этот текст ты не сможешь выделить мышью, потому что к нему применён класс, описанный выше.</p>

Этот способ хорошо дополняет метод на JavaScript, который будет описан далее, но не является панацеей от копирования. Всегда можно «Сохранить HTML-страницу как» или получить доступ к тексту на странице через «Исходный код» в браузере. От совсем «дубовых» копипастеров он спасет. Также этот метод работает тогда, когда в браузере отключен JavaScript.

Предотвращаем копирование текста на странице

При помощи JavaScript с предупреждением

Этот небольшой скриптик рекомендую тебе добавить в код нижней части сайта, например в footer.

<!--noindex-->
<!--CopyPasterText-->
		<script type="text/javascript">
		function copytext() { 
			alert('Данный текст является интеллектуальной собственностью автора блога Okatiev.Ru (если не указано иное) и охраняется законом "Об авторском праве".\n\nПо вопросам использования данного текста на своем сайте пишите в электронную почту - me@okatiev.ru (также указана внизу сайта), либо указывайте активную ссылку в копируемом тексте на данную страницу.\n\nБлагодарю Вас за то, что уважаете мой труд!'); 
			return true; 
		}
</script>
<!--/CopyPasterText-->
<!--/noindex-->

Текст предупреждения замени на свой

Далее, тебе необходимо добавить атрибут

oncopy="copytext(); return true;"

к блоку с текстом, при попытке копирования которого ты хочешь, чтобы появлялось предупреждение для копирующего. Значение return true; этого атрибута позволяет скопировать текст, показав при этом предупреждение.

Для того, чтобы запретить передачу текста в буфер обмена из браузера, нужно true заменить на false

oncopy="copytext(); return false;"

У меня на блоге используется «лайтовый» вариант, который позволяет копировать информацию.

<p oncopy="copytext(); return true;">Этот текст ты сможешь скопировать, но увидишь предупреждение.</p>

Добавляем ссылку к копируемому тексту

На ту страницу сайта, с которой был скопирован текст

Также на моём блоге используется скрипт, который я когда-то где-то нашёл на просторах интернета. Он добавляет активную обратную ссылку на копируемый материал с сайта.

Добавить его тоже нужно в нижнюю часть сайта, в footer.

<!--noindex-->
<!--Ссылка на первоисточник-->
<script type="text/javascript">
			function addLink() {
			    var body_element = document.getElementsByTagName('body')[0];
			    var selection;
			    selection = window.getSelection();
			    var pagelink = " (Источник: <a href='"+document.location.href+"'>"+document.location.href+"</a>)";
			    var copytext = selection + pagelink;
			    var newdiv = document.createElement('div');
			    newdiv.style.position='absolute';
			    newdiv.style.left='-99999px';
			    body_element.appendChild(newdiv);
			    newdiv.innerHTML = copytext;
			    selection.selectAllChildren(newdiv);
			    window.setTimeout(function() {
			        body_element.removeChild(newdiv);
			    },0);
			}
			document.oncopy = addLink;
		</script>
<!--/Ссылка на первоисточник-->
<!--/noindex-->

Результат работы этого скрипта таков:

Также на моём блоге используется скрипт, который я когда-то где-то нашёл на просторах интернета. Он добавляет активную обратную ссылку на копируемый материал с сайта. (Источник: https://okatiev.ru/all/zaschita-kontenta-ot-fizicheskogo-kopirovaniya/)

Конечно это скрипт для наивных людей (таких как я), которые надеются на то, что у человека, который решил скопировать твой контент, будет капля совести и уважения к твоему труду, и он не удалит эту ссылку, а разместит скопированный текст вместе со ссылкой. Либо по невнимательности, но в любом случае шансов на такое «чудо» мало.

Запрещаем контекстное меню на изображениях

Показываем предупреждение при попытке кликнуть правой кнопкой мыши по изображению

Скрипт практически такой же, как и для защиты текста от копирования, а именно:

<!--noindex-->
<!--CopyPasterImg-->
<script type="text/javascript">
		function copyimg() {
					alert('Вы не можете сохранить это изображение.\nОно является интеллектуальной собственностью Александра Окатьева и охраняется законом Об авторском праве.');
					return false;
		}
</script>
<!--/CopyPasterImg-->
<!--/noindex-->

Размещать его рекомендую там же, в нижней части сайта, как, в прочем, и все подключаемые скрипты.

Чтобы защитить картинку этим скриптом, добавь к выводу изображения атрибут

oncontextmenu="copyimg(); return false;"

В итоге у тебя должно получиться что-то типа:

<img src="https://okatiev.ru/user/userpic@2x.jpg" oncontextmenu="copyimg(); return false;" />

Вывод

Защита контента от физического копирования

В качестве вывода могу сказать, что это очень простые методы защиты от копирования контента, своего рода «защита от дурака», которые в большинстве случаев работают и работают довольно хорошо, особенно все в комплексе.

Но тебе необходимо понимать, что если человек захочет что-то скопировать и захочет этого довольно сильно, то его не остановит никакая защита, вплоть до того, что он сядет и перепечатает вручную всё, что считает нужным, было бы желание.

В догонку этим небольшим доработкам, рекомендую почитать данную статью Как ускорить индексацию контента и защитить его от копирования и применять прочитанное на практике сразу, как только у тебя появляется уникальный контент на сайте.Таким образом ты защитишь свое авторское право в глазах поисковиков даже тогда, когда твой контент скопируют и попытаются разместить где-то ещё.

Я надеюсь, что эта информация пригодилась тебе! Если у тебя возникли вопросы/пожелания/замечания, пиши в комментариях к этой статье! До связи!

Плюсануть
Поделиться
Отправить
Запинить
Понравился этот пост? Поделись им в соцсети!
Популярное
3 комментария
Alex
Alex

9 декабря 2017, 17:49

Очень нужная в наше время статья! Подскажите в какой файл opencart 2.1.0.2 вносить изменения. Не совсем понял.

Александр Окатьев

Скрипты нужно добавить в файл footer.tpl, который находится по адресу:

/catalog/view/theme/НАЗВАНИЕ_ТЕМЫ/template/common/
Алекс
Алекс

15 декабря 2017, 09:30

CSS на текст работает! Изображения товаров в opencart 2.1.0.2 выводятся из алгоритма системы. Скажите пожалуйста в какой файл вносить изменения, чтобы запретить контекстное меню во всех изображениях размещённых на сайте.

Александр Окатьев

Здравствуйте, Алекс! Чтобы защитить изображения от копирования, Вам необходимо внести изменения в нескольких файлах шаблона

product.tpl
category.tpl
compare.tpl
search.tpl
special.tpl

которые лежат по адресу

/catalog/view/theme/название_темы/template/product/

Список файлов может изменяться в зависимости от того, какой стиль оформления используется.

Вы можете вносить изменения напрямую файл только тогда, когда уверенны в том, что не будете в дальнейшем обновлять версию шаблона. Тогда Вам нужно будет переносить все ранее внесенные изменения в код вручную в новую версию шаблона. В противном случае нужно использовать самописные OCMOD-дополнения под Ваш шаблон.

Alex
Alex

15 декабря 2017, 16:32

Спасибо, Александр!

Александр Окатьев

Обращайтесь

Ваш комментарий
адрес не будет опубликован
HTML-код не интерпретируется

Ctrl + Enter