类别的特色图片是那些明显有益的想法之一,你可能以前没有考虑过。
精选图片可以并且确实对帖子页面产生巨大的积极影响,因此,当您考虑它时,将这种影响扩展到我们的类别页面是很自然的,并为访问者提供即时视觉提示 话题。
在这篇文章中,我们将向您展示如何为类别指定特色图片,并为您提供一些关于如何更新主题以显示它们的提示。
将特色图片添加到您的类别页面需要 3 个步骤:
- 安装并激活Category Images插件
- 在管理界面中将图像添加到您的类别
- 更新您的主题以在类别页面上显示图像
第 3 步将取决于您的主题,但我将引导您完成添加 Twenty Twelve(具有类别模板)所需的更新。
第 1 步:安装插件
安装插件的最简单方法是简单地下载、上传和激活它。
没有什么可配置的,以此类推到第 2 步。
第 2 步:添加分类图像
通过“添加类别”表单将图像添加到新分类,或者在“帖子”>“分类”下的“编辑分类”表单上将图像添加到现有分类。
选择一个分类并单击编辑,您将在底部看到一个上传/编辑图像按钮。 单击该按钮会打开“媒体”对话框,您可以在其中选择现有图像或上传新图像,就像在帖子中添加特色图像一样。
将图像添加到几个类别并继续进行第 3 步。
第 3 步:更新您的主题
好的,前两个步骤很简单:这一步有点棘手,因为您现在需要更新主题以输出类别特色图像。
在很大程度上,这将取决于您的主题以及它如何利用 WordPress 模板层次结构。 通常,主题要么有一个特定的类别模板 (category.php),要么让一个更通用的存档模板 (archive.php) 处理所有列表,而不仅仅是类别。
您可能还需要注意特定的类别页面。 您可以识别这些模板,因为它们将被命名为 category-[category-slug].php。 如果你有很多这些,那么你可能需要重新考虑。
我将逐步更新 Twenty Twelve,它使用 category.php 模板。
无论您需要采用哪种方法,都应该为您的更改创建一个子主题。
将类别特色图像添加到 Twenty Twelve
这个老化但非常受欢迎的 WordPress 默认主题仍然是一个很好的练习主题。 插件只需要一件事。
在这段代码下面:
<header class="archive-header">
在 category.php 中,添加:
<?php if (function_exists('z_taxonomy_image')) z_taxonomy_image(); ?>
如果您访问带有图像的类别,您会立即看到差异,但类别图像和类别标题需要一些 TLC。
给类别图像和标题一些 TLC
多年来看到许多更新的 Twenty-Twelve 主题和全尺寸图像默认为 100% 宽,因此根本不需要调整图像。 如帖子中所述,唯一需要在图像上覆盖标题并确保标题响应的 CSS 是:
header.archive-header h1.archive-title { position: absolute; color: #ffffff; font-size: 2em; margin-top: -120px; margin-left: 25px; word-wrap: break-word; max-width: 50%; line-height: 1.5em; }
存档标题进行了彻底的修改:它的颜色变为白色,字体大小大大增加,定位和负边距确保它显示在特色图像上,如下所示:
一点也不差,并且在这方面有了很大的改进:
这个例子当然展示了特色图像如何增强您的 WordPress 网站上的类别页面。 与往常一样,很大程度上取决于这些图像的质量,但选择正确的图像,结果令人印象深刻。
您是否尝试过使用此插件并添加特色图片? 让我们在评论中知道!