【WordPress】携帯やスマホのコピペ対策「画像・文章のコピーガードCSS」紹介｜サイトのテキスト文字を盗用禁止にする方法

こちらの記事では、携帯やスマホの長押しで出来るテキストや画像のコピーガードするCSSコードを紹介しています。文章のコピペ盗用を防止したい方は、ぜひ参考にしてください。

コピーガードCSSコードの特徴

スマホのコピーを防止する

CSSコードを使うと、コピーガードプラグインで防げないスマホ(携帯)の長押しコピーを禁止することができます。PCでの右クリックも防ぎたい場合は、プラグインを導入してみましょう。

コピーガードCSSコード

記事全体のコピーガード

.entry-content {
user-select:none;
-moz-user-select:none;
-webkit-user-select:none;
-khtml-user-select:none;
}
.copyok {
user-select:all !important;
-moz-user-select:all !important;
-webkit-user-select:all !important;
-khtml-user-select:all !important;
}

上記のコピーガードCSSの「クリップボードにコピー」を押してコピーしてください。コピー後は無料テーマのCocoonや、有料テーマに搭載されている追加CSSに貼り付けると反映されます。

※大抵のテーマが外観の中にあるカスタマイズにあります。

一部をコピー可能にする方法

記事内のテキスト一部をコピー出来るようにしたい方は、使っているテーマに合わせて下記のコードを「テキスト部分」のサイドに貼り付けて下さい。

▼spanコード

<span class=”copyok”>テキスト</span>
 

▼divコード

<div class=”sp-danger copyok”>テキスト</div>
 

画像の右クリックとドラッグのガード

add_filter( 'wp_footer', function() { ?>
<script>
$(function() {
$('img').on('contextmenu oncopy', function() {
return false;
});
$('img').on('dragstart', function (e) {
e.stopPropagation();
e.preventDefault();
});
});
</script>
<?php });
 

画像のコピー(盗用)を防ぎたい場合は、上記のコードを</body>タグの直前に貼り付けましょう。

コピー防止は100％ではない

最後に、コピーガードは100％の確率で防ぐ事は出来ません。ソースコードを見れる方には、どのようなガードをしても中身が分かってしまうので、簡易なガード対策として割り切りましょう。

テキスト
 

関連記事

ネット情報の記事一覧