图像和屏幕截图是任何 WordPress 博客中的关键元素。特别是，屏幕截图可以让您突出显示其他页面的关键方面。但是，截取完美的浏览器屏幕截图并将其添加到您的帖子中可能会很麻烦。虽然您可以根据操作系统 (OS) 完成任务，但始终如一地截取屏幕截图是一项挑战。
输入浏览器截图插入。这使您可以在不离开 WordPress 编辑器的情况下截取任何网站。如果您的耳朵对此感到不舒服，您可能需要继续阅读。
让我们看看它是如何工作的！
浏览器截图插件介绍
> /p>
浏览器屏幕截图可以说是一个小众插件，值得在您的网站上占有一席之地。它允许您在不离开 WordPress 编辑器的情况下获取任何页面的动态浏览器屏幕截图。这适用于经典编辑器和块编辑器，具体取决于您的首选选项。这与操作系统原生解决方案形成对比，后者要求您在平台之外打开新的浏览器窗口并进一步优化图像。
如果使用经典编辑器，浏览器屏幕截图允许您使用自定义短代码来生成您想要的镜头。您可以将多个屏幕截图添加到任何页面或帖子，这些屏幕截图也适用于块编辑器。
由于该插件会动态生成屏幕截图，因此当您不想为您的内容使用过时的镜头时，它是完美的选择。如果您的页面或帖子包含“浏览器屏幕截图”短代码或块，您的访问者将看到实时屏幕截图。对于某些类型的内容，这是一个诱人的提议。
无论您使用哪种方法，该插件还可以让您自定义您截取的浏览器屏幕截图的分辨率。您还可以向图像添加替代文本和文本，以及自定义 CSS 类。
但是，重要的是要了解此插件只采用“最佳”浏览器屏幕截图。这意味着将不会显示需要滚动到的区域。该区域的大小取决于您为每个浏览器屏幕截图配置的参数，稍后您将了解如何操作。
主要特点：
- 使用短代码或代码块在浏览器窗口中自定义任何网站的截图。
- 将浏览器屏幕截图添加到您的内容中，而无需手动截取或上传它们。
- 自定义浏览器屏幕截图的分辨率。
- 向插件生成的图像添加自定义 CSS 类。
- 向图像添加链接和替代文本。
价格：免费 |更多信息
如何使用浏览器截图插件（2种方法）
至此您已经了解了浏览器截图插件的工作原理，让我们来讨论如何使用它。短代码是这个插件的基本组成部分，所以让我们先看一下。
1.使用短代码生成动态浏览器屏幕截图
浏览器屏幕截图插件使您能够使用以下自定义短代码生成动态浏览器快照：
[browser-shot url="elegantthemes .com"宽度="600" height="400"]
短代码包含两个基本参数：宽度和高度。两个参数都使用像素值，插件以 600x400 的默认分辨率捕获。当然，您还需要将要截屏的特定 URL 添加到短代码中。
无论您使用块编辑器还是经典编辑器，短代码都会呈现类似于以下的屏幕截图：
但是，浏览器屏幕截图还允许您设置多个自定义参数。除了宽度和高度，这些还包括以下内容：
- Alternative：此参数允许您为屏幕截图设置替代文本。
- 链接：您可以使用此参数来选择图像将指向的链接（可能与镜头来源不同）。
- 目标：使用该参数控制图片链接是否在新窗口打开。
例如，这里是完整的简码，所有参数如下：
[browser-shot url="http ://www. google.com"宽度="700" height="500" alt="谷歌主页" link="http:// www.otherwebsite.com"]
您还可以使用简码手动添加字幕：
[浏览器- shot url="http://www.google.com"宽度="700" height="500" alt="谷歌主页" link=& ;quot;http://www.otherwebsite.com"] 这就是标题[/browser-shot]
在大多数情况下，你会使用这两个最重要的参数是宽度和高度。对所有浏览器屏幕截图使用相同的值通常不会返回最佳结果，因此您需要调整参数以适应内容。
2.使用块将屏幕截图添加到您的网站
如果您使用块编辑器，浏览器屏幕截图插件将使您能够访问服务器快照“新块：
< p> 选择“屏蔽”会提示插件询问您要使用哪个网站生成截图，本例使用亚马逊美国主页：
单击“查找图像”后，插件将“截取”屏幕截图并将其显示在块编辑器中：
需要注意的是，该插件无法访问私密页面，也无法为您登录。对于这些类型的浏览器屏幕截图，您将不得不自己做一些肮脏的工作。
继续前进，在该屏幕截图的右侧，您可以看到 Block Details 选项卡。这允许您移动在不添加自定义短代码的情况下修改我们之前讨论的所有参数。
使用块编辑器修改浏览器屏幕截图的宽度和高度要简单得多。这是因为编辑器允许您通过单击高度和宽度参数下方的刷新图像按钮来查看预览：
如果并排比较这两个示例，您可以看到分辨率的变化如何修改插件为您捕获的区域。除此之外，您还可以为屏幕截图添加自定义链接，配置是否在新标签页中打开它们，并在此处设置自定义 CSS 类。
结论
如果您定期在博客内容中包含浏览器屏幕截图，浏览器屏幕截图插件可以为您节省大量时间。这是一个相当小众的插件，但如果您属于我们提到的人群，它将大大简化编辑帖子的过程。
浏览器屏幕截图可让您使用简单的短代码或块编辑器添加浏览器的屏幕截图。对于短代码，该插件包含几个参数，允许您自定义屏幕截图，例如宽度、高度甚至 alt（用于替代文本）。
您对浏览器截图插件的使用有疑问吗？让我们在下面的评论部分讨论它们！
VectorMine/shutterstock.com 的文章缩略图
资源
