如何在 WordPress 文章中自动生成网站截图：两种纯代码方法

在建立分享类或模板类网站时，批量生成网站截图可能是一个非常耗时的工作。然而，通过一些简单的代码，你可以在 WordPress 文章中自动生成网站的缩略图。这不仅提高了效率，还能确保网站截图显示的一致性。本文将介绍两种使用纯代码实现自动获取网站截图的方法。

方法一：通过短代码自动生成网站截图

此方法可以通过短代码在 WordPress 文章中灵活插入网站截图。我们只需在主题的 functions.php 文件中添加几行代码即可。

步骤：

1. 打开你正在使用的 WordPress 主题的 functions.php 文件。
2. 将以下代码添加到文件中：

   function wp_screenshot($atts, $content=null){
       extract(
           shortcode_atts(
               array(
                   "shots" => "https://s0.wordpress.com/mshots/v1/",
                   "url" => "https://www.wpbeginner.com",
                   "width" => "600",
                   "height" => "450",
                   "alt" => "screenshot"
               ),
               $atts
           )
       );
   
       $img = '<div class="wp-shot"><a href="' . $url . '" rel="external nofollow noopener noreferrer" target="_blank"><img src="' . $shots . '' . urlencode($url) . '?w=' . $width . '&h=' . $height . '" alt="' . $alt . '" /></a></div>';
       return $img;
   }
   add_shortcode("shot", "wp_screenshot");
   

   使用方法：在发表文章时，你只需在文章内容中添加以下短代码：

   [shot url="https://www.baidu.com/"]

   如果你想自定义截图的大小，可以通过 width 和 height 参数进行设置：

   [shot url="https://www.baidu.com/" width="600" height="450"]

   这样，系统就会自动生成指定网站的截图，并插入到文章中。

方法二：直接链接方式生成网站截图

如果你希望使用更简单的方法，你可以直接使用网站截图服务提供的链接格式，将生成的截图像普通图片一样插入到文章中。

步骤：

• 获取截图的基本格式：

  https://s0.wordpress.com/mshots/v1/https://baidu.com/?w=600&h=45

• 将此链接复制到文章编辑器中，使用 "从 URL 插入" 功能插入到文章中。这就像插入普通图片一样简单。

示例：

<img src="https://s0.wordpress.com/mshots/v1/https://baidu.com/?w=600&h=450" alt="网站截图">

温馨提示：

• 首次加载：由于截图是即时生成的，可能会在首次加载时看不到图片。你可以刷新页面，或多次刷新以确保截图加载。
• 存储与加载速度：生成的截图存储在 WordPress.com 的服务器上，这意味着不会占用你自己网站的服务器空间。不过，由于生成过程和加载路径，加载速度可能稍慢。

方法的实际应用场景：

1. 模板分享网站：在展示网站模板时，自动生成截图可以让用户快速预览模板外观，提升用户体验。
2. 资源推荐类网站：展示推荐的工具或网站截图，增加直观性，帮助访客快速了解推荐内容。
3. 内容创作者：如果你经常撰写关于网站或工具介绍的文章，自动生成截图可以节省大量时间，减少手动截图和上传图片的麻烦。