Как сделать кнопку КОПИРОВАТЬ URL страницы?

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

И вот на таких сайтах мне кажется нужно сделать кнопку КОПИРОВАТЬ URL страницы, чтобы человек мог скопировать адрес статьи и разместить там, где ему хочется.


Решений много, я начал с того, что поставил пока кнопку в конце сайта, хотя есть желание сделать ее фиксированной с левого края сайта. Но это потом…

Как сделать кнопку КОПИРОВАТЬ URL сайта?

Нужно всего немного. В месте, где должна быть кнопка, нужно разместить такой код:

<div align="center"><button onclick="CopyLink()">СКОПИРОВАТЬ URL</button></div>

А в подвале сайта такой скрипт:

<!-- кнопка копировать ---><script defer type= "text/javascript">function copyTextToClipboard(text) {var textArea = document.createElement("textarea"); textArea.style.position = 'fixed'; textArea.style.top = 0; textArea.style.left = 0; textArea.style.width = '2em'; textArea.style.height = '2em'; textArea.style.padding = 0; textArea.style.border = 'none'; textArea.style.outline = 'none'; textArea.style.boxShadow = 'none'; textArea.style.background = 'transparent'; textArea.value = text; document.body.appendChild(textArea); textArea.select(); try { var successful = document.execCommand('copy'); var msg = successful ? 'successful' : 'unsuccessful'; console.log('Copying text command was ' + msg); } catch (err) { console.log('Oops, unable to copy'); } document.body.removeChild(textArea); } function CopyLink() { copyTextToClipboard(location.href); } </script>

Вот пока и всё, получилось вот такая простая кнопка:

Как изменить стили в текстовом редакторе Вордпресс?

Далее буду думать, как ее закрепить на краю экрана, чтобы и на мобильном он хорошо смотрелась. Главное — начало положено…

Оцените статью
Просто Линукс
Добавить комментарий