サイトの右クリックやコピーを禁止にする方法｜CSS・JavaScriptで簡単に実装！

自分のブログやサイトの内容を「無断でコピーされたくない…」「画像の保存やコードの盗用を防ぎたい…」と思ったことはありませんか？

完全に防ぐことはできないものの、右クリックやコピーを制限する方法をCSSやJavaScriptで簡単に実装することができます。

今回は、コピペ対策・右クリック防止のテクニックをいくつかご紹介します。

方法①：CSSで選択禁止にする（テキストのコピー防止）

CSSだけでユーザーによるテキスト選択を無効化することができます。以下のコードを追加しましょう：

/* inputやtextarea以外の要素の選択を無効化 */
:not(input):not(textarea) {
 -webkit-user-select: none; /* Chrome, Safari */
 -moz-user-select: none; /* Firefox */
 -ms-user-select: none; /* IE/Edge */
 user-select: none;
 -webkit-touch-callout: none; /* iOSの長押しメニューも防止 */
}

🔍 ポイント：

• ブログ本文などのテキストを選択不可にできます。
• フォームの入力欄（input, textarea）は除外しているので、通常のフォーム操作はOKです。

方法②：JavaScriptで右クリック（コンテキストメニュー）を無効化

このコードを使うと、ブラウザ上での右クリック操作（コンテキストメニュー）をすべて無効にできます。 たとえば、画像の上で右クリック → 「画像を保存」や、ページ上で右クリック → 「検証」などの操作ができなくなります。

// 右クリックメニューを無効にする
document.addEventListener('contextmenu', function(e) {
 e.preventDefault();
});

🔍 ポイント：

• ページ上での右クリックを無効化できます。
• 画像の保存や「検証」などを防ぐ心理的効果も◎

方法③：JavaScriptで「Ctrl+C」「Ctrl+U」などのショートカットを無効化

このコードは、「Ctrl+C（コピー）」「Ctrl+U（ソース表示）」「Ctrl+S（保存）」などのショートカットキーを無効化します。特に「Ctrl+U」はページのソースコードを丸ごと表示できるため、コード盗用を防ぎたい方にはおすすめです。また、「Ctrl+S」でPDF保存されるのを防ぎたい時にも有効です。

// 特定のキー操作をブロック
document.addEventListener('keydown', function(e) {
 // Ctrl + C、Ctrl + U、Ctrl + S など
 if (e.ctrlKey && ['c', 'u', 's'].includes(e.key.toLowerCase())) {
 e.preventDefault();
 }
});

🔍 ポイント：

• 「Ctrl+C」や「Ctrl+U」などのショートカットコピーやソース表示を防止
• ただし、キーボード操作を強制的にブロックするのはユーザー体験を損なう場合もあるため、慎重に使いましょう。

方法④：コピーしようとした時に警告を表示する

ユーザーが「Ctrl+C」や「右クリック→コピー」などの操作をした際に、即座に警告（アラート）を表示することで、コピー行為への心理的なブレーキをかけることができます。この方法は視覚的・感覚的に「禁止されている」と認識させる効果が高く、特に教材や有料コンテンツのページでの使用に向いています。

// コピー時にアラートを表示
document.addEventListener('copy', function(e) {
 alert('このページの内容はコピーできません。');
 e.preventDefault();
});

🔍 ポイント：

• 実際にコピーしようとした時に警告を出すことで抑止効果があります。
• コピー防止と同時に注意喚起ができるのがメリットです。

注意点：完全防止はできない

どの方法も、完全にコピーや右クリックを防げるわけではありません。

HTMLやCSSは基本的にブラウザ上で読み込まれてしまうため、開発者ツールやスクリーンショットなどを使えば情報は抜き取れてしまいます。

ただし、これらの対策は「意図的な盗用を減らすための心理的・技術的ハードル」として有効です。

まとめ｜コピー防止対策は「抑止効果」として取り入れるのがおすすめ

今回ご紹介したCSSやJavaScriptによるコピー防止・右クリック禁止の方法は、WordPressやKAJABIなど、コードを追加できる環境であれば簡単に導入可能です。

完全に不正コピーを防ぐことはできませんが、ちょっとした工夫で心理的な抑止力を働かせることができるため、「教材」「会員限定ページ」「有料記事」など、守りたいコンテンツに対しては非常に有効です。

ただし、過剰に制限するとユーザー体験を損ねる可能性もあるため、制限をかけるページは限定する・丁寧な文言を添えるなど、バランスを取りながら運用することがポイントです。

著作権を守るだけでなく、あなたのサイトの信頼性を守るためにも、できる範囲での対策を取り入れてみてはいかがでしょうか？