如何创建WordPress文章格式__wordpress教程

自定义文章格式是 WordPress 3.1 版本首次引入的一项功能。从根本上说，文章格式是一种不同的文章分组方式，允许您定义所发布的文章内容类型。一旦按照格式对文章进行了分组，您就可以选择将文章排列在一起、为文章设计不同的样式或根据文章格式来组织文章。

WordPress 允许您从一组列表中切换不同的文章格式。您不必使用所有格式，只需选择最适合您网站的格式即可。目前，这个列表包括：

日志：类似于快速笔记。用于快速更新或自定义状态等文章。
图库：包含图片库的文章。
图片：单张图片，而非图库。
视频：包含一个或多个视频的文章。WordPress codex 还指出，单个 URL 可能表示视频的来源，而不是嵌入式视频。
音频：音频文件或播放列表。
链接：指向外部网站的简单链接。
引用：引用的文本块，通常是引用的文本块：引用的文本块，通常注明引用作者。
状态：与旁白类似，但更多是简单的单行状态。
聊天：完整的聊天记录。

显然，这些描述都是指导原则，您可以根据自己的需要调整文章格式。如果你正在运营一个博客，那么你很可能有一些符合这些类别的特殊文章，你希望这些文章看起来与众不同，或者以一种独特的方式布局。在本文中，我们将介绍如何设置文章格式来实现这一目的，以及一些开始使用它们的想法。

设置文章格式
样式化文章格式
根据文章格式过滤内容
固定链接
小结

设置文章格式

在主题中添加文章格式非常简单，只需在 WordPress 中添加一个功能，列出您想使用的文章格式即可。许多主题已经预装了文章格式。不过，最好还是熟悉一下它们的设置方式。

Fable主题中的视频文章格式示例

在本教程中，我将使用 Fable 主题，该主题包含几种文章格式：图库、引用和视频。不过，对于我的博客来说，这些还不够。我想再增加几种。首先要做的是为 Fable 创建一个子主题，只需一个基本的 style.css 文件。使用子主题可以确保未来对主题的更新保持不变，不过我们的所有自定义设置都会覆盖主题的默认设置。

值得注意的是，默认情况下，文章格式会添加到 “文章 “文章类型中，但也可以通过另一行代码添加到自定义文章类型中。

现在，我们只需在主题中添加一些文章格式。如果还没有，请在子主题目录下创建一个 “functions.php “文件，并添加以下代码块。

function add_post_formats() {
    add_theme_support( 'post-formats', array( 'gallery', 'quote', 'video', 'aside', 'image', 'link' ) );
}
 
add_action( 'after_setup_theme', 'add_post_formats', 20 );

在这里，我们使用 add_theme_support 函数来包含我们的文章格式。正如我提到的，我们的主题已经包含了图库、引用和视频。不过，我们将用自己的功能覆盖该功能，因此如果想保留这些格式，就必须确保包含它们。您可以从上面的列表中添加任何您想要的文章格式，因此请选择最适合您博客的格式。

激活子主题后，您可以访问 WordPress 管理并创建一个新文章。你会看到右侧边栏列出了六种文章格式。选择其中任何一种，就可以将文章改为特定的文章格式，或者直接保留为 “标准 “格式。在我们继续之前，我建议您为每种文章格式添加几个包含相关内容（图库、嵌入式视频等）的虚拟文章，这样您就可以看到文章格式的实际效果。

您可以在文章编辑器中从文章格式列表中进行选择

好了，我们已经设置了自定义文章格式。现在，是时候看看我们能用它们做些什么了。

样式化文章格式

开始使用文章格式的最简单方法就是使用 CSS 为每种格式设计不同的样式。默认情况下，使用 post_class 函数的主题（包括 Elegant Themes 的任何主题）会为每篇文章输出一个特殊的 CSS 类，指定文章格式。该类的结构为 .format-(name)。因此，视频文章的类为：

.format-video

这些类同时包含在索引页面和单个文章页面中，可用于在任一位置添加独特的样式。让我们从简单的开始。

我正在使用的 Fable 主题已经为引用文章设置了一个特殊的结构，即单个引用加粗并置于引号内。但我想同时更改所有引用文章的背景颜色，以便更加突出它们。为此，我打开了子主题的 “style.css “文件，并添加了以下内容：

.format-quote {
    background: #FFAADD !important;
    color: white;
}

这将为任何指定为 “引用” 格式的文章添加粉色背景。它还会将文字颜色更改为白色。我确保添加了 “!important” 标记，以覆盖主题的默认设置。

当然，这种样式适用于所有情况下的文章，包括单篇文章、页面和索引页面。如果我想让这种样式只在文章被列在主页上时才应用，我们只需添加一点特殊性。这一次，我只打算在文章被列在主页上时应用粉色背景。我还将用 CSS 删除文章的标题，因此只保留文章内容。

.home .format-quote {
    background: #FFAADD !important;
    color: white;
}
 
.home .format-quote .entry-title {
    display: none;
}

我们的完整引用，粉色背景，无标题

CSS 可用于根据格式改变内容。例如，Fable 主题就为图库添加了特殊样式，使其显示为六边形面板。

我为寓言主题添加的格式之一是旁白，因此目前还没有独特的 CSS。为了让旁白文章看起来更像状态，我想移除 Fable 主题添加的默认下拉菜单，并添加我自己的文字效果。

.home .format-aside .entry-content > p:first-child:first-letter {
    display: inline;
    float: none;
    margin: 0;
    font-size: inherit;
}
 
.home .format-aside .entry-content p {
    font-style: italic;
    font-size: 36px;
    color: #666;
    text-shadow: 2px 2px #E7E1E1;
}

这样，文本的样式就包括斜体、更大的字体大小和文本阴影，同时去掉了下拉菜单。同样，这只适用于主页，但你也可以简单地移除”.home”，使其也适用于单个页面。

只需使用 CSS 就能定制很多文章格式。我建议大家浏览本网站列出的任何主题，从中获得一些灵感。

根据文章格式过滤内容

只需使用 CSS 样式，就能让文章格式为你所用。但如果你想要更多控制权，也可以直接编辑模板，修改它们的输出。大多数主题（如 Fable 或 Divi 主题）都会根据文章格式设置显示自定义模板。关键代码通常位于文章模板的循环中（如 index.php 或 single.php）。

get_template_part( 'content', get_post_format() );

您无需添加此代码，Elegant Themes 主题和大多数专业主题都默认提供了此代码。

Get_template_part 可从特定的 PHP 文件中提取模板，并可根据文章格式进行修改。因此，如果你想为旁白格式创建一个特殊模板，只需创建一个 content-aside.php 文件，然后在其中开始编辑循环内容即可。

例如，Fable 主题中的 “画廊”（Gallery）文章类型将图片排列在一个网格上，并内置了对花式框弹出窗口的支持。这是在 “content-gallery.php “文件中完成的。

如果你选对了主题，很多工作都会为你完成，但添加一些额外的功能也很有用。例如，我在第一步中为 Fable 主题添加了 “链接 “格式。我的链接文章非常简单，只包含一个标题和一个链接。

链接文章示例

我真正想做的是调出这个 URL，当文章在我的主页上列出时，将我的标题直接链接到一个外部页面，而不是强迫用户访问单个文章，然后再点击链接。这超出了 CSS 的范围，需要使用模板。

为样式做好准备

我们需要使用一些自定义 CSS，这样就能稍微突出链接文章，确保用户知道他们正被引导离开网站。我想确保文章标题的颜色与网站上其他链接的颜色一致，并稍微改变一下背景。我还想在标题前使用一个链接图标。

首先要做的是在子主题中创建一个图片文件夹，然后将上面的链接图片保存为 “http://www.cnzhanzhang.com/wp-content/uploads/2023/12/20231214083032-657abd282772c.png”。接下来，我们将添加一些 CSS，确保我们的内容看起来独一无二。

.home .format-link {
    background: #eee !important;
}
 
.home .format-link .entry-title h2 {
    color: #6ba7a5;
}
 
.home .format-link .entry-title h2:before {
    display: inline-block;
    content: " ";
    background: url(images/http://www.cnzhanzhang.com/wp-content/uploads/2023/12/20231214083032-657abd282772c.png);
    width: 75px;
    height: 56px;
}
 
.home .format-link .entry-title p {
    text-align: center;
}

在这里，我们要编辑链接文章的背景和文本颜色。然后，我们使用 :before 伪选择器在文章标题前添加链接图标。如果还不清楚这是干什么的，没关系。我们稍后会讲到。

添加链接抓取功能

为了将我们的文章直接链接到外部链接，我们需要创建一个函数，从文章内容中抓取第一个链接，并返回 URL 供我们使用。然后，我们就可以在文章格式模板中使用该 URL，将标题直接链接到外部页面。

打开子主题文件夹下的 “functions.php” 文件，添加此函数：

function get_my_url() {
    if ( ! preg_match( '/]*?href=[\'"](.+?)[\'"]/is', get_the_content(), $matches ) )
        return false;
 
    return esc_url_raw( $matches[1] );
}

该功能只需对文章内容进行排序，然后搜索 a href= 标记。然后，它会从其中提取 URL 并返回给你。我们将在下一步中使用它。

设置我们的链接模板

接下来，我们需要为链接文章格式创建模板。为此，我们必须在子主题文件夹中创建一个名为 “content-link.php “的文件。该文件将接收任何文章格式为 “链接 “的文章，并使用该文件来呈现其内容，而不是使用默认模板。现在，这个模板是空白的，所以还不能做什么。让我们添加代码。

" >
    
        
        
            
        
        
            
                ">
            
            This is an external link and will take you to a new page.