如何在没有插件的情况下添加 WordPress 相关帖子

注意：本文最初发布于 2012 年 6 月 7 日。

使用 WordPress 的一大优势是插件。WordPress 插件涵盖了几乎所有您能想到的东西，从将您的博客扩展到 CMS，到添加漂亮的功能和针对搜索引擎优化您的博客——可能性是无穷无尽的（我们不要忘记所有不同的主题）。

但是通过使用太多插件，您会冒着堵塞 WordPress 博客的风险，最坏的情况下，您可能会“破坏”它。有许多插件彼此不兼容，还有一些插件会减慢您的博客速度。

一些最流行的 WordPress 插件类别是基于向博客添加“相关帖子”。由于 WordPress 对此没有任何标准，因此每个人都需要使用某种插件来在其网站上显示相关帖子。

本文将教您如何在不使用任何插件的情况下将带有缩略图的相关帖子添加到您的博客，从而使一切变得简单、轻便和易于访问。让我们开始吧！

无插件方法

出于多种原因，您应该始终尝试使用 WordPress 的内置代码和服务，而不是插件。主要好处是您不必依赖第三方（插件开发人员）来让您的博客正常运行。

有许多流行插件被其开发人员放弃的案例，导致无数网站所有者只能使用过时且可能易受攻击的软件。

另一个原因是您不会冒使用臃肿插件的风险，该插件可能会减慢您的网站速度，甚至更糟，包含一段恶意代码，尽管如果您从官方 WordPress 目录获取插件，这种情况很少见.

开始使用

与大多数其他功能一样，这个“相关帖子”功能旨在放置在您的主要文章页面 (single.php) 上，但您几乎可以在任何地方使用它，只要您将它保持在 WordPress 循环中即可。

为了获得相关的帖子，我们将使用为个别文章提供的帖子标签。

缩略图

WordPress 现在有一个内置的缩略图系统，我们在这里需要它。为了启用它，请将此代码添加到主题文件夹中的 functions.php 文件（在大多数情况下，它已经存在）。

add_theme_support( 'post-thumbnails' );

您还可以通过在代码中添加另一行来设置缩略图的宽度和高度：

add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 100, 50, true );

重要提示：将图片添加到帖子时，为了创建缩略图，您必须在图片上传面板中选择“用作特色图片”。这将为帖子创建缩略图。

密码

<div class="relatedposts">
<h4>Related posts</h4>
<?php
  $orig_post = $post;
  global $post;
  $tags = wp_get_post_tags($post->ID);
   
  if ($tags) {
  $tag_ids = array();
  foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
  $args=array(
  'tag__in' => $tag_ids,
  'post__not_in' => array($post->ID),
  'posts_per_page'=>4, // Number of related posts to display.
  'caller_get_posts'=>1
  );
   
  $my_query = new wp_query( $args );
 
  while( $my_query->have_posts() ) {
  $my_query->the_post();
  ?>
   
  <div class="relatedthumb">
    <a rel="nofollow" target="_blank" href="<? the_permalink()?>"><?php the_post_thumbnail(array(150,100)); ?><br />
    <?php the_title(); ?>
    </a>
  </div>
   
  <? }
  }
  $post = $orig_post;
  wp_reset_query();
  ?>
</div>

这段代码the_post_thumbnail(array(150,100)设置了将要显示的缩略图的大小，在本例中，宽度为 150 像素，高度为 100 像素。

CSS

我们这里有两个 div 类，“.relatedposts”，它是整个 div 容器，以及“.relatedthumb”，它是 .relatedposts 中的单独缩略图和链接。我们假设帖子的宽度是标准的 640px。CSS：

1个
2个
3个
4个
5个
6个

.relatedposts {width: 640px; margin: 0 0 20px 0; float: left; font-size: 12px;}
.relatedposts h4 {font-size: 20px; margin: 0 0 5px 0; }
.relatedthumb {margin: 0 1px 0 1px; float: left; }
.relatedthumb img {margin: 0 0 3px 0; padding: 0;}
.relatedthumb a {color :#333; text-decoration: none; display:block; padding: 4px; width: 150px;}
.relatedthumb a:hover {background-color: #ddd; color: #000;}

上面的 CSS 将呈现宽度为 150px 的帖子缩略图，这意味着我们需要 4 个缩略图来填充帖子的 640px 宽度（包括它们之间的边距）。您可以根据需要进行调整；如果您想要 5 个缩略图，则 .relatedthumb 宽度需要大约 125 像素。

重要提示：请务必将在 WordPress 媒体设置中生成的缩略图的宽度设置为与您在 CSS 中设置的宽度相匹配。此外，它必须与 php 代码中指定的大小相匹配：the_post_thumbnail(array(150,100).

输出示例

相关帖子应该看起来像这样，正如游戏博客 DigitalBattle 使用的那样（它使用了本文中描述的确切技术）：

结论

我们可以使用 WordPress 提供的内置功能做很多事情，而且在许多情况下，我们不需要求助于第三方插件来完成工作。

下次您的 WordPress 博客需要插件时，看看您是否可以在没有插件的情况下实现相同的功能。四处挖掘，在网上搜索替代方案。您会惊讶于 WordPress 开箱即用的可能性。