社区
学习
工具库
AI工具
休闲
搜索
简体中文
目录
>如果我们访问主页并打开浏览器控制台检查这些课程，我们会发现我们缺少这些类别中的当前模板信息：
>我们可以看到，我们的虚假帖子一般都没有任何图像，并且没有特色图像
customizer
首页 CMS教程 ＆＃＆按 如何从头开始构建WordPress主题：最终步骤

如何从头开始构建WordPress主题：最终步骤

Christopher Nolan
Christopher Nolan
Feb 09, 2025 am 09:42 AM

如何从头开始构建WordPress主题：最终步骤

>在本文中，我们将完成从头开始构建WordPress主题的尝试，重点是完善我们的模板，添加元信息，缩写缩略图，侧边栏，用户友好的控件等等。

这是有关构建WordPress主题的WordPress系列的第三部分也是最后一部分。第1部分引入了WordPress主题，在第2部分中，我们构建了一个基本主题。我们使用StartBootStrap使用干净的博客模板为WordPress主题添加样式。到目前为止，我们已经编写的代码可在GitHub上找到。

>

>我们已经添加了single.php，page.php，archive.php和index.php模板，但是我们将其保留为任务的这一部分的任务。我们介绍了function.php - WordPress用来自动包含特定功能的文件，并在其中添加了功能。我们在header.php中添加了动态标头函数，然后将该功能分开到我们的functions.php中。理想情况下，应该将其组织到一个单独的文件中 - 可能在我们主题内的Inc文件夹中 - 以保持一切清洁。

在第2部分中，我们还引入了部分 - footer.php和header.php。

钥匙要点

>利用`functions.php`来添加特定于主题的功能，并有效地将代码组织到单独的文件中以进行清洁结构。
  • >实现模板零件，用于一致和模块化的HTML结构，例如`single.php`和`Index.php`。
    • >
  • >使用'add_theme_support（'Post-thumbnails'）启用和管理WordPress主题中的缩略图；
    • 通过`functions.php`注册多个侧边栏和小窗口区域，以通过WordPress小部件进行动态内容管理。
    • >使用WordPress Customizer API自定义站点外观和布局，从而使用户友好的控件用于背景图像等等。
    • >通过使用模板层次结构原理扩展单个帖子和页面自定义，并且用于结构化和特定内容显示的`get_template_part`。
    • 完善模板
    • 在上一篇文章中，我们将标签（开头一个）分开为header.php，然后添加了对此。这为身体增加了一些语义课，告诉我们我们是否在页面上，发帖，是否登录，等等，等等 - 使我们能够根据访问的页面和其他网站的不同元素进行样式的样式事物。

>如果我们访问主页并打开浏览器控制台检查这些课程，我们会发现我们缺少这些类别中的当前模板信息：

>

要更改WordPress显示的内容，我们需要知道正在使用哪些文件。在我们的情况下，index.php用作默认的后备模板。该信息图显示了使用的模板的层次结构。覆盖或创建主题时，它可能非常方便。

>

>在上一篇文章中，我们开始完善Archive.php循环，添加元信息并在输出文章中发布缩略图。我们将该循环分为一个单独的文件，将其包括在Archive.php和index.php中，然后完成完善。

>

>首先，我们将用一行请求部分文件的单行替换两个文件中的内容，因此index.php看起来像这样：>

>完成此操作后，我们将将已替换为Archive.php中的内容放入partials/content.php文件：
<span><span><?php
</span></span><span><span>/**
</span></span><span><span> * <span>@package Botega_Scratch_Theme
</span></span></span><span><span> */
</span></span><span>
</span><span><span>get_header(); ?></span>
</span>
    <span><span><?php
</span></span><span>    <span>if ( have_posts() ) : while ( have_posts() ): the_post();
</span></span><span>
</span><span>                <span>get_template_part( 'partials/content', get_post_type() );
</span></span><span>
</span><span>        <span>endwhile;
</span></span><span>    <span>endif;
</span></span><span>    <span>?></span>
</span>
<span><span><?php get_footer(); ?></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制
>

>我们将这些更改上传到服务器后，我们将看到我们的首页，在帖子列表中的每个帖子中，都有元信息 - 日期和作者链接：
<span><span><span><div</span> <span><span><?php post_class( 'post-preview' ); ?></span></span> id<span>="post-<span><?php the_ID(); ?></span>"</span>></span>
</span>
<span><span><span><header</span> class<span>="entry-header"</span>></span>
</span>    <span><span><?php
</span></span><span>    <span>if ( is_singular() ) :
</span></span><span>        <span>the_title( '<h1 >', '</h1>' );
</span></span><span>    <span>else :
</span></span><span>        <span>the_title( '<h2 ><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
</span></span><span>    <span>endif;
</span></span><span>
</span><span>    <span>if ( 'post' === get_post_type() ) :
</span></span><span>        <span>?></span>
</span>        <span><span><span><div</span> class<span>="entry-meta"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>bsimple_posted_on();
</span></span><span>            <span>bsimple_posted_by();
</span></span><span>            <span>?></span>
</span>        <span><span><span></div</span>></span><!-- .entry-meta -->
</span>    <span><span><?php endif; ?></span>
</span><span><span><span></header</span>></span><!-- .entry-header -->
</span>
        <span><span><span><a</span> class<span>="post-thumbnail"</span> href<span>="<span><?php the_permalink(); ?></span>"</span> aria-hidden<span>="true"</span> tabindex<span>="-1"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>the_post_thumbnail( 'post-thumbnail', array(
</span></span><span>
</span><span>            <span>) );
</span></span><span>            <span>?></span>
</span>        <span><span><span></a</span>></span>
</span>
        <span><span><?php the_excerpt(); ?></span>
</span>
<span><span><span></div</span>></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制

如何从头开始构建WordPress主题：最终步骤这意味着我们的部分作品。

>

张贴缩略图

>我们可以看到，我们的虚假帖子一般都没有任何图像，并且没有特色图像

。如果我们转到WordPress仪表板，然后尝试将特色image

添加到我们的帖子/页面，我们将看到最右边的侧栏中没有文件上传字段。 （对于那些不熟悉WordPress的人，可以在此处阅读有关此功能的更多信息。）> 在WordPress主题中默认启用了未启用缩略图。这是一个需要专门打开新主题的功能。大多数主题都启用了它。 为此，我们包括add_theme_support（'Post-thumbnails'）;在我们的functions.php。上行

现在启用了缩略图。

>

>现在，我们可以使用WP-CLI命令WP站点空的WORDPRESS安装所有内容的安装-Alower-root（或者我们可以从WordPress仪表板手动执行），并用FakerPress将其重新填充。它应该用它从互联网上获取的特色图像填充帖子和页面。 （我们需要像以前一样重新创建顶部菜单，并为其分配页面和帖子。）

>

一个提示：如果我们正在构建待售主题，或者通常会发布给更广泛受众的主题，我们可能想使用Automattic提供的主题单元测试数据

，因为它可能会提供用于测试案例和主题详细信息范围的内容。

我们可以将图像大小指定为Fakerpress，但它很可能仍然会导致杂乱的外观。

>当我们构建主题时，用于实现抛光，标准化外观的技术之一是指定>缩略图。这些是标准尺寸WordPress，将调整所有上传图像以适合。我们将使用WordPress

add_image_size（）

>函数添加我们主题将使用的几个图像大小：

<span><span><?php
</span></span><span><span>/**
</span></span><span><span> * <span>@package Botega_Scratch_Theme
</span></span></span><span><span> */
</span></span><span>
</span><span><span>get_header(); ?></span>
</span>
    <span><span><?php
</span></span><span>    <span>if ( have_posts() ) : while ( have_posts() ): the_post();
</span></span><span>
</span><span>                <span>get_template_part( 'partials/content', get_post_type() );
</span></span><span>
</span><span>        <span>endwhile;
</span></span><span>    <span>endif;
</span></span><span>    <span>?></span>
</span>
<span><span><?php get_footer(); ?></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制
然后，我们将在我们的content.php中使用> >要在我们的存档或博客列表中实现一个格式摘要
<span><span><span><div</span> <span><span><?php post_class( 'post-preview' ); ?></span></span> id<span>="post-<span><?php the_ID(); ?></span>"</span>></span>
</span>
<span><span><span><header</span> class<span>="entry-header"</span>></span>
</span>    <span><span><?php
</span></span><span>    <span>if ( is_singular() ) :
</span></span><span>        <span>the_title( '<h1 >', '</h1>' );
</span></span><span>    <span>else :
</span></span><span>        <span>the_title( '<h2 ><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
</span></span><span>    <span>endif;
</span></span><span>
</span><span>    <span>if ( 'post' === get_post_type() ) :
</span></span><span>        <span>?></span>
</span>        <span><span><span><div</span> class<span>="entry-meta"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>bsimple_posted_on();
</span></span><span>            <span>bsimple_posted_by();
</span></span><span>            <span>?></span>
</span>        <span><span><span></div</span>></span><!-- .entry-meta -->
</span>    <span><span><?php endif; ?></span>
</span><span><span><span></header</span>></span><!-- .entry-header -->
</span>
        <span><span><span><a</span> class<span>="post-thumbnail"</span> href<span>="<span><?php the_permalink(); ?></span>"</span> aria-hidden<span>="true"</span> tabindex<span>="-1"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>the_post_thumbnail( 'post-thumbnail', array(
</span></span><span>
</span><span>            <span>) );
</span></span><span>            <span>?></span>
</span>        <span><span><span></a</span>></span>
</span>
        <span><span><?php the_excerpt(); ?></span>
</span>
<span><span><span></div</span>></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制
，我们将增加字体的大小，但是为此，我们将减少由： >能够浮动图像（我们刚才提到的缩略图）和摘录，我们将以下内容添加到我们的CSS中的父元素选择器：> 
<span>add_image_size( 'list-thumb-1', 730, 400, true);
</span><span>add_image_size( 'small-list-thumb-1', 400, 200, true);
</span><span>add_image_size( 'small-list-thumb-2', 300, 200, true);
</span><span>add_image_size( 'small-list-thumb-3', 220, 140, true);
</span>
登录后复制
登录后复制
登录后复制
（我们在这里不介绍对主题本身至关重要的较小样式调整。）

>

现在，我们可以增加字体大小，并通过浮动图像（与A apent元素一起浮动图像）围绕图像进行漂浮 
<span><span><span><a</span> class<span>="post-thumbnail"</span> href<span>="<span><?php the_permalink(); ?></span>"</span> aria-hidden<span>="true"</span> tabindex<span>="-1"</span>></span>
</span>    <span><span><?php
</span></span><span>    <span>the_post_thumbnail( 'small-list-thumb-1');
</span></span><span>    <span>?></span>
</span><span><span><span></a</span>></span>
</span>
登录后复制
登录后复制

>以后我们还将在单帖子/页面上使用post_thumbnails。

主题侧栏

主题侧边栏是主题中的宽度区域。它们需要在WordPress系统中注册，以便我们可以将不同的小部件放置到这些区域。一旦这样做，我们就会在模板文件中打印或输出这些小部件。 如何从头开始构建WordPress主题：最终步骤>我们将在主题中注册许多侧栏，可以在主题的GitHub存储库中看到。我们通过将以下代码添加到我们的functions.php：来做到这一点。

>在这里，我们展示了如何注册两个侧边栏。有关register_sidebar（）函数的更多详细信息可以在wordpress.org。

我们注册了11个侧边栏，但是我们不需要在所有页面模板或网站位置中输出所有这些侧栏。如果它们是在当前自定义页面中输出的，则可以在小部件下的

customizer

中访问：

> 

<span># functions.php
</span><span>function custom_excerpt_length( $length ) {
</span>    <span>return 40;
</span><span>}
</span><span>add_filter( 'excerpt_length', 'custom_excerpt_length', 999 );
</span>
登录后复制
登录后复制
>这是footer.php中侧边栏或小部件区域的实际输出的一个示例 - 这意味着它可以在全球显示：

>在这里，我们使用了上面的bottom_center_sidebar中使用的侧栏ID。> >我们还根据主栏是否有活跃的小部件（IS_ACTIVE_SIDEDBAR（））来调节主页上的中央内容容器的宽度：

>我们输出依赖于这些条件的Bootstrap类，确保如果我们省略为页面设置小部件，例如如何从头开始构建WordPress主题：最终步骤> home

>。

>我们用小部件和图像填充这些小部件区域后，这就是我们得到的： 

<span><span>.home .post-preview.post</span> {
</span>    <span>overflow: hidden;
</span><span>}
</span>
登录后复制

主题的塑造很好。读者当然会适应他们喜欢的样式。

>

> Customizer api 
<span>// Register custom sidebars
</span><span>function sidebar_register() {
</span>
    <span>$args = array(
</span>        <span>'name'          => __( 'home_header', 'bsimple' ),
</span>        <span>'description'   => __( 'home_header', 'bsimple' ),
</span>        <span>'id'            => 'h_h',
</span>        <span>'class'         => 'home_header',
</span>        <span>'before_widget' => ' <div >',
</span>        <span>'after_widget'  => '</div>',
</span>        <span>'before_title'  => '<h2 >',
</span>        <span>'after_title'   => '</h2>',
</span>    <span>);
</span>    <span>register_sidebar($args);
</span>
    <span>$args = array(
</span>        <span>'name'          => __( 'archive_sidebar_1', 'bsimple' ),
</span>        <span>'description'   => __( 'Archive Sidebar no 1', 'bsimple' ),
</span>        <span>'id'            => 'a_s_1',
</span>        <span>'class'         => 'archive_sidebar_1',
</span>        <span>'before_widget' => ' <div >',
</span>        <span>'after_widget'  => '</div>',
</span>        <span>'before_title'  => '<h2 >',
</span>        <span>'after_title'   => '</h2>',
</span>    <span>);
</span>    <span>register_sidebar($args);
</span>
    <span>$args = array(
</span>        <span>'name'          => __( 'bottom_center_sidebar', 'bsimple' ),
</span>        <span>'description'   => __( 'Bottom Center Sidebar', 'bsimple' ),
</span>        <span>'id'            => 'b_c_s',
</span>        <span>'class'         => 'bottom_center_sidebar',
</span>        <span>'before_widget' => '<div >',
</span>        <span>'after_widget'  => '</div>',
</span>        <span>'before_title'  => '<h2 >',
</span>        <span>'after_title'   => '</h2>',
</span>    <span>);
</span>    <span>register_sidebar($args);
</span>
<span>}
</span><span>add_action( 'widgets_init', 'sidebar_register' );
</span>
登录后复制

>当我们谈论样式时，我们将提及“定制器API”，并展示如何使用它来对标题的用户友好控制。

这是我们如何创建新的面板，pance和 control的一个示例（functions.php又） 

<span><span><?php
</span></span><span><span>/**
</span></span><span><span> * <span>@package Botega_Scratch_Theme
</span></span></span><span><span> */
</span></span><span>
</span><span><span>get_header(); ?></span>
</span>
    <span><span><?php
</span></span><span>    <span>if ( have_posts() ) : while ( have_posts() ): the_post();
</span></span><span>
</span><span>                <span>get_template_part( 'partials/content', get_post_type() );
</span></span><span>
</span><span>        <span>endwhile;
</span></span><span>    <span>endif;
</span></span><span>    <span>?></span>
</span>
<span><span><?php get_footer(); ?></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制
>这里的主要内容是customize_register钩子，$ wp_customize方法的顺序（add_panel，add_section，add_setting，add_control。订单效果。

>在functions.php中添加设置和控件后，我们将以下代码添加到BSIMPLE_SCRIPTS（）函数的底部，我们创建了为了加入我们的脚本和样式：

>

>我们在标题容器中添加了phome，pfront和pglobal类。现在，我们使用
<span><span><span><div</span> <span><span><?php post_class( 'post-preview' ); ?></span></span> id<span>="post-<span><?php the_ID(); ?></span>"</span>></span>
</span>
<span><span><span><header</span> class<span>="entry-header"</span>></span>
</span>    <span><span><?php
</span></span><span>    <span>if ( is_singular() ) :
</span></span><span>        <span>the_title( '<h1 >', '</h1>' );
</span></span><span>    <span>else :
</span></span><span>        <span>the_title( '<h2 ><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
</span></span><span>    <span>endif;
</span></span><span>
</span><span>    <span>if ( 'post' === get_post_type() ) :
</span></span><span>        <span>?></span>
</span>        <span><span><span><div</span> class<span>="entry-meta"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>bsimple_posted_on();
</span></span><span>            <span>bsimple_posted_by();
</span></span><span>            <span>?></span>
</span>        <span><span><span></div</span>></span><!-- .entry-meta -->
</span>    <span><span><?php endif; ?></span>
</span><span><span><span></header</span>></span><!-- .entry-header -->
</span>
        <span><span><span><a</span> class<span>="post-thumbnail"</span> href<span>="<span><?php the_permalink(); ?></span>"</span> aria-hidden<span>="true"</span> tabindex<span>="-1"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>the_post_thumbnail( 'post-thumbnail', array(
</span></span><span>
</span><span>            <span>) );
</span></span><span>            <span>?></span>
</span>        <span><span><span></a</span>></span>
</span>
        <span><span><?php the_excerpt(); ?></span>
</span>
<span><span><span></div</span>></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制
WP_ADD_INLINE_STYLE（）和我们用来在开始时使用基本主题样式的Bsimple风格的手柄 - 输出我们刚刚创建的定制器设置。我们使用get_theme_mod（）获取我们注册的每个设置。

> 这样，我们可以为指南中的Dynamic_header（）函数分开的标题设置图像：

单页和帖子

> WordPress模板层次结构可帮助我们定位访问时加载的确切URL并发布的发布，以便我们可以原子设计每个其中的HTML输出。很多时候，我们不需要创建所有模板。>

>为所有帖子或页面添加通用背景图像是没有意义的。因此，我们的自定义策略将用于档案，用于帖子的博客列表，首页甚至是术语。但是对于特定的页面和帖子，我们可能希望单独设置图像。 
<span>add_image_size( 'list-thumb-1', 730, 400, true);
</span><span>add_image_size( 'small-list-thumb-1', 400, 200, true);
</span><span>add_image_size( 'small-list-thumb-2', 300, 200, true);
</span><span>add_image_size( 'small-list-thumb-3', 220, 140, true);
</span>
登录后复制
登录后复制
登录后复制
我们该怎么做？

>

>在我们的Dynamic_header（）函数中，我们已经为

> pages

>的标题指定了，所以现在我们将使用内联样式和get_the_post_thumbnail_url（）函数来设置页面'

特色图像

🎜>作为标题背景：

现在，用户可以为每个页面设置标头图像。我们可以为IS_Single（）案例做同样的事情，该案例将对所有帖子应用相同的解决方案（包括自定义帖子类型）。 >此行将允许用户在每个页面，名称subtitle_添加自定义字段，并将其输出到页面标题：> 

<span><span><span><a</span> class<span>="post-thumbnail"</span> href<span>="<span><?php the_permalink(); ?></span>"</span> aria-hidden<span>="true"</span> tabindex<span>="-1"</span>></span>
</span>    <span><span><?php
</span></span><span>    <span>the_post_thumbnail( 'small-list-thumb-1');
</span></span><span>    <span>?></span>
</span><span><span><span></a</span>></span>
</span>
登录后复制
登录后复制

如果我们看不到“自定义字段”部分，我们可以在编辑屏幕的右上角通过

屏幕选项

<span># functions.php
</span><span>function custom_excerpt_length( $length ) {
</span>    <span>return 40;
</span><span>}
</span><span>add_filter( 'excerpt_length', 'custom_excerpt_length', 999 );
</span>
登录后复制
登录后复制

完成此操作后，我们将在单个页面上查看下面的subtitle_ meta字段：如何从头开始构建WordPress主题：最终步骤>

所有这些东西以及样式 - 也可以应用于

帖子

>如何从头开始构建WordPress主题：最终步骤>

我们现在需要在single.php和pagp.php中格式化输出

由于本指南的空间约束，我们将创建将在这两个模板中使用的内容，但是该结构将允许读者在需要时更具体地适应和自定义这些模板：> 

<span><span><?php
</span></span><span><span>/**
</span></span><span><span> * <span>@package Botega_Scratch_Theme
</span></span></span><span><span> */
</span></span><span>
</span><span><span>get_header(); ?></span>
</span>
    <span><span><?php
</span></span><span>    <span>if ( have_posts() ) : while ( have_posts() ): the_post();
</span></span><span>
</span><span>                <span>get_template_part( 'partials/content', get_post_type() );
</span></span><span>
</span><span>        <span>endwhile;
</span></span><span>    <span>endif;
</span></span><span>    <span>?></span>
</span>
<span><span><?php get_footer(); ?></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制
>在这里，我们使用的是10/12宽的单列布局，以MX-AUTO类为中心。我们使用部分内容single.php来输出实际内容。

>

在此部分中，我们使用the_content（）和wp_link_pages（）：>

>现在，我们有针对单页和帖子的最低限度，但是可以使用WordPress函数添加更多最低限度。我们可以自动指定我们希望WordPress在单个帖子，单页和属于特定类别等的页面中输出的细节等 
<span><span><span><div</span> <span><span><?php post_class( 'post-preview' ); ?></span></span> id<span>="post-<span><?php the_ID(); ?></span>"</span>></span>
</span>
<span><span><span><header</span> class<span>="entry-header"</span>></span>
</span>    <span><span><?php
</span></span><span>    <span>if ( is_singular() ) :
</span></span><span>        <span>the_title( '<h1 >', '</h1>' );
</span></span><span>    <span>else :
</span></span><span>        <span>the_title( '<h2 ><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
</span></span><span>    <span>endif;
</span></span><span>
</span><span>    <span>if ( 'post' === get_post_type() ) :
</span></span><span>        <span>?></span>
</span>        <span><span><span><div</span> class<span>="entry-meta"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>bsimple_posted_on();
</span></span><span>            <span>bsimple_posted_by();
</span></span><span>            <span>?></span>
</span>        <span><span><span></div</span>></span><!-- .entry-meta -->
</span>    <span><span><?php endif; ?></span>
</span><span><span><span></header</span>></span><!-- .entry-header -->
</span>
        <span><span><span><a</span> class<span>="post-thumbnail"</span> href<span>="<span><?php the_permalink(); ?></span>"</span> aria-hidden<span>="true"</span> tabindex<span>="-1"</span>></span>
</span>            <span><span><?php
</span></span><span>            <span>the_post_thumbnail( 'post-thumbnail', array(
</span></span><span>
</span><span>            <span>) );
</span></span><span>            <span>?></span>
</span>        <span><span><span></a</span>></span>
</span>
        <span><span><?php the_excerpt(); ?></span>
</span>
<span><span><span></div</span>></span>
</span>
登录后复制
登录后复制
登录后复制
登录后复制
>全局小部件和页脚

>我们为页脚创建了三个小部件（侧栏）区域，并将输出添加到footer.php中。我们还在页脚标签上方添加了一个部分或小部件区域。这些小部件不是特定于主页，页面或档案，而是全球性的。一旦我们将小部件分配给它们，他们将显示范围内的网站：

我们得到的是一个简单的底部和页脚区域，我们可以用窗口小部件填充：

<span>add_image_size( 'list-thumb-1', 730, 400, true);
</span><span>add_image_size( 'small-list-thumb-1', 400, 200, true);
</span><span>add_image_size( 'small-list-thumb-2', 300, 200, true);
</span><span>add_image_size( 'small-list-thumb-3', 220, 140, true);
</span>
登录后复制
登录后复制
登录后复制

我们现在有一个最小但功能性的主题，可以用来显示内容。 如何从头开始构建WordPress主题：最终步骤本指南将在这里停止，但是接下来的事物可能要做的是确保所有用例涵盖所有用例，并且该主题是100％全功能的。为此，安装主题检查插件以及其他工具，以检查我们的主题缺少的内容，并确保一切都符合标准：

>

结论

如何从头开始构建WordPress主题：最终步骤>本指南的目的是对WordPress主题构建进行全面介绍。希望它介绍了所有基本的WordPress主题构建概念，并展示了它们如何团结在一起。

>但仍然有一些东西要学习 - 例如评论部分，作者模板，404页和许多其他小细节，如果我们想更加专业，应该涵盖这个主题。>

>本系列的初始代码可在此处的GitHub上找到，我们在本指南中构建的主题的最终版本可在此处获得。 在这些基础上，可以在综合WordPress法典的帮助下建立更多的基础。

在本系列中有三篇有关从头开始构建WordPress主题的文章：>

>在主题结构

上

主题基础

完善主题

经常询问有关从头开始构建WordPress主题的问题

    如何在WordPress中没有
  • 中的给定页面ID的内容，在WordPress中，给定页面ID的内容通常包裹在A
>中用于样式的标签。但是，如果要在没有包装器的情况下显示内容，则可以使用“ the_content”过滤器。此过滤器允许您从数据库中检索到帖子后，但在将其打印到屏幕之前修改它的内容。这是一个简单的示例，说明如何使用此过滤器删除

>标签：

函数remove_p_tags（$ content）{

return return strip_tags（$ content，'

'） ;
}
add_filter（'the_content'，'remove_p_tags'）;
此代码将从帖子内容中删除所有

标签。请注意，这将影响所有帖子，因此请仔细使用它。

为什么我的头版不加载WordPress？

可能有几个原因，为什么您的前页没有在WordPress中加载。 。以下是一些常见问题及其解决方案：

1。设置不正确：检查您的WordPress设置>读取>读取，并确保将正确的页面设置为首页。

2。主题问题：问题可能与您的主题有关。尝试切换到默认的WordPress主题，看看问题是否持续。插件冲突：有时，插件可能会相互冲突或与您的主题冲突，从而导致您的头版不加载。尝试停用所有插件，然后一一重新激活它们以识别有问题的插件。

4。损坏的.htaccess文件：损坏的.htaccess文件也可能导致此问题。尝试将.htaccess文件重命名为.htaccess_old之类的东西，看看是否可以解决问题。
>
如果这些解决方案都不可用，则最好与您的托管提供商或WordPress专家联系以获取进一步的帮助，这可能是一个好主意。 。

>如何通过使用WordPress函数和JavaScript的组合来实现在WordPress中显示其内容的发布ID？以下是如何执行此操作的基本示例：

首先，您需要获取发布ID。您可以使用WordPress中的get_the_id（）函数来执行此操作。此功能将返回循环中当前帖子的ID。

$ post_id = get_the_id（）;

接下来，您需要获取帖子的内容。您可以使用get_post_field（）函数来执行此操作。此函数从帖子中检索特定字段的值。在这种情况下，您需要获取'post_content'字段。


$ post_content = get_post_field（'post_content'，$ post_id'，$ post_id）;





您可以使用javascript在弹出窗口。这是一个简单的示例，使用alert（）函数：
alert（''）;

请注意，这是一个非常基本的示例，可能不是在所有情况下都能完美工作。对于更强大的解决方案，您可能需要考虑使用插件或更高级的JavaScript库来创建弹出窗口。

以上是如何从头开始构建WordPress主题：最终步骤的详细内容。更多信息请关注PHP中文网其他相关文章！

本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序，用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！

显示更多

热门文章

Windows 11 KB5054979中的新功能以及如何解决更新问题
4 周前 By DDD
如何修复KB5055523无法在Windows 11中安装？
3 周前 By DDD
Inzoi：如何申请学校和大学
1 个月前 By DDD
如何修复KB5055518无法在Windows 10中安装？
3 周前 By DDD
在哪里可以找到Atomfall中的站点办公室钥匙
4 周前 By DDD
显示更多

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版，非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

显示更多

热门话题

gmail邮箱登陆入口在哪里
7888
15
Java教程
1649
14
CakePHP 教程
1410
52
Laravel 教程
1301
25
PHP教程
1247
29
显示更多
Related knowledge
如何开始WordPress博客：初学者的分步指南 如何开始WordPress博客：初学者的分步指南 Apr 17, 2025 am 08:25 AM

博客是人们在网上表达观点、意见和见解的理想平台。许多新手渴望建立自己的网站，却因担心技术障碍或成本问题而犹豫不决。然而，随着平台不断发展以满足初学者的能力和需求，现在开始变得比以往任何时候都更容易。 本文将逐步指导您如何建立一个WordPress博客，从主题选择到使用插件提升安全性和性能，助您轻松创建自己的网站。 选择博客主题和方向 在购买域名或注册主机之前，最好先确定您计划涵盖的主题。个人网站可以围绕旅行、烹饪、产品评论、音乐或任何激发您兴趣的爱好展开。专注于您真正感兴趣的领域可以鼓励持续写作

wordpress文章列表怎么调 wordpress文章列表怎么调 Apr 20, 2025 am 10:48 AM

有四种方法可以调整 WordPress 文章列表：使用主题选项、使用插件（如 Post Types Order、WP Post List、Boxy Stuff）、使用代码（在 functions.php 文件中添加设置）或直接修改 WordPress 数据库。

如何在父分类的存档页面上显示子分类 如何在父分类的存档页面上显示子分类 Apr 19, 2025 pm 11:54 PM

您想了解如何在父分类存档页面上显示子分类吗？在自定义分类存档页面时，您可能需要执行此操作，以使其对访问者更有用。在本文中，我们将向您展示如何在父分类存档页面上轻松显示子分类。为什么在父分类存档页面上显示子分类？通过在父分类存档页面上显示所有子分类，您可以使其不那么通用，对访问者更有用。例如，如果您运行一个关于书籍的WordPress博客，并且有一个名为“主题”的分类法，那么您可以添加“小说”、“非小说”等子分类法，以便您的读者可以

如何在 WordPress 中获取登录用户信息以获得个性化结果 如何在 WordPress 中获取登录用户信息以获得个性化结果 Apr 19, 2025 pm 11:57 PM

最近，我们向您展示了如何通过允许用户将自己喜欢的帖子保存在个性化库中来为用户创建个性化体验。您可以通过在某些地方（即欢迎屏幕）使用他们的名字，将个性化结果提升到另一个水平。幸运的是，WordPress使获取登录用户的信息变得非常容易。在本文中，我们将向您展示如何检索与当前登录用户相关的信息。我们将利用get_currentuserinfo(); 功能。这可以在主题中的任何地方使用（页眉、页脚、侧边栏、页面模板等）。为了使其工作，用户必须登录。因此我们需要使用

对于初学者来说，WordPress容易吗？ 对于初学者来说，WordPress容易吗？ Apr 03, 2025 am 12:02 AM

WordPress对初学者来说容易上手。1.登录后台后，用户界面直观，简洁的仪表板提供所有必要功能链接。2.基本操作包括创建和编辑内容，所见即所得的编辑器简化了内容创建。3.初学者可以通过插件和主题扩展网站功能，学习曲线存在但可以通过实践掌握。

如何在 WordPress 中按帖子过期日期对帖子进行排序 如何在 WordPress 中按帖子过期日期对帖子进行排序 Apr 19, 2025 pm 11:48 PM

过去，我们分享过如何使用PostExpirator插件使WordPress中的帖子过期。好吧，在创建活动列表网站时，我们发现这个插件非常有用。我们可以轻松删除过期的活动列表。其次，多亏了这个插件，按帖子过期日期对帖子进行排序也非常容易。在本文中，我们将向您展示如何在WordPress中按帖子过期日期对帖子进行排序。更新了代码以反映插件中更改自定义字段名称的更改。感谢Tajim在评论中让我们知道。在我们的特定项目中，我们将事件作为自定义帖子类型。现在

如何在 WordPress 中显示查询数量和页面加载时间 如何在 WordPress 中显示查询数量和页面加载时间 Apr 19, 2025 pm 11:51 PM

我们的一位用户询问其他网站如何在页脚中显示查询数量和页面加载时间。您经常会在网站的页脚中看到这一点，它可能会显示类似以下内容：“1.248秒内64个查询”。在本文中，我们将向您展示如何在WordPress中显示查询数量和页面加载时间。只需将以下代码粘贴到主题文件中您喜欢的任何位置（例如footer.php）。queriesin

如何使用 IFTTT 自动化 WordPress 和社交媒体（及更多） 如何使用 IFTTT 自动化 WordPress 和社交媒体（及更多） Apr 18, 2025 am 11:27 AM

您是否正在寻找自动化 WordPress 网站和社交媒体帐户的方法？ 通过自动化，您将能够在 Facebook、Twitter、LinkedIn、Instagram 等平台上自动分享您的 WordPress 博客文章或更新。 在本文中，我们将向您展示如何使用 IFTTT、Zapier 和 Uncanny Automator 轻松实现 WordPress 和社交媒体的自动化。 为什么要自动化 WordPress 和社交媒体？ 自动化您的WordPre

See all articles