免费资源部落

经常有不少的朋友在我的博客里咨询与交流空间、域名等相关的问题，有些问题无法直接用语言说个明白，就得贴上图片了，例如一些程序报错、服务器崩溃等就需要贴上问题的截图才能解答了。之前博客评论已经设置插入图片了，但是只能使用外链。

后来升级了PHP 7后，发现原来评论插入图片的preg_replace函数已经被PHP 7给放弃了，就暂时关闭了评论插图。不过，最近发现不少的朋友在留言中对评论插图需求比较强烈，于是就按照官方的建议用preg_replace_callback代替了preg_replace。

同时，又发现了新的问题。因为用的是外链图片，有些相册引用的URL是不带Https的，而博客又都是全站Https，如果某一个页面的评论引用了一个未加密的图片，就会导致浏览器不会显示绿色加锁。于是，想到还不如给评论加上上传图片的功能，图片保存在自己的服务器上就没有什么问题了。

所以本篇文章就不分享一下用Comment Images Reloaded和Comment Attachment使用方法与效果，不想用插件的朋友也可以使用代码法搞定。更多的有关于Wordpress图片与评论加速的方法，还有：

• 1、WP评论优化：WordPress鼓励评论技巧:高亮作者Admin和添加评论者认证
• 2、图片：WordPress图片实现真正延迟加载-加快页面打开速度节省服务器资源
• 3、WordPress性能优化加速五大方法:PHP,MysqL优化和评论,图片静态文件加速

WordPress评论插入图片与附件-直接添加代码法和安装评论图片插件法

一、Wordpress评论插入图片代码法

1、这是在没有升级PHP 7以前用的方法，首先在需要插入图片的地方放入以下代码，一般是在comment.php文件的评论框上方。

1

<a href="javascript:embedImage();">插入图片</a>

2、进入到你的主题的functions.php添加以下代码：

1
2
3
4
5
6

//评论贴图
function embed_images($content) {
$content = preg_replace('/\[img=?\]*(.*?)(\[\/img)?\]/e', '"<a href=\"$1\"><img src=\"$1\" width=\"40%\" height=\"100\" alt=\"freehao123.com\" . basename("$1") . "\" onerror=\"this.src=\'/wp-content/themes/inews-v2/image/logo.png\'\" /></a>"', $content);
return $content;
}
add_filter('comment_text', 'embed_images');

3、上述代码中的width=\"40%\" height=\"100\" alt=\"freehao123.com\"内容都是可以自己设置的，加了一个onerror=，即当引用的图片不存在时就会显示默认图片。

4、同时，在网站引用的JS文件中或者自己直接新建一个JS文件中，添加在以下代码：

1
2
3
4
5
6
7

function embedImage() {
var URL = prompt('请输入图片 URL 地址:', 'https://');
if (URL) {
document.getElementById('comment').
value = document.getElementById('comment').value + '[img]' + URL + '[/img]';
}
}

5、这样，当评论者在点击插入图片时，就会弹出对话框，填入图片地址。

6、然后在评论框中就会有[img]xxx[/img]这样，其实手动添加代码也是一样的效果。

7、点击提交评论后，就可以看到在评论中显示图片了。为了达到更好的效果，你需要调整好图片的CSS样式。

二、PHP 7用preg_replace_callback替换preg_replace

1、上面的代码用了preg_replace，但是PHP 7已经放弃使用了preg_replace，官方建议是用preg_replace_callback。如果你用的是PHP 7 以上的，那么你可以使用以下贴图代码：

1
2
3
4
5
6

//评论贴图
function embed_images($content) {
	$content = preg_replace_callback('/\[img=?\]*(.*?)(\[\/img)?\]/',  function($matches) { return "<a href=\"$matches[1]\"><img src=\"$matches[1]\" width=\"40%\" height=\"100\" alt=\"" . basename("$matches[1]") . "\" onerror=\"this.src='/wp-content/themes/inews-v2/image/logo.png'\" /></a>";  } , $content );
return $content;
}
add_filter('comment_text', 'embed_images');

2、如果还在纠结要不要升级到PHP 7以上，看完了这篇文章也许可以打消你的顾虑：PHP 7安装使用体验:性能大提升,兼容性强,扩展支持不够,升级PHP要谨慎。

三、Comment Images Reloaded插件安装与使用

1、Comment Images Reloaded是一个支持Wordpress评论从本地上传图片的插件，使用插件有一个好处就是当你卸载插件后，你的评论中的图片就消失了，如果用上面的代码法，评论中会留下[img]\[/img]的字样。

• 1、插件官网：https://wp-puzzle.com/shop/plugins/
• 2、项目主页：https://wordpress.org/plugins/comment-images-reloaded/

2、安装了Comment Images Reloaded插件后，你的评论框会出现一个上传按钮，支持GIF, PNG, JPG, JPEG，

3、发布评论后，会在后台看到已经成功添加了图片了。

4、在Comment Images Reloaded的插件设置中，你可以设置缩略图大小、最大图片大小、最多可以上传数量、是否开放放大缩小或者手动添加代码等等。（点击放大）

四、Wordpress评论附件Comment Attachment

1、Comment Attachment官网：

• 1、项目主页：https://wordpress.org/plugins/comment-attachment/

2、Comment Attachment是Wordpress一个支持评论上传图片、文件、视频等附件，你可以用它当作评论插入图片的工具。

3、用Comment Attachment插入的图片会直接显示一个附件的链接，如果是图片则会直接显示出来。

4、在Comment Attachment的设置中，你可以设置上传按照显示的位置、最大允许上传大小、是否显示图片缩略图等。（点击放大）

5、如果显示图片的话，你可以设置显示图片大小，如果上传的是视频、音乐，是否一起插入视频音乐播放器等。

6、最下方就是Comment Attachment允许上传的附件类型的，视频、文档、音频、图片等格式都是可以选择的。

7、这是插入视频效果，可以直接播放。

8、这是插入音频效果，可以点击播放。

五、Wordpress评论插入图片附件问题

1、Wordpress评论插入图片使用代码法好处就在于少安装了一个插件，缺点就是如果你不想用了的话，那么原来通过[img]标签添加的图片地址还是会留在评论中，且有些用户可能找不到外链相册而放弃了引用图片。

2、Wordpress两个插件：Comment Images Reloaded和Comment Attachment方便实用，不过可能与你的主题评论存在冲突，如果你发现上传图片与附件按钮不自动出现，就要好好检查一下是不是和你的主题不兼容了。

文章出自：免费资源部落 / 版权所有。本站文章除注明出处外，皆为作者原创文章，可自由引用，但请注明来源。