如何在WordPress中基于帖子类别设置后备特色图片

Recently, one of our users asked us how they can set default fallback post thumbnail for specific categories in WordPress. In our previous tutorial, we showed how to set a default fallback image for WordPress post thumbnails tutorial. In this article, we will show you how to set default fallback featured image for specific categories in WordPress.

最近,我们的一位用户问我们如何为WordPress中的特定类别设置默认后备帖子缩略图。 在之前的教程中,我们展示了如何为WordPress帖子缩略图教程设置默认的备用图片 。 在本文中,我们将向您展示如何为WordPress中的特定类别设置默认的后备功能图片。

Displaying category images in WordPress when no post thumbnail is found

Note: This is an intermediate level tutorial that will require you to know HTML, CSS, and the basics of WordPress theme structure.

注意:这是中级教程,需要您了解HTML,CSS和WordPress主题结构的基础知识。

Scenario:

场景:

Let’s say you have a blog where you assign a single category to each of your post (check out our guide on Categories vs Tags). You can show a fallback image based on which category a post is assigned to.

假设您有一个博客,在其中您为每个帖子都分配了一个类别(请参阅有关类别与标签的指南)。 您可以根据帖子分配到的类别显示后备图像。

It is particularly useful when you are often faced with situation when there is no featured image available for a post. Your branded image may not match the theme of the post, but if you are using a category specific image, then it will still look relevant.

当您经常遇到没有可用的特色图片的情况时,此功能特别有用。 您的品牌形象可能与帖子的主题不符,但是如果您使用的是类别特定的形象,则看起来仍然很相关。

在没有插件的情况下在WordPress中设置类别图像 (Setting Category Images in WordPress without a Plugin)

Previously on WPBeginner, we showed you to set category images in WordPress. However, for this tutorial you would need to set up category images manually without a plugin. Check out our Theme Cheat Sheet tutorial and beginner’s guide to pasting snippets in WordPress.

以前在WPBeginner上,我们展示了如何在WordPress中设置类别图像 。 但是,对于本教程,您将需要在没有插件的情况下手动设置类别图像。 查看我们的主题备忘单教程和WordPress中粘贴代码片段的初学者指南。

First thing you need to do is create images for your categories. Use category slug as your image file name and save them all in the same format, e.g. jpg or png.

您需要做的第一件事是为类别创建图像。 使用类别Slug作为图像文件名,并将它们全部保存为相同格式,例如jpg或png。

Now the problem is that your WordPress theme may be using different image sizes in different templates. Like for example, you may have smaller post thumbnails on the archive pages and larger featured images on the single posts. We will let WordPress handle the re-sizing of images. To do that you need to upload your category images to your WordPress site from Media » Add New. During the upload, WordPress will store your category images, and create sizes defined by your theme and those under Settings » Media screen.

现在的问题是,您的WordPress主题可能在不同的模板中使用了不同的图像大小 。 例如,您在存档页面上的缩略图可能较小,而在单个帖子上的特征图像则较大。 我们将让WordPress处理图像的调整大小。 为此,您需要从Media»Add New将类别图片上传到WordPress网站。 在上传过程中,WordPress将存储您的类别图片,并创建由您的主题以及“设置”»“媒体”屏幕下的图片定义的尺寸。

After uploading category images, you need to move them to a different directory. Connect to your website using an FTP client like Filezilla and go to /wp-content/uploads/ folder. The category images you uploaded will be stored in the month folder. Example: /uploads/2013/12/

上传类别图片后,您需要将它们移动到其他目录。 使用FTP客户端(如Filezilla)连接到您的网站,然后转到/wp-content/uploads/文件夹。 您上传的类别图像将存储在month文件夹中。 示例: /uploads/2013/12/

Create a folder on your computer’s desktop and name it category-images. Now download all your category images and all the sizes WordPress created for them to this new folder on your desktop. Once the download is finished, you need to upload the category-images folder to your /wp-content/uploads directory. Doing this will allow you to have all your category image sizes in a separate folder which is easy to call into your theme.

在计算机的桌面上创建一个文件夹,并将其命名为category-images。 现在,将所有类别图像和WordPress为它们创建的所有大小下载到桌面上的此新文件夹中。 下载完成后,您需要将category-images文件夹上载到/ wp-content / uploads目录。 这样做将使您可以将所有类别图像的大小放在一个单独的文件夹中,这很容易调用您的主题。

在WordPress模板中显示类别图像 (Displaying Catagory Images in WordPress Templates)

Before we move on to set these images as default fallback images, lets take a look at how you would display them in your themes. For example, you can display these images at the top of your category pages.

在继续将这些图像设置为默认后备图像之前,让我们看一下如何在主题中显示它们。 例如,您可以在类别页面的顶部显示这些图像。


<?php 
if ( is_category() ) 

$thiscat = get_category(get_query_var('cat'),false); 

?>

<img class="category-thumb" src="<?php echo bloginfo('url'); ?>/wp-content/uploads/category-images/<?php echo $thiscat->slug ; ?>-50x50.jpg" alt="<?php echo $thiscat->name; ?>" />


This is how it appeared on our demo site’s category archive page.

这就是它出现在我们的演示站点的类别存档页面上的方式。

Displaying a category icon image on category page
将类别图像显示为默认的后备特色图像 (Displaying Category Image as Default Fallback Featured Image)

Now we are going to show you how to display a category image as the default fallback featured image or post thumbnail when a post does not have its own featured image.

现在,我们将向您展示在帖子没有自己的特色图片时,如何将类别图片显示为默认的后备特色图片或帖子缩略图。

Note: Please backup your theme files before making any changes.

注意:在进行任何更改之前,请备份您的主题文件。

Inside your loop, where your theme is displaying the featured image or post thumbnail, replace it with this code:

在循环中,您的主题正在显示特色图片或帖子缩略图的循环中,将其替换为以下代码:


<?php if ( has_post_thumbnail() ) : ?>

<div class="entry-thumbnail">
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a>
</div>

<?php else : 
$category = get_the_category(); 
?>
<div class="entry-thumbnail">
<a href="<?php the_permalink(); ?>"><img src="<?php bloginfo('url'); ?>/wp-content/uploads/category-images/<?php echo $category[0]->category_nicename ; ?>-150x150.jpg" alt="<?php the_title(); ?>" /></a>
</div>

<?php endif; ?>

This code looks for a post thumbnail. If it finds one, then it displays the post thumbnail. Otherwise, it looks for the category a post belongs to and then displays the category image. We have added -150×150 in the image file name because this is the post thumbnail size in our demo theme. Your theme may be using a different size for post thumbnails, so you need to use that size instead.

此代码查找帖子缩略图。 如果找到一个,则显示帖子缩略图。 否则,它将查找帖子所属的类别,然后显示类别图像。 我们在图像文件名中添加了-150×150,因为这是演示主题中的帖子缩略图大小。 您的主题可能为帖子缩略图使用了不同的大小,因此您需要改用该大小。

Please note that your theme may already have <?php if ( has_post_thumbnail() ) : ?> line and the next few lines that display post thumbnail. You can skip those lines if your theme already got them.

请注意,您的主题可能已经有<?php if ( has_post_thumbnail() ) : ?>行以及接下来的几行显示帖子缩略图。 如果您的主题已经收到,则可以跳过这些行。

That’s all, we hope this article helped you add fallback featured image based on post category. For feedback and questions, please leave a comment below.

仅此而已,我们希望本文能帮助您根据帖子类别添加后备特色图片。 对于反馈和问题,请在下面发表评论。

翻译自: https://www.wpbeginner.com/wp-themes/set-fallback-featured-image-based-post-category-wordpress/

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值