コンテンツをプロテクトしてくれるcss

皆さまご機嫌よう。
以前、画像の右クリック、ドラッグ&ドロップ禁止のプラグインのご紹介をしましたが、私のワードプレスのテーマといつのまにか互換性が無くなってしまったのでしょうか?原因不明なのですが、全く効いていないことに最近気付きました((((( ;゚Д゚)))ガクガクブルブル

そこで今回は、一行でコンテンツをプロテクトしてくれるcssのご紹介です。

コンテンツをプロテクトしてくれるcss

そんな魔法の一行がこちらです。↓↓↓


img {
  pointer-events: none;
}//すべての画像のマウスイベント (クリック、ドラッグ、ホバー等) を無効にする

今までプロテクト系プラグインをネットで探し、インストールして設定したりしていた手間が、imgにこの一行を設定しただけであっさり解決してしまいました(笑)

更に、本文もプロテクトしたいという場合はこちら↓↓↓


  user-select: none;//テキストを選択不可にする
  touch-callout: none;//タッチデバイスで長押しした時のポップアップメニューの表示を無効

私の場合は、ソースコードもコピー不可ですと使い勝手がよくないので画像だけにしておりますが、こちらも本文などに対して設定すればより強力ですね。

あとは、画像にウォーターマーク(透かし)も入れておくのもオススメです!
参考までにどうぞ→ 画像を守るワードプレスプラグイン No Right Click Images Plugin、Easy WaterMark、Image Watermark

これでひとつ、無駄にプラグインを入れる必要がなくなりスッキリです!

プラグインはとても便利ですが、ワードプレスのアップデート後に互換性が無くなってしまったり、プラグイン同士のコンフリクトでうまく動かないこともありますので、できるだけ最小限にしておきたいものですね。

これからはプラグインを探す前に、まず自分で修正できる方法を探してみようと思います(^^)

コメントを残す