KindEditor 是一套开源的在线HTML编辑器,开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本输入框。可以无缝地与 Java、.NET、PHP、ASP 等程序集成,比较适合在 CMS、商城、论坛、博客、Wiki、电子邮件等互联网应用上使用。
主要特点:
快速:体积小,加载速度快
开源:开放源代码,高水平,高品质
底层:内置自定义 DOM 类库,精确操作 DOM
扩展:基于插件的设计,所有功能都是插件,可根据需求增减功能
风格:修改编辑器风格非常容易,只需修改一个 CSS 文件
兼容:支持大部分主流浏览器,比如 IE、Firefox、Safari、Chrome、Opera
转到正题,默认的编辑器上传图片时,是没有水印功能的,下面详细介绍:
第一步:修改upload_json.php文件
在编辑器的/php/目录下可以找到这个文件,新增一个函数:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
|
/* * 功能:PHP图片水印,水印支持图片或文字 * 参数: * $groundImage 背景图片,即需要加水印的图片,暂只支持GIF,JPG,PNG格式; * $waterPos 水印位置,有10种状态,0为随机位置; * 1为顶端居左,2为顶端居中,3为顶端居右; * 4为中部居左,5为中部居中,6为中部居右; * 7为底端居左,8为底端居中,9为底端居右; * $waterImage 图片水印,即作为水印的图片,暂只支持GIF,JPG,PNG格式; * $alpha 水印透明度,取值1-100; * $waterText 文字水印,即把文字作为为水印,支持ASCII码,不支持中文; * $textFont 文字大小,值为1、2、3、4或5,默认为5; * $textColor 文字颜色,值为十六进制颜色值,默认为#FF0000(红色); * * $waterImage 和 $waterText 最好不要同时使用,选其中之一即可,优先使用 $waterImage。 * 当$waterImage有效时,参数$waterString、$stringFont、$stringColor均不生效。 * 加水印后的图片的文件名和 $groundImage 一样。 */ function imageWaterMark( $groundImage , $waterPos =0, $waterImage = '' , $alpha =80, $waterText = '' , $water_fontfile , $textFont =9, $textColor = '#FF0000' ){ $isWaterImage = FALSE; $formatMsg = '不支持该图片格式!请使用GIF、JPG、PNG格式的图片。' ; $fontFile = $water_fontfile ; //读取水印文件 if (! empty ( $waterImage ) && file_exists ( $waterImage )){ $isWaterImage = TRUE; $water_info = getimagesize ( $waterImage ); $water_w = $water_info [0]; //取得水印图片的宽 $water_h = $water_info [1]; //取得水印图片的高 switch ( $water_info [2]){ //取得水印图片的格式 case 1: $water_im = imagecreatefromgif( $waterImage ); break ; case 2: $water_im = imagecreatefromjpeg( $waterImage ); break ; case 3: $water_im = imagecreatefrompng( $waterImage ); break ; default : die ( $formatMsg ); } } //读取背景图片 if (! empty ( $groundImage ) && file_exists ( $groundImage )){ $ground_info = getimagesize ( $groundImage ); $ground_w = $ground_info [0]; //取得背景图片的宽 $ground_h = $ground_info [1]; //取得背景图片的高 switch ( $ground_info [2]){ //取得背景图片的格式 case 1: $ground_im = imagecreatefromgif( $groundImage ); break ; case 2: $ground_im = imagecreatefromjpeg( $groundImage ); break ; case 3: $ground_im = imagecreatefrompng( $groundImage ); break ; default : die ( $formatMsg ); } } else { alert( "水印图片不存在!" ); } //水印位置 if ( $isWaterImage ){ //图片水印 $w = $water_w ; $h = $water_h ; $label = "图片的" ; } else { //文字水印 $temp = imagettfbbox( $textFont , 0, $fontFile , $waterText ); //取得使用 TrueType 字体的文本的范围 $w = $temp [2] - $temp [6]; $h = $temp [3] - $temp [7]; unset( $temp ); $label = "文字区域" ; } if (( $ground_w < $w ) || ( $ground_h < $h )){ echo "需要加水印的图片的长度或宽度比水印" . $label . "还小,无法生成水印!" ; return ; } switch ( $waterPos ){ case 0: //随机 $posX = rand(0,( $ground_w - $w )); $posY = rand(0,( $ground_h - $h )); break ; case 1: //1为顶端居左 $posX = 0; $posY = 0; break ; case 2: //2为顶端居中 $posX = ( $ground_w - $w ) / 2; $posY = 0; break ; case 3: //3为顶端居右 $posX = $ground_w - $w ; $posY = 0; break ; case 4: //4为中部居左 $posX = 0; $posY = ( $ground_h - $h ) / 2; break ; case 5: //5为中部居中 $posX = ( $ground_w - $w ) / 2; $posY = ( $ground_h - $h ) / 2; break ; case 6: //6为中部居右 $posX = $ground_w - $w ; $posY = ( $ground_h - $h ) / 2; break ; case 7: //7为底端居左 $posX = 0; $posY = $ground_h - $h ; break ; case 8: //8为底端居中 $posX = ( $ground_w - $w ) / 2; $posY = $ground_h - $h ; break ; case 9: //9为底端居右 $posX = $ground_w - $w ; $posY = $ground_h - $h ; if (! $isWaterImage ){ $posY = $ground_h - $h -20; } break ; default : //随机 $posX = rand(0,( $ground_w - $w )); $posY = rand(0,( $ground_h - $h )); break ; } //设定图像的混色模式 imagealphablending( $ground_im , true); if ( $isWaterImage ){ //图片水印 //imagecopy($ground_im, $water_im, $posX, $posY, 0, 0, $water_w,$water_h);//拷贝水印到目标文件 //生成混合图像 imagecopymerge( $ground_im , $water_im , $posX , $posY , 0, 0, $water_w , $water_h , $alpha ); } else { //文字水印 if ( ! empty ( $textColor ) && ( strlen ( $textColor )==7)){ $R = hexdec( substr ( $textColor ,1,2)); $G = hexdec( substr ( $textColor ,3,2)); $B = hexdec( substr ( $textColor ,5)); } else { die ( "水印文字颜色格式不正确!" ); } imagestring( $ground_im , $textFont , $posX , $posY , $waterText , imagecolorallocate( $ground_im , $R , $G , $B )); } //生成水印后的图片 @unlink( $groundImage ); switch ( $ground_info [2]){ //取得背景图片的格式 case 1:imagegif( $ground_im , $groundImage ); break ; case 2:imagejpeg( $ground_im , $groundImage ,100); break ; //注意这里的100,经测试,100是图片质量最佳的,但文件大小会增加很多,95的时候质量还不错,大小和原来的差不多。作者采用95的值。 case 3:imagepng( $ground_im , $groundImage ); break ; default : die ( $errorMsg ); } //释放内存 if (isset( $water_info )) unset( $water_info ); if (isset( $water_im )) imagedestroy( $water_im ); unset( $ground_info ); imagedestroy( $ground_im ); } |
第二步:找到$json = new Services_JSON();注意有两个地方,不是在alert函数里的那个,添加如下代码:
1
2
3
4
5
6
7
8
9
10
11
|
/* 水印配置开始 */ $water_mark = 1; //1为加水印, 其它为不加 $water_pos = 9; //水印位置,10种状态【0为随机,1为顶端居左,2为顶端居中,3为顶端居右;4为中部居左,5为中部居中,6为中部居右;7为底端居左,8为底端居中,9为底端居】 $water_img = $_SERVER [ 'DOCUMENT_ROOT' ]. '/upfiles/water.gif' ; //水印图片,默认填写空,请将图片上传至网站根目录的upfiles下,例: water.gif $water_alpha = 50; //水印透明度 $water_text = '' ; //水印字符串,默认填写空; //$water_fontfile = $_SERVER['DOCUMENT_ROOT'] .'/upfiles/fonts/arial.ttf';//文字水印使用的字体; if ( $water_mark == 1){ imageWaterMark( $file_path , $water_pos , $water_img , $water_alpha , $water_text , $water_fontfile ); } /* 水印配置结束 */ |
经本人测试可以正常使用,另外一点请注意水印图片的路径,根据实际情况而定。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。