🚀 サイト構築が難しい?手取り足取りご案内します——「WordPressサイト構築伴走」サービスを詳しく見る →

WordPressで画像をアップロード時に自動的にウォーターマークを追加する方法まとめ

皆さん、こんにちは。レイフェンゴです。今日はWordPress 画像ウォーターマーク追加のプラグイン紹介と方法についてお話しします。画像にウォーターマークを追加すること自体は技術的に難しいことではありません。画像にウォーターマークを追加する目的は、一方で画像の盗用を防ぎ、もう一方でウェブサイトの知名度を高めるためです。

WordPress画像アップロード時にウォーターマークを追加するプラグインの推奨

もし毎回画像にウォーターマークを追加するのが面倒であれば、プラグインを使用することで自動的にウォーターマークを追加できます。WordPressプラットフォームで自動的にウォーターマークを追加するプラグインは多くありますが、ここでは使用して効果の良かった2つのプラグインをお勧めします。

プラグイン推奨1:DX-Watermark

DX-Watermark これは非常に古い画像ウォーターマークプラグインです。作者は6年間更新していませんが、使用上はすべて正常です。テキストウォーターマークと画像ウォーターマークの追加をサポート DX-Watermarkがサポートする機能:
  1. タイプ:テキストまたは画像ウォーターマークの2種類から選択可能。デフォルトはテキスト。
  2. 無視:画像サイズが設定値より小さい場合、ウォーターマークを追加しません。
  3. 位置:ウォーターマークの9つの位置を設定。デフォルトは右下。
  4. 水平調整、垂直調整:ウォーターマークの水平および垂直オフセットを調整。負の値は左または上へのオフセットを意味します。
  5. フォント: フォントファイルはサイズが大きいため、プラグインにはいくつかのフォントのみが組み込まれています。ユーザーは .ttf フォントファイルを wp-content/uploads/dw-uploads/fonts/ ディレクトリにアップロードできます。
  6. テキスト: 透かしとして表示するテキストを入力します。
  7. サイズ: テキスト透かしの表示サイズを入力します。
  8. 色: 表示されるカラーパレットからテキスト透かしの色を選択します。
  9. 透明度: 0は完全に透明、100は不透明を意味します。
  10. プラグインの管理画面ではプレビュー機能が提供されており、ユーザーは効果を確認してから保存できます。
ダウンロードリンク

プラグイン推奨2:image-watermark

image-watermark の特徴的な機能は、以前にアップロードした画像にも透かしを追加できることです。機能面では同様に透かしの位置をサポートし、透明度を制御できます。 image-watermarkがサポートする機能:
  1. 透かしの位置を選択;
  2. 透明度を調整可能;
  3. 新旧のアップロード画像の両方に透かしを追加可能;
  4. 画像の右クリックによるコピーを禁止。
ダウンロードリンクimage-watermark日本語版のダウンロード先:https://www.lanzous.com/i6jzuni

同様のプラグインは他にもいくつかあり、どれも大同小異ですが、上記の2つはユーザーが使用して比較的良好な評価を得ており、しかも無料です。

プラグイン推奨3:WPWaterMark

WPWaterMarkは、中国のブロガー老蒋が制作した、WordPressに透かしを追加するプラグインで、完全に中国語対応です。
  1. WordPressプログラムに基づいており、ユーザーに無料で提供され、画像透かし機能を強化し、記事や画像の盗用を防止し、少なくとも透かしを残すことで、盗難防止能力を強化します;
  2. 九宮格、ランダム九宮格、全面敷き詰め透かしの3種類の効果から選択可能で、少なくとも現在、ネット上で数少ないプラグインの一つです;
  3. 軽量透かしプラグインは、テキスト、画像透かしの設定をサポートし、回転角度や透明度などの一般的な機能を設定できます。
ダウンロードリンク githubダウンロード

WordPress画像アップロード時にウォーターマークを追加するプラグイン不要の方法:

もしインストールすることがWordPressプラグインリソースの無駄だと思うなら、以下の方法で手動でファイルを作成し、自動的に画像透かしを追加することもできます(実際にはプラグインの原理と同じです) 1. テーマディレクトリ内にclassフォルダを作成し、image.phpファイルをその中に置きます 2. functions.php ファイルを開き、以下のコードを追加します: 参考:functions.phpファイルにコードを安全に追加する方法:Code Snippets
/**
* WordPress上传图片添加水印
*/
function uimoban_watermark($attachment_ID)
{
$attachment = get_post($attachment_ID);
switch($attachment->post_mime_type){
case 'image/jpeg':
case 'image/png':
case 'image/gif':
require THEME_FILES . '/class/image.php';
$image = new image(true);
$image->set('watermark.png', 1);
$image->watermark($attachment->guid);
break;
default:return ;
}
}
add_action('add_attachment', 'uimoban_watermark');
説明:$image->set('watermark.png', 1);の„watermark.png“は透かし画像を指定しており、最初のステップのコード内のdata/watermark/ディレクトリにあるwatermark.pngと一致させる必要があります。もちろん、自分で変更することもできます。„1“は透かしの位置を表します。

WordPress又拍雲/七牛でウォーターマークを追加する方法:

一部のユーザーは又拍雲/七牛の画像ホスティングサービスを使用していますが、又拍雲/七牛自体が透かし設定をサポートしています。WordPressに透かしを追加した画像を呼び出させるには、以下の方法をさらに使用する必要があります。

又拍雲自動ウォーターマーク追加

1. functions.php ファイルを開き、以下のコードを追加します:
/**
* 又拍云图片添加水印
*/
function fa_hack_image_url($matches) {
    $prefix = '!boob';// 自定义版本或者水印字符串
    return $matches[1] . $matches['2'] . $prefix;
}

function fa_image_add_watermelon( $content ){
    $content = preg_replace_callback("/(<img[^>]*src *= *[\"']?)([^\"']*)/i", 'fa_hack_image_url' , $content);
    return $content;
}
add_filter('the_content','fa_image_add_watermelon');
2. 次に、又拍雲のウォーターマークルールを設定し、サムネイル作成時にウォーターマークを設定します。生成されたウォーターマークのURLは、自分でURLを組み立てることができます:/watermark/url/ウォーターマークパスbase64/align/southeastウォーターマークのパスはbase64エンコードする必要があります。例えば、パスが/watermark.pngの場合、base64に変換するとL3dhdGVybWFyay5wbmc=となります。その場合、画像に追加する必要があるサフィックスは:!/watermark/url/L3dhdGVybWFyay5wbmc=/align/southeastalignの後ろは方向です。自分の必要に応じて調整できます。もちろん、最も簡単なのは新しいルールを作成するときに設定することです。

七牛自動ウォーターマーク追加

1. functions.php ファイルを開き、以下のコードを追加します:
add_filter('the_content', 'QiNiuThumbnail');
function QiNiuThumbnail($content) {
global $post;
$pattern ="/<img(.*?)src=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>/i";
/* 下面这行代码中的300表示缩略图的大小,请根据实际需求修改即可 */
$replacement = '<img$1src=$2$3.$4?imageMogr2/thumbnail/300x$5$6>';
$content = preg_replace($pattern, $replacement, $content);
/* 此处预留位置,可删除 */
return $content;
}
PS:上記のコード内の?imageMogr2/thumbnail/300xを必要な文字列に置き換えて画像処理を完了してください。 2. 七牛の管理画面で新しい画像スタイルを作成し、画像ウォーターマークスタイルまたは文字ウォーターマークスタイルを作成します。上記の方法は張戈博客と fatesinger を参考にしています。 面倒でなければ、手動で画像にウォーターマークを追加することもできます。オンラインウォーターマーク追加ツールやPSを使用できます。なぜなら、自動ウォーターマーク追加では、ウォーターマークが画像の重要な部分を覆ってしまうことがあるからです。 パソコンで画像に一括ウォーターマークを追加するには、XnConvertというソフトウェアを使用できます:Macで画像の一括サイズ変更、ウォーターマーク追加、回転を行う方法(Windows版もあります。記事は当初Mac版について書いただけです。)

🚀 チュートリアルを見てもまだ迷っていますか?私が手取り足取りご案内しましょう

「WordPressサイト構築伴走」——ドメイン選び、ホスティング購入から、テーマのインストール、公開、投稿まで、すべてのステップで私が伴走します。遠回りせず、目標に直行できます。

👉 サイト構築伴走サービスを詳しく見る
🔒

コメントは終了しました

この記事のコメント機能は終了しています。ご質問がある場合は、他の方法でお問い合わせください。

×
二维码

QRコードをスキャンしてフォロー

AIサイト構築アシスタント

🤖
こんにちは!私はNaibaサイト構築ノートのAIアシスタントです。何かお手伝いできることはありますか?
クイックコンサルティング: