乐清企业网站设计:如何post创建WordPress文章格式

乐清网站建设 | 2019-04-03

定制的POST格式是最初在WordPress版本3.1中引入的一个特性。基本上,POST格式作为分组文章的一种不同方式,允许您定义要发布的POST内容的类型。一旦文章按格式分组,您就可以选择将文章安排在一起,以不同的方式发布,或者根据其发布格式组织文章。

WordPress允许您从设置列表中切换不同的POST格式。你不必全部使用,你只需选择最适合你的网站的格式。目前,这份清单包括:

显然,这些描述都是指导原则,乐清企业网站设计可以根据需要调整POST格式。如果你正在运行一个博客,很可能你有几个专业的帖子,适合这些类别,你想看起来有点不同,或以一种独特的方式布局。在这篇文章中,我们将介绍如何设置POST格式来实现这一点,以及如何开始使用POST格式的一些想法。

设置邮政格式

向主题添加POST格式就像向WordPress添加一个函数一样简单,并列出您想要使用的POST格式。许多主题都预先加载了已经安装的POST格式。不过,熟悉它们的设置还是个好主意。

乐清企业网站设计

寓言主题中视频帖子格式的一个例子

在本教程中,我将使用寓言主题,其中包括几个帖子格式:图库、引号和视频。然而,对于我的博客来说,这还不够。我想再加几个。首先要做的是设置一个子主题只有一个基本的style.css文件。使用子主题可以确保将来对主题的更新保持不变,尽管我们所有的自定义都覆盖了主题的默认值。

还值得注意的是,默认情况下,将POST格式添加到“POST”类型,但也可以将它们添加到自定义POST类型另一行代码。

现在,让我们在主题中添加一些更多的POST格式。如果您还没有在子主题的目录中创建一个“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_Them-Support函数来包含我们的POST格式。正如我提到的,画廊,引用和视频已经包括在我们的主题。然而,我们用我们自己的函数覆盖这个函数,所以如果我们想要保留它们,我们必须确保包含它们。您可以从上面的列表中添加任何您想要的帖子格式,所以选择最适合您的博客的格式。

激活您的子主题之后,您可以访问WordPress管理员并创建一个新的帖子。您将看到右边栏中列出的六种POST格式。选择这些选项中的任何一个,将文章更改为特定的帖子格式,或者将其保留在“Standard”中。在我们继续前进之前,我建议您在相关内容中使用的每个帖子格式(A库、嵌入式视频等)添加几个虚拟帖子。这样您就可以看到POST格式的实际操作。

您可以从POST编辑器中的POST格式列表中进行选择。

好的,我们已经建立了自定义的帖子格式。现在,是时候探索我们能用它们做些什么了。

样式邮政格式

开始使用POST格式的最简单方法是使用CSS对每种格式进行稍微不同的样式。默认情况下,主题使用课后函数包括来自优雅主题的任何主题,它将为指定其POST格式的每个帖子输出一个特殊的CSS类。类的结构为.form-(Name)。所以,视频帖子会有这样的课程:

.format-video

这些类包含在索引页和单独的POST页面中,可用于在任何位置添加唯一的样式。让我们从简单的开始。

寓言,我正在使用的主题,已经有一个特殊的结构引文,其中一个单引号是粗体和放置在引号内。但我想改变我的所有引文的背景颜色,以及突出他们一点。为此,我打开子主题的“style.css”文件并添加:

.format-quote {
    background#FFAADD !important;
    colorwhite;
}

这将添加一个粉红色的背景,任何已分配的“引号”的帖子格式。它还会将文本颜色更改为白色。我确保添加了“!重要”标志来覆盖主题的默认设置。

当然,这种样式适用于所有上下文中的文章,包括单个帖子、页面和索引页面。如果我想让这个样式只在主页上列出一个帖子时使用,我们只需要添加一些特定的内容。这一次,我只会申请我的粉红色背景时,张贴在主页上。我还将用CSS删除文章的标题,所以只有文章的内容保留下来。

.home .format-quote {
    background#FFAADD !important;
    colorwhite;
}

.home .format-quote .entry-title {
    displaynone;
}

我们乐清企业网站设计的报价全是粉红背景,没有标题。

CSS可以用来做相当多的工作,以改变内容的格式。例如,寓言主题在画廊中添加了特殊的样式,以使它们出现在六角形面板中。

我添加到寓言主题中的一种格式是放在一边的,所以目前还没有唯一的CSS。为了让帖子看起来更像一种状态,我想删除由寓言主题添加的默认下拉框,并添加我自己的文本效果。

.home .format-aside .entry-content > p:first-child:first-letter {
    displayinline;
    floatnone;
    margin0;
    font-size: inherit;
}

.home .format-aside .entry-content p {
    font-styleitalic;
    font-size36px;
    color#666;
    text-shadow2px 2px #E7E1E1;
}

这样式的文本包括斜体,较大的字体大小和文本阴影,同时删除下拉框。同样,这将只适用于主页,但您可以简单地删除“.home”以使其在单个页面上工作。

只要使用CSS就可以定制POST格式,这是相当多的事情。我建议浏览网站上列出的任何主题,以获得一点灵感。

基于POST格式的内容过滤

样式CSS可能是您需要的所有需要的帖子格式为您工作。但是如果你想要更多的控制,你也可以直接编辑模板来修改它们的输出。大多数主题,如寓言或Divi主题,都是为显示基于POST格式的自定义模板而设置的。关键的代码段通常在POST模板的循环中找到(例如index.php或single.php)。

get_template_part( 'content', get_post_format() );

您不需要添加这段代码,默认情况下,它是以优雅的主题和大多数专业主题提供的。

get_Template_Part从特定的PHP文件中提取模板,该文件可以根据POST格式进行更改。因此,如果您希望为备用格式创建一个特殊的模板,只需创建一个内容-aside.php文件,并开始在那里编辑循环的内容。

例如,寓言主题中的图片库POST类型在网格上排列图像,支持内置的FancyBox弹出窗口。这是在“Content-Gallery.php”文件中完成的。

如果您选择了正确的主题,那么这方面的许多工作将为您完成,但是添加一些额外的功能是有用的。例如,我在第一步中向寓言主题添加了“链接”格式。我的链接文章非常简单,只包含一个标题和一个链接。

链接帖子示例

我真正想要做的是提取这个URL,当文章列在我的主页上时,直接将我的标题链接到外部页面,而不是强迫用户访问一个帖子,然后按照链接进行操作。这超出了CSS的范围,需要我们使用模板。

准备好我们的样式

我们需要一点自定义CSS,这样我们就可以稍微调用链接帖子,以确保用户知道他们被引导离开站点。我想确保一个帖子的标题有一个颜色,与我的网站上的其他链接,并改变了一些背景。我还想在标题之前使用链接图标。

要做的第一件事是在您的子主题中创建一个图像文件夹,然后将上面的链接图像保存为“link.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" ";
    backgroundurl(images/link.png);
    width75px;
    height56px;
}

.home .format-link .entry-title p {
    text-aligncenter;
}

在这里,我们正在编辑链接文章的背景和文本的颜色。然后,我们使用:前面的伪选择器来添加链接图标,就在帖子标题之前。如果还不清楚这是怎么回事,没关系。我们一会儿再谈。

添加我们的链接抓取功能

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

打开子主题文件夹中的“Functions.php”文件,并添加以下函数:

function get_my_url() {
    if ( ! preg_match( '/<a\s[^>]*?href=[\'"](.+?)[\'"]/is', get_the_content(), $matches ) )
        return false;

    return esc_url_raw( $matches[1] );
}

这个函数所做的就是对文章的内容进行排序,并搜索a href=标签。然后,它从里面取出URL,并为您返回它。我们将在下一步使用这个。

设置链接模板

接下来,我们需要为链接POST格式实际创建模板。为此,我们必须在子主题的文件夹中创建一个名为“content-link.php”的文件。这将接受与POST格式“链接”的任何帖子,并使用该文件来呈现其内容,而不是默认模板。现在,这个模板是空白的,所以它还没有做太多事情。让我们添加我们的代码。

<article id="post-<?php the_ID(); ?>" <?php post_class( 'entry' ); ?>>
    <div class="container clearfix">
        <header class="entry-title">
        <?php if ( is_single() ) { ?>
            <h1><?php the_title(); ?></h1>
        <?php } else { ?>
        <?php $myLink = get_my_url(); ?>
            <h2>
                <a href="<?php echo $myLink; ?>"><?php echo the_title(); ?></a>
            </h2>
            <p>This is an external link and will take you to a new page.</p>
        <?php } ?>

            <?php et_fable_post_meta(); ?>
        </header>
    </div> <!-- .container -->

    <?php if ( is_single() ) : ?>
        <?php get_template_part( 'includes/share', get_post_format() ); ?>
    <?php endif; ?>
</article> <!-- .entry-->

这里有很多事情要做,所以我将一点地完成这段代码,这样您就可以看到它是如何设置的。

<article id="post-<?php the_ID(); ?>" <?php post_class( 'entry' ); ?>>
    <div class="container clearfix">
        <header class="entry-title">

这只是一些从HTML结构开始的基本代码。我们正在添加POST_class函数,以获得适当的类(包括.form-link)以及容器和标头元素。这是直接从默认模板中获取的,该模板是我主题文件夹中的“content.php”文件。您可以编辑此部分,以配合您的主题,但您希望。

<?php if ( is_single() ) { ?>
    <h1><?php the_title(); ?></h1>

本节使用“is_Single”条件标记来检查我们是否在单个POST页面上。如果是,则将标题呈现为H1标记,这是默认的。当然,用户不应该访问这个页面,因为我们正在远离它,但是这是一个很好的退路。

<?php } else { ?>
        <?php $myLink = get_my_url(); ?>
            <h2>
                <a href="<?php echo $myLink; ?>"><?php echo the_title(); ?></a>
            </h2>
            <p>This is an external link and will take you to a new page.</p>
        <?php } ?>

这里是真正的魔法发生的地方。我们使用前面创建的get_my_url函数将POST中的第一个链接存储在$MyLink变量中。然后,在h2标记中,我们在a元素。因此,与其链接到POST,链接格式将链接到文章的第一个外部链接(在我们的例子中,是https://www.elegantthemes.com).)。

接下来,我们只是简单地添加标题作为我们链接的文本。记住,我们在CSS中添加了链接图标,它将在每个标题之前自动添加。最后,我们添加了一些文本,告诉我们的用户,他们即将被定向到一个新的页面。

            <?php et_fable_post_meta(); ?>
        </header>
    </div> <!-- .container -->

    <?php if ( is_single() ) : ?>
        <?php get_template_part( 'includes/share', get_post_format() ); ?>
    <?php endif; ?>
</article> <!-- .entry-->

我们使用默认模板中的相同标记结束我们的文章,以确保POST在单个页面上呈现为正常,并且我们所有的HTML元素都关闭了。

最后,我们的主页上的链接文章以不同的外观结束。

当然,这只是个开始。可以使用POST格式模板来编辑和修改基于POST格式的文章的输出,这样就可以完成大量的内容。如果您有兴趣了解更多关于如何工作的信息,我建议深入研究内容模板,看看它们是如何工作的,或者访问WordPress代码索引条目关于邮政格式。

坡麦芽糖

最后一个技巧,我将与您分享是如何组织您的文章,根据张贴格式。WordPress附带了一个方便的函数GET_POST_FORCT_LINK,它允许您链接到只包含来自特定POST格式的帖子的页面。要使用它,只需在任何模板文件中使用此函数即可。

<?php echo esc_url( get_post_format_link( 'aside' ) ); ?>

这将提供与“备用”帖子列表的链接。切换POST格式的名称,以匹配要链接到的POST格式。这在导航或将文章组合在一起时非常有用。如果你的博客大量使用了帖子格式,它可以是一个很好的方式来组织内容。

最后思想

现在有很多关于乐清企业网站设计POST格式的讨论,它们的未来也有一些。在空中。但是,如果您运行的是一个内容驱动的博客,它们可以是一个非常有用的工具,并且可以为您的帖子添加一些可靠的额外功能。优雅的主题具有相当多的POST格式,您可以探索其中几乎任何一个主题来了解它是如何工作的。最好的开始方式就是直接投入进去!


上一篇:乐清公司网站制作:查看一些最好的评级&评论WordPress插件下一篇:已经没有了