自定义单篇文章模板


简介

在本课中,我们将通过编辑单篇文章模板来自定义文章的显示方式。为此,我们将进入站点编辑器,选择模板,然后打开单篇文章模板。另一种访问模板的方式是点击左下角的“管理所有模板”,然后从中选择模板。

模板结构

此模板提供了单篇文章显示的结构或设计,当然,您可以根据需要修改它。目前,我安装了 Twenty Twenty-Four 主题,这是在站点编辑器中编辑模板时文章的默认结构。让我们点击列表视图,以便更好地查看模板的结构。顶部是文章特色图片,下面是标题,然后是文章元数据,如日期、作者和分类。接着是文章内容块,下面是文章标签块,最后是评论块。请记住,如果您希望网站访问者能够在文章上留下评论,请确保不要意外地从模板中删除此块。

现在我们已经了解了这个主题如何构建模板,让我们看看当我们打开一篇文章时,它在前端会是什么样子。顶部是文章特色图片,接着是标题、日期、作者和分类。然后我们会看到文章内容和分配给这篇文章的标签,底部则是人们留下的评论。

自定义模板:示例 1

现在,我们可以返回模板并根据需要进行更改。在第一个示例中,让我们选择包含文章标题块和文章元数据的堆栈块。将其移到文章特色图片的顶部。接下来,我将选择特色图片,打开侧边栏设置,然后进入样式。在此示例中,我想将宽高比更改为 16:9。这将确保我所有文章的特色图片具有相同的大小,无论原始图片的尺寸如何。我决定保持模板的其余部分不变,所以让我们点击保存,看看更改如何反映在前端。现在我们将看到标题和文章元数据在顶部,并且特色图片块的宽高比已应用。

自定义模板:示例 2

在第二个示例中,使用封面块为我们的单篇文章模板创建自定义文章头部。所以,让我们继续在模板顶部添加一个封面块。完成后,我将选择使用特色图片。为了节省时间,我将复制包含徽标和导航菜单的行块,并将其粘贴到我的封面块中。在下面,我将添加我的站点标题和文章元数据。我将选择堆栈块,并将其拖放到我的封面块中。然后,我们可以删除头部和特色图片块。现在,模板的新头部已就位。下一步是选择堆栈块,将站点标题和文章元数据居中对齐。我还想选择站点标题块,并添加一些内边距,以便在标题周围创建更多空间。最后一步是选择我们的封面块,打开样式,选择白色作为叠加颜色,然后将叠加不透明度更改为 70%。然后,我们可以点击保存,看看应用新模板后文章的样子。以下是我网站上的两个示例。一个是关于在葡萄牙冲浪的文章,另一个是关于开普敦桌山的文章。

清除自定义设置

请注意:如果您对更改不满意,请点击模板名称旁边的三个垂直点,然后选择“清除自定义设置”。模板将恢复到其原始状态。或者,您可以转到“管理所有模板”,然后点击“重置”。

结论

我相信您对自定义自己的文章内容布局更有信心了。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注