高雅人妻的呻吟,国产jizz中国jizz免费看

>如果我們?cè)L問(wèn)主頁(yè)並打開(kāi)瀏覽器控制臺(tái)檢查這些課程，我們會(huì)發(fā)現(xiàn)我們?nèi)鄙龠@些類別中的當(dāng)前模板信息：

>我們可以看到，我們的虛假帖子一般都沒(méi)有任何圖像，並且沒(méi)有特色圖像

customizer

首頁(yè)

CMS教程

＆＃＆按

如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟

Christopher Nolan

Feb 09, 2025 am 09:42 AM

如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟

>在本文中，我們將完成從頭開(kāi)始構(gòu)建WordPress主題的嘗試，重點(diǎn)是完善我們的模板，添加元信息，縮寫(xiě)縮略圖，側(cè)邊欄，用戶友好的控件等等。

這是有關(guān)構(gòu)建WordPress主題的WordPress系列的第三部分也是最後一部分。第1部分引入了WordPress主題，在第2部分中，我們構(gòu)建了一個(gè)基本主題。我們使用StartBootStrap使用乾淨(jìng)的博客模板為WordPress主題添加樣式。到目前為止，我們已經(jīng)編寫(xiě)的代碼可在GitHub上找到。

>我們已經(jīng)添加了single.php，page.php，archive.php和index.php模板，但是我們將其保留為任務(wù)的這一部分的任務(wù)。我們介紹了function.php - WordPress用來(lái)自動(dòng)包含特定功能的文件，並在其中添加了功能。我們?cè)趆eader.php中添加了動(dòng)態(tài)標(biāo)頭函數(shù)，然後將該功能分開(kāi)到我們的functions.php中。理想情況下，應(yīng)該將其組織到一個(gè)單獨(dú)的文件中 - 可能在我們主題內(nèi)的Inc文件夾中 - 以保持一切清潔。

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

鑰匙要點(diǎn)

>利用`functions.php`來(lái)添加特定於主題的功能，並有效地將代碼組織到單獨(dú)的文件中以進(jìn)行清潔結(jié)構(gòu)。

>實(shí)現(xiàn)模板零件，用於一致和模塊化的HTML結(jié)構(gòu)，例如`single.php`和`Index.php`。
>使用'add_theme_support（'Post-thumbnails'）啟用和管理WordPress主題中的縮略圖；

>如果我們?cè)L問(wèn)主頁(yè)並打開(kāi)瀏覽器控制臺(tái)檢查這些課程，我們會(huì)發(fā)現(xiàn)我們?nèi)鄙龠@些類別中的當(dāng)前模板信息：

要更改WordPress顯示的內(nèi)容，我們需要知道正在使用哪些文件。在我們的情況下，index.php用作默認(rèn)的後備模板。該信息圖顯示了使用的模板的層次結(jié)構(gòu)。覆蓋或創(chuàng)建主題時(shí)，它可能非常方便。

>在上一篇文章中，我們開(kāi)始完善Archive.php循環(huán)，添加元信息並在輸出文章中發(fā)布縮略圖。我們將該循環(huán)分為一個(gè)單獨(dú)的文件，將其包括在Archive.php和index.php中，然後完成完善。

>首先，我們將用一行請(qǐng)求部分文件的單行替換兩個(gè)文件中的內(nèi)容，因此index.php看起來(lái)像這樣：>

>完成此操作後，我們將將已替換為Archive.php中的內(nèi)容放入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>

>我們將這些更改上傳到服務(wù)器後，我們將看到我們的首頁(yè)，在帖子列表中的每個(gè)帖子中，都有元信息 - 日期和作者鏈接：

<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>

如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟這意味著我們的部分作品。

張貼縮略圖

>我們可以看到，我們的虛假帖子一般都沒(méi)有任何圖像，並且沒(méi)有特色圖像

。如果我們轉(zhuǎn)到WordPress儀表板，然後嘗試將特色image

添加到我們的帖子/頁(yè)面，我們將看到最右邊的側(cè)欄中沒(méi)有文件上傳字段。（對(duì)於那些不熟悉WordPress的人，可以在此處閱讀有關(guān)此功能的更多信息。）> 在WordPress主題中默認(rèn)啟用了未啟用縮略圖。這是一個(gè)需要專門(mén)打開(kāi)新主題的功能。大多數(shù)主題都啟用了它。 為此，我們包括add_theme_support（'Post-thumbnails'）;在我們的functions.php。 上行

現(xiàn)在啟用了縮略圖。

>現(xiàn)在，我們可以使用WP-CLI命令WP站點(diǎn)空的WORDPRESS安裝所有內(nèi)容的安裝-Alower-root（或者我們可以從WordPress儀表板手動(dòng)執(zhí)行），並用FakerPress將其重新填充。它應(yīng)該用它從互聯(lián)網(wǎng)上獲取的特色圖像填充帖子和頁(yè)面。（我們需要像以前一樣重新創(chuàng)建頂部菜單，並為其分配頁(yè)面和帖子。）

一個(gè)提示：如果我們正在構(gòu)建待售主題，或者通常會(huì)發(fā)布給更廣泛受眾的主題，我們可能想使用Automattic提供的主題單元測(cè)試數(shù)據(jù)

，因?yàn)樗赡軙?huì)提供用於測(cè)試案例和主題詳細(xì)信息範(fàn)圍的內(nèi)容。

我們可以將圖像大小指定為Fakerpress，但它很可能仍然會(huì)導(dǎo)致雜亂的外觀。

>當(dāng)我們構(gòu)建主題時(shí)，用於實(shí)現(xiàn)拋光，標(biāo)準(zhǔn)化外觀的技術(shù)之一是指定>縮略圖。這些是標(biāo)準(zhǔn)尺寸WordPress，將調(diào)整所有上傳圖像以適合。我們將使用WordPress

add_image_size（）

>函數(shù)添加我們主題將使用的幾個(gè)圖像大?。?/p>

<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中使用> >要在我們的存檔或博客列表中實(shí)現(xiàn)一個(gè)格式摘要

<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>

，我們將增加字體的大小，但是為此，我們將減少由： >能夠浮動(dòng)圖像（我們剛才提到的縮略圖）和摘錄，我們將以下內(nèi)容添加到我們的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>

（我們?cè)谶@裡不介紹對(duì)主題本身至關(guān)重要的較小樣式調(diào)整。）

現(xiàn)在，我們可以增加字體大小，並通過(guò)浮動(dòng)圖像（與A apent元素一起浮動(dòng)圖像）圍繞圖像進(jìn)行漂浮

<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>

>以後我們還將在單帖子/頁(yè)面上使用post_thumbnails。

主題側(cè)欄

主題側(cè)邊欄是主題中的寬度區(qū)域。它們需要在WordPress系統(tǒng)中註冊(cè)，以便我們可以將不同的小部件放置到這些區(qū)域。一旦這樣做，我們就會(huì)在模板文件中打印或輸出這些小部件。如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟 >我們將在主題中註冊(cè)許多側(cè)欄，可以在主題的GitHub存儲(chǔ)庫(kù)中看到。我們通過(guò)將以下代碼添加到我們的functions.php：來(lái)做到這一點(diǎn)。

>在這裡，我們展示瞭如何註冊(cè)兩個(gè)側(cè)邊欄。有關(guān)register_sidebar（）函數(shù)的更多詳細(xì)信息可以在wordpress.org。

我們?cè)]冊(cè)了11個(gè)側(cè)邊欄，但是我們不需要在所有頁(yè)面模板或網(wǎng)站位置中輸出所有這些側(cè)欄。如果它們是在當(dāng)前自定義頁(yè)面中輸出的，則可以在小部件下的

customizer

中訪問(wèn)：

<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中側(cè)邊欄或小部件區(qū)域的實(shí)際輸出的一個(gè)示例 - 這意味著它可以在全球顯示：

>在這裡，我們使用了上面的bottom_center_sidebar中使用的側(cè)欄ID。 > >我們還根據(jù)主欄是否有活躍的小部件（IS_ACTIVE_SIDEDBAR（））來(lái)調(diào)節(jié)主頁(yè)上的中央內(nèi)容容器的寬度：

>我們輸出依賴於這些條件的Bootstrap類，確保如果我們省略為頁(yè)面設(shè)置小部件，例如如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟 > home

>。

>我們用小部件和圖像填充這些小部件區(qū)域後，這就是我們得到的：

<span><span>.home .post-preview.post</span> {
</span>    <span>overflow: hidden;
</span><span>}
</span>

主題的塑造很好。讀者當(dāng)然會(huì)適應(yīng)他們喜歡的樣式。

> 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>

>當(dāng)我們談?wù)摌邮綍r(shí)，我們將提及“定制器API”，並展示如何使用它來(lái)對(duì)標(biāo)題的用戶友好控制。

這是我們?nèi)绾蝿?chuàng)建新的面板，pance和 control的一個(gè)示例（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>

>這裡的主要內(nèi)容是customize_register鉤子，$ wp_customize方法的順序（add_panel，add_section，add_setting，add_control。訂單效果。

>在functions.php中添加設(shè)置和控件後，我們將以下代碼添加到BSIMPLE_SCRIPTS（）函數(shù)的底部，我們創(chuàng)建了為了加入我們的腳本和樣式：

>我們?cè)跇?biāo)題容器中添加了phome，pfront和pglobal類。現(xiàn)在，我們使用

<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（）和我們用來(lái)在開(kāi)始時(shí)使用基本主題樣式的Bsimple風(fēng)格的手柄 - 輸出我們剛剛創(chuàng)建的定制器設(shè)置。我們使用get_theme_mod（）獲取我們?cè)]冊(cè)的每個(gè)設(shè)置。

> 這樣，我們可以為指南中的Dynamic_header（）函數(shù)分開(kāi)的標(biāo)題設(shè)置圖像：

單頁(yè)和帖子

> WordPress模板層次結(jié)構(gòu)可幫助我們定位訪問(wèn)時(shí)加載的確切URL並發(fā)布的發(fā)布，以便我們可以原子設(shè)計(jì)每個(gè)其中的HTML輸出。很多時(shí)候，我們不需要?jiǎng)?chuàng)建所有模板。 >

>為所有帖子或頁(yè)面添加通用背景圖像是沒(méi)有意義的。因此，我們的自定義策略將用於檔案，用於帖子的博客列表，首頁(yè)甚至是術(shù)語(yǔ)。但是對(duì)於特定的頁(yè)面和帖子，我們可能希望單獨(dú)設(shè)置圖像。

<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>

我們?cè)撛觞N做？

>

>在我們的Dynamic_header（）函數(shù)中，我們已經(jīng)為

> pages

>的標(biāo)題指定了，所以現(xiàn)在我們將使用內(nèi)聯(lián)樣式和get_the_post_thumbnail_url（）函數(shù)來(lái)設(shè)置頁(yè)面'

特色圖像

??>作為標(biāo)題背景：

現(xiàn)在，用戶可以為每個(gè)頁(yè)面設(shè)置標(biāo)頭圖像。我們可以為IS_Single（）案例做同樣的事情，該案例將對(duì)所有帖子應(yīng)用相同的解決方案（包括自定義帖子類型）。 >此行將允許用戶在每個(gè)頁(yè)面，名稱subtitle_添加自定義字段，並將其輸出到頁(yè)面標(biāo)題：>

<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>

如果我們看不到“自定義字段”部分，我們可以在編輯屏幕的右上角通過(guò)

屏幕選項(xiàng)

<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>

完成此操作後，我們將在單個(gè)頁(yè)面上查看下面的subtitle_ meta字段：如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟 >

所有這些東西以及樣式 - 也可以應(yīng)用於

帖子

> 如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟 >

我們現(xiàn)在需要在single.php和pagp.php中格式化輸出

由於本指南的空間約束，我們將創(chuàng)建將在這兩個(gè)模板中使用的內(nèi)容，但是該結(jié)構(gòu)將允許讀者在需要時(shí)更具體地適應(yīng)和自定義這些模板：>

<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類為中心。我們使用部分內(nèi)容single.php來(lái)輸出實(shí)際內(nèi)容。

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

>現(xiàn)在，我們有針對(duì)單頁(yè)和帖子的最低限度，但是可以使用WordPress函數(shù)添加更多最低限度。我們可以自動(dòng)指定我們希望WordPress在單個(gè)帖子，單頁(yè)和屬於特定類別等的頁(yè)面中輸出的細(xì)節(jié)等

<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>

>全局小部件和頁(yè)腳

>我們?yōu)轫?yè)腳創(chuàng)建了三個(gè)小部件（側(cè)欄）區(qū)域，並將輸出添加到footer.php中。我們還在頁(yè)腳標(biāo)籤上方添加了一個(gè)部分或小部件區(qū)域。這些小部件不是特定於主頁(yè)，頁(yè)面或檔案，而是全球性的。一旦我們將小部件分配給它們，他們將顯示範(fàn)圍內(nèi)的網(wǎng)站：

我們得到的是一個(gè)簡(jiǎn)單的底部和頁(yè)腳區(qū)域，我們可以用窗口小部件填充：

<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>

我們現(xiàn)在有一個(gè)最小但功能性的主題，可以用來(lái)顯示內(nèi)容。如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟本指南將在這裡停止，但是接下來(lái)的事物可能要做的是確保所有用例涵蓋所有用例，並且該主題是100％全功能的。為此，安裝主題檢查插件以及其他工具，以檢查我們的主題缺少的內(nèi)容，並確保一切都符合標(biāo)準(zhǔn)：

結(jié)論

如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟 >本指南的目的是對(duì)WordPress主題構(gòu)建進(jìn)行全面介紹。希望它介紹了所有基本的WordPress主題構(gòu)建概念，並展示了它們?nèi)绾螆F(tuán)結(jié)在一起。

>但仍然有一些東西要學(xué)習(xí) - 例如評(píng)論部分，作者模板，404頁(yè)和許多其他小細(xì)節(jié)，如果我們想更加專業(yè)，應(yīng)該涵蓋這個(gè)主題。 >

>本系列的初始代碼可在此處的GitHub上找到，我們?cè)诒局改现袠?gòu)建的主題的最終版本可在此處獲得。在這些基礎(chǔ)上，可以在綜合WordPress法典的幫助下建立更多的基礎(chǔ)。

在本系列中有三篇有關(guān)從頭開(kāi)始構(gòu)建WordPress主題的文章：>

>在主題結(jié)構(gòu)

上

主題基礎(chǔ)

完善主題

經(jīng)常詢問(wèn)有關(guān)從頭開(kāi)始構(gòu)建WordPress主題的問(wèn)題

中的給定頁(yè)面ID的內(nèi)容，在WordPress中，給定頁(yè)面ID的內(nèi)容通常包裹在A

>中用於樣式的標(biāo)籤。但是，如果要在沒(méi)有包裝器的情況下顯示內(nèi)容，則可以使用“ the_content”過(guò)濾器。此過(guò)濾器允許您從數(shù)據(jù)庫(kù)中檢索到帖子後，但在將其打印到屏幕之前修改它的內(nèi)容。這是一個(gè)簡(jiǎn)單的示例，說(shuō)明如何使用此過(guò)濾器刪除

>標(biāo)籤：

函數(shù)remove_p_tags（$ content）{

return return strip_tags（$ content，'

'） ;
}
add_filter（'the_content'，'remove_p_tags'）;
此代碼將從帖子內(nèi)容中刪除所有

標(biāo)籤。請(qǐng)注意，這將影響所有帖子，因此請(qǐng)仔細(xì)使用它。

為什麼我的頭版不加載WordPress？

可能有幾個(gè)原因，為什麼您的前頁(yè)沒(méi)有在WordPress中加載。。以下是一些常見(jiàn)問(wèn)題及其解決方案：

1。設(shè)置不正確：檢查您的WordPress設(shè)置>讀取>讀取，並確保將正確的頁(yè)面設(shè)置為首頁(yè)。

2。主題問(wèn)題：?jiǎn)栴}可能與您的主題有關(guān)。嘗試切換到默認(rèn)的WordPress主題，看看問(wèn)題是否持續(xù)。插件衝突：有時(shí)，插件可能會(huì)相互衝突或與您的主題衝突，從而導(dǎo)致您的頭版不加載。嘗試停用所有插件，然後一一重新激活它們以識(shí)別有問(wèn)題的插件。

4。損壞的.htaccess文件：損壞的.htaccess文件也可能導(dǎo)致此問(wèn)題。嘗試將.htaccess文件重命名為.htaccess_old之類的東西，看看是否可以解決問(wèn)題。
>
如果這些解決方案都不可用，則最好與您的託管提供商或WordPress專家聯(lián)繫以獲取進(jìn)一步的幫助，這可能是一個(gè)好主意。。

>如何通過(guò)使用WordPress函數(shù)和JavaScript的組合來(lái)實(shí)現(xiàn)在WordPress中顯示其內(nèi)容的發(fā)布ID？以下是如何執(zhí)行此操作的基本示例：

首先，您需要獲取發(fā)布ID。您可以使用WordPress中的get_the_id（）函數(shù)來(lái)執(zhí)行此操作。此功能將返回循環(huán)中當(dāng)前帖子的ID。

$ post_id = get_the_id（）;

接下來(lái)，您需要獲取帖子的內(nèi)容。您可以使用get_post_field（）函數(shù)來(lái)執(zhí)行此操作。此函數(shù)從帖子中檢索特定字段的值。在這種情況下，您需要獲取'post_content'字段。

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

您可以使用javascript在彈出窗口。這是一個(gè)簡(jiǎn)單的示例，使用alert（）函數(shù)：
alert（''）;

請(qǐng)注意，這是一個(gè)非常基本的示例，可能不是在所有情況下都能完美工作。對(duì)於更強(qiáng)大的解決方案，您可能需要考慮使用插件或更高級(jí)的JavaScript庫(kù)來(lái)創(chuàng)建彈出窗口。

以上是如何從頭開(kāi)始構(gòu)建WordPress主題：最終步驟的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！

本網(wǎng)站聲明

本文內(nèi)容由網(wǎng)友自願(yuàn)投稿，版權(quán)歸原作者所有。本站不承擔(dān)相應(yīng)的法律責(zé)任。如發(fā)現(xiàn)涉嫌抄襲或侵權(quán)的內(nèi)容，請(qǐng)聯(lián)絡(luò)admin@php.cn