如何快速在WordPress中生成网站缩略图？Browser Shots插件与代码法

• Browser Shots
• 手动添加短代码
• 生成网站缩略图
• 网站截图的问题

这几天在部落问吧中添加了快速生成任意网址缩略图的功能，主要是为了方便在分享资源中不用再截图了，直接添加网址，然后发布文章时就可以看到该网址的截图，方便快捷。我们平时在Wordpress调用的一般都是日志的缩略图，但是对于生成网址缩略图我以前在Wordpress官网中看到。

WordPress官网中在展示优秀WP博客中就是自动生成该网站的截图的，本来想用Nginx来生成网址缩略图的，但是上网一搜索果然Wordpress很强大，早就已经有了Browser Shots这个自动生成网站缩略图的插件，安装后直接在编辑文章时点击插入缩略图，输入网址即可生成，而且还是动态的。

如果你的Wordpress也有这么一个需要，可以参考本文来安装Browser Shots体验一番，另外对于担心安装Wordpress过多的插件影响WP执行效率的朋友，也可以直接使用代码法。更多的有关于Wordpress一些优化技巧可以看看：

• 1、WP问答插件：优秀的WordPress在线问答插件AnsPress安装与使用
• 2、WordPress手机主题移动版优化方案-WPtouch安装使用及百度移动适配设置
• 3、优化:用Varnish和Memcached缓存给WordPress网站提速-内存级加速

如何快速在Wordpress中生成网站缩略图？Browser Shots插件与代码法

一、Browser Shots插件安装与使用

1、Browser Shots官网：

• 1、官方首页：https://wordpress.org/plugins/browser-shots/

2、Browser Shots插件安装完成后，在Wordpress编辑器就有一个按钮，点击这个按钮就可以添加网站缩略图了。

3、输入你想要生成缩略图的网站地址，可以设置好图片的高与宽，也可以设置好标题与描述。

4、点击发布后，你就可以看到Wordpress已经生成了网站的截图了。

二、手动添加Browser Shots短代码

1 、如果你使用的是Wordpress文本编辑器，你可以直接添加以下代码来生成网站缩略图。

1

[browser-shot url="http://www.lamuba.com"]

2、上面的代码默认的会生成600*600的图片,当然我们也可以自己指定高宽。

1

[browser-shot url="http://www.lamuba.com" width="400" height="400"]

3、Browser Shots默认的会指向缩略图网址超链接，你也可以指定某一个链接，代码如下：

1

[browser-shot url="http://www.lamuba.com" width="400" height="400" link="http://xxx.com"]

4、如果你想指定缩略图的标题，可以使用以下代码：

1

[browser-shot url="http://www.lamuba.com" width="400" height="400" link="http://xxx.com"]免费资源部落[/browser-shot]

三、Wordpress中生成网站缩略图代码法

1、如果你不想使用插件，那么可以将下列代码插入到functions.php文件中：

1
2
3
4
5
6
7
8
9
10
11
12

function wpb_screenshots($atts, $content = NULL) {
extract(shortcode_atts(array(
"snap" => 'https://s0.wordpress.com/mshots/v1/',
"url" => 'https://www.lamuba.com',
"alt" => 'screenshot',
"w" => '500', // width
"h" => '450' // height
), $atts));
$img = '<img alt="' . $alt . '" src="' . $snap . '' . urlencode($url) . '?w=' . $w . '&h=' . $h . '"/>';
return $img;
}
add_shortcode("screen", "wpb_screenshots");

2、使用方法如下:

1

[screen url=”http://www.lamuba.com” alt=”网站截图”]

3、默认的以上代码会生成一个500宽450高的图片，你也可以直接自己指定高宽。

1

[screen url=”http://www.lamuba.com” alt=”网站截图” w=”400″ h=”400″]

四、Wordpress网站缩略图问题

1、图片没有存储在本地。Browser Shots plugin用的是WordPress.com’s mshots API生成的缩略图，所以图片并没有存储在本地，而是在WordPress.com服务器上，一旦取消代码那么图片也就会消失了。

2、网站截图加载速度慢。这个主要还是因为要从Wordpress.com的服务器上加载图片，国内的话图片比较大的话，有时网页完全打开了才慢慢地加载出来网站截图，可能会影响网站的用户体验。

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