Webサイトを運用していると、ソースコードをコピーされたくないな~と思う時がありますよね。
コピーされたくない理由としては、
- コピーサイトが作られる
- 必死で作ったCSSがいとも簡単に盗まれる…
などでしょうか。
僕はあんまり気にしない性格なので、コピーされてもほっとくだけですが気になる人は気になるものです。
今回はそんなWebサイトのソースコードのコピーを禁止する方法をご紹介したいと思います。
もしもアフィリエイトは会員登録後も無料です!
今すぐ会員登録してアフィリエイトを始めよう!
Webサイト上でテキストのコピーを禁止する方法
ではテキストのコピーを禁止するのか見ていきましょう。
手順はいくつかありますので、各それぞれのWebサイトに適した方法で実装頂ければと思います。
bodyタグでテキストのコピーを禁止する方法
<body oncopy='return false;'>
bodyタグで対応する場合は、このようにしましょう。
Webサイト上でテキストコピーが禁止されます。
javascriptでテキストのコピーを禁止する方法
<script type="text/javascript">
document.getElementsByTagName('html')[0].oncopy = function () {return false;}
</script>
javascriptで対応する場合は、このようにしましょう。
こちらもWebサイト上でテキストコピーが禁止されます。
個人的にはこのやり方が一番しっくりきます。
Webサイトでソースコードのコピーを禁止する方法
続いて、ソースコードのコピーを禁止するのか見ていきましょう。
手順はいくつかありますので、各それぞれのWebサイトに適した方法で実装頂ければと思います。
bodyタグでソースコードのコピーを禁止する方法
<body oncontextmenu='return false;'>
bodyタグで対応する場合は、このようにしましょう。
Webサイトで右クリックが禁止されるので、ソースコードコピーができなくなります。
javascriptでソースコードのコピーを禁止する方法
<script type="text/javascript">
document.getElementsByTagName('html')[0].oncontextmenu = function () {return false;}
</script>
javascriptで対応する場合は、このようにしましょう。
こちらもWebサイトで右クリックが禁止されるので、ソースコードコピーができなくなります。
個人的にはこのやり方が一番しっくりきます。
スマホの場合のコピー禁止対応方法は?
スマホ(iOS/Android)ではちょっと対応が違ってきます。
CSSでコピーを禁止する方法
<style type="text/css">
body {
-webkit-touch-callout:none;
-webkit-user-select:none;
}
</style>
スマホ(iOS/Android)で対応する場合は、このようにしましょう。
「-webkit-touch-callout:none;」では、リンク長押しのポップアップを無効化します。
「-webkit-user-select:none;」では、テキスト長押しの選択ボックスを無効化します。
まとめ
いかがだったでしょうか。
いずれも簡単に対応できますが、ChromeやFirefoxなどブラウザ機能のデバックツールを利用すれば、コピー禁止を施してもコピーはできてしまいます。
そこまでする人の事はもう諦めましょう…。
ちなみに、WordpressもLinuxも利用できるレンタルサーバーはエックスサーバーがオススメです。