什麼是視差效果？

視差效果是現代網頁設計技術，其中背景滾動速度比前景內容慢。這種效果可以增加背景圖像的深度，使其更具互動性。視差效果可以用於登陸頁面、長篇內容、銷售頁面或者商業網站的首頁。

方法一：使用插件為 WordPress 主題添加視差效果

這種方法不需要向您的 WordPress 主題添加任何代碼，適合大多數用戶。首先，您需要安裝並激活Advanced WordPress Backgrounds 插件。

激活後，從 WordPress 儀表板訪問設置 » AWB頁面。在這裡，您可以檢查不希望顯示視差效果的瀏覽器或設備的選項框。之後，打開編輯任何您喜歡的頁面或文章，在古騰堡塊編輯器中添加一個Background (AWB)塊，並根據需要設置背景圖像、顏色或視頻。

方法二：使用 CSS 為 WordPress 主題添加視差效果

如果您希望在整個網站中使用同一圖像作為視差背景，這種方法適合您。首先，您需要將圖像上傳到您的 WordPress 媒體庫，然後複製其 URL。接著，使用 WPCode 插件添加自定義 CSS 代碼：

.parallax { background-image: url("http://example.com/your-image.jpg"); height: 100%; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } .parallax-content { width: 50%; margin: 0 auto; color: #FFF; padding-top: 50px; }

然後在您需要添加視差效果的頁面或文章中，插入以下 HTML 代碼：

您的內容在這裡...

附加：在 WordPress 中添加 YouTube 視頻作為全屏背景

除了視差效果，您還可以在 WordPress 中添加 YouTube 視頻作為全屏背景，提供更身臨其境的體驗並提高視覺吸引力。這適用於各種情況，例如舉辦活動、展示非營利組織的影響力和故事等。

希望這篇文章能幫助您輕鬆地在任意 WordPress 主題中添加視差效果。如果您喜歡這篇文章，請訂閱我們的 YouTube 頻道以獲取 WordPress 視頻教程，您還可以在 Twitter 和 Facebook 上找到我們。

如何自訂 WordPress 主題中的引用樣式

更新日期：2024年3月11日

編輯團隊 | 專家審核：Syed Balkhi

您是否正在尋找一種方法來自訂 WordPress 主題中的引用樣式？

引用往往是文章中最令人難忘的部分，也是任何博客文章或頁面中分享最多的部分。這就是為什麼報紙和主流媒體網站會自訂引用樣式，使其更突出。

為什麼要在 WordPress 中使用並自訂引用樣式？

在內容中使用引用可以改善您網站的用戶體驗。您可以使用它們來使選定的文本部分從其餘內容中脫穎而出，吸引讀者的注意力。

例如，您可以使用引用來引用作者和影響者的話語、出版物中的引文、客戶的推薦或向訪問您的博客的讀者強調有價值的信息。

使用引用的另一個好處是可以增加社交互動。允許用戶在 Twitter 或 Facebook 上分享引用可以幫助您獲得更多的關注者並提高品牌的社交媒體可見度。

WordPress 默認在內容編輯器中提供了一個引用塊。要添加它，只需進入 WordPress 編輯器並在內容中插入引用塊。

方法一：使用插件自訂引用樣式

自訂 WordPress 網站中的引用樣式的一種簡單方法是使用像 Spectra – WordPress Gutenberg Blocks 這樣的插件。這是一個免費的 WordPress 插件，會在內容編輯器中添加額外的塊，包括可自訂的引用塊。

首先，您需要安裝並啟用 Spectra – WordPress Gutenberg Blocks 插件。啟用後，從 WordPress 管理員側邊欄訪問 Spectra » Blocks 頁面。

打開喜歡的頁面或文章編輯，然後點擊屏幕左上角的 “+” 按鈕，將引用塊添加到您的內容中。接下來，在引用區域輸入文本，然後從右側面板中配置引用塊的佈局。

在右側面板中的“樣式”選項卡中，您可以更改引用圖標大小、背景大小等。最後，點擊頂部的“發布”或“更新”按鈕來保存您的設置。

方法二：使用自訂 CSS 自訂引用樣式

如果您不想使用 WordPress 插件，則添加自訂 CSS 是另一種自訂引用樣式的方法。使用 WPCode 插件可以輕鬆地添加自訂 CSS 代碼。首先，您需要安裝並啟用 WPCode 插件。

啟用後，從 WordPress 管理員側邊欄訪問 Code Snippets » + Add Snippet 頁面。在“添加您的自訂代碼（新片段）”下點擊“使用片段”按鈕，然後選擇代碼類型為 “CSS 片段”，並在“代碼預覽”框中輸入自訂的 CSS 代碼。

在插入選項中選擇“自動插入”模式，這樣代碼激活後將自動更改引用塊的外觀。最後，將“非活動”切換至“活動”並點擊“保存片段”按鈕。

您現在可以在 WordPress 頁面或文章中插入引用塊，然後訪問您的網站以查看已自訂的引用樣式。

附加：在 WordPress 側邊欄中顯示隨機引用

如果您想在側邊欄中顯示客戶的推薦，可以安裝並啟用 Quotes and Tips 插件。啟用後，訪問 Quotes » Add New 頁面，在文本編輯器中輸入客戶的引用，然後點擊“發布”按鈕。接下來，複製 Quotes » Settings 頁面中的短代碼，並將其粘貼到您喜歡的側邊欄或小工具區域中。

我們希望這篇文章能幫助您學習如何在 WordPress 主題中自訂引用樣式。您還可以瀏覽我們的指南，了解如何選擇最佳設計軟件以及最佳免費網站託管服務。

如果您喜歡這篇文章，請訂閱我們的 YouTube 頻道以獲取 WordPress 視頻教程。您也可以在 Twitter 和 Facebook 上找到我們。

如何讓用戶訂閱標籤和分類

這個教程涉及在您的WordPress網站中添加代碼。根據您的需求，可以添加不同類型的代碼，但我們將使用WPCode來安全地插入這些代碼。

WPCode是最好的WordPress代碼片段插件，允許您添加自訂CSS、PHP、HTML等，不會對您的網站構成風險。許多教程會要求您編輯主題文件，但這可能會導致各種常見的WordPress錯誤。在最壞的情況下，可能使您的WordPress網站完全無法訪問。

首先，您需要安裝並啟動免費的WPCode插件。更多信息請參考我們的分步指南如何安裝WordPress插件。

使用WPCode讓用戶訂閱標籤和分類

啟用後，前往代碼片段 > 添加片段。您將看到WPCode內建的代碼片段庫，其中包括許多有用的片段，例如完全禁用評論、上傳WordPress通常不支持的文件類型、禁用附件頁等。

只需將鼠標懸停在‘添加自訂代碼（新片段）’選項上，然後當‘使用片段’按鈕出現時點擊它。

方法1：在標籤存檔添加RSS訂閱鏈接

一個解決方案是在您的標籤存檔頁面添加一個簡單的RSS‘訂閱’鏈接。這些頁面顯示所有具有相同標籤的文章。例如，www.example.com/tag/wordpress會列出所有具有‘WordPress’標籤的文章。

在WPCode中創建一個自訂片段後，為PHP片段輸入標題。這只是為了您的參考，所以您可以使用任何您喜歡的標題。接著，打開‘代碼類型’下拉菜單並選擇‘PHP片段’。

完成後，將以下代碼粘貼到代碼編輯器中：

$tag_id = get_query_var(‘tag_id’);

echo ‘

‘;

接著，滾動到‘插入’框，選擇‘自動插入’（如果尚未選中）。您可以打開‘位置’下拉菜單，選擇‘文章前’在類別、存檔、標籤、分類部分。之後，在‘文章前編號’中插入‘1’。這將確保按鈕顯示在標籤標題之後並在第一篇文章之前。

要僅在標籤頁面顯示鏈接，滾動到‘智能條件邏輯’部分。在這裡，點擊‘啟用邏輯’滑塊。然後打開‘條件’下拉菜單並選擇‘顯示’。之後，點擊‘添加新組’。

現在，打開接下來的一組下拉菜單，選擇‘分類頁面’，‘是’，以及‘標籤’。這將只將代碼添加到您的標籤存檔頁面。

完成後，滾動到屏幕頂部使片段生效。然後點擊‘未啟用’切換，使其變為‘啟用’，然後點擊‘保存片段’按鈕。現在，如果您訪問任何標籤頁面，您將看到新的‘訂閱’鏈接。

方法2：在WordPress標籤頁面中添加RSS圖標

另一個選項是在標籤頁面中添加RSS圖標，這比一個簡單的‘訂閱’鏈接更引人注目。

若要在WordPress標籤頁面中添加RSS圖標，首先需要上傳您想要使用的圖標。您可以使用任何圖標，但可以在官方RSS網站找到PNG格式的標誌。一旦有了標誌，只需將文件上傳到WordPress媒體庫。您將需要獲得圖片的URL，因為會在下一步中使用它。

完成後，按照上述過程在WPCode中創建一個新的PHP代碼片段，但這次在WPCode編輯器中粘貼以下片段：

$tag_id = get_query_var(‘tag_id’);

echo ‘

‘;

您需要將http://example.com URL替換為您在上一步中上傳的RSS圖標鏈接。同樣，將代碼設置為僅在標籤頁面運行，然後發布它，按照上述過程進行。現在，如果您訪問任何標籤頁面，您將看到RSS圖標已經顯示出來。

方法3：在自訂分類存檔中添加RSS訂閱鏈接

您還可以在WordPress網站的自訂分類存檔中添加RSS訂閱。為此，您需要按照上述過程創建一個新的PHP片段，但這次將以下代碼添加到WPCode中：

$term = get_term_by(‘slug’, get_query_var(‘term’), get_query_var(‘taxonomy’));

echo ‘

‘;

如果您希望顯示RSS圖標而不是純文本，只需將‘訂閱’文本替換為圖片標籤，如上一節所述。在‘智能條件邏輯’部分，確保選擇‘分類頁面’，‘是’，並選擇您自訂分類的名稱，如下所示：

然後，啟用代碼片段并保存您的變更。

學習更多RSS技巧和技巧

想充分利用您的WordPress RSS訂閱功能嗎？以下是您應該查看的一些教程：

• 最佳WordPress RSS插件比較
• 如何完全自訂您的WordPress RSS訂閱
• 如何為每個自訂文章類型創建單獨的RSS訂閱
• 優化WordPress RSS訂閱的小技巧（快速簡便）
• 如何僅向RSS訂閱者顯示內容
• 如何為每個分類創建單獨的RSS訂閱
• 如何為您的WordPress RSS訂閱設置自動發現

我們希望這個教程能幫助您學習如何為標籤和自訂分類存檔新增RSS訂閱。您還可以學習如何改進網站的SEO或查看我們的專家推薦的最佳WordPress RSS插件。

如果您喜歡這篇文章，請訂閱我們的YouTube頻道以獲取WordPress視頻教程。您也可以在Twitter和Facebook找到我們。

如何在 WordPress 上建立全寬頁面（初學者指南）

最後更新於 2024 年 1 月 16 日，編輯團隊 | 審閱者：Syed Balkhi

你想在 WordPress 上建立一個全寬頁面，讓你的內容橫跨整個螢幕嗎？大多數 WordPress 主題已內建全寬頁面模板，但如果你的主題沒有，也可以輕鬆添加。在這篇文章中，我們將展示如何輕鬆地在 WordPress 中建立全寬頁面，甚至不用寫代碼就能創建完全自定義的頁面佈局。

以下是本指南中的方法概覽：

• 方法 1. 使用主題的全寬模板
• 方法 2. 使用插件創建全寬頁面模板
• 方法 3. 使用頁面構建插件設計全寬頁面
• 方法 4. 使用 SeedProd 創建完全自定義的全寬頁面
• 方法 5. 手動創建全寬 WordPress 頁面模板

方法 1. 使用主題的全寬模板

如果你的主題已內建全寬頁面模板，那麼最好直接使用它。大多數優質的 WordPress 主題都包含這個模板，甚至許多免費主題也是如此。

首先，你需要在 WordPress 儀表板中編輯一個頁面或創建一個新的頁面，依次點擊「頁面」»「添加新頁面」。

在右側「文件」窗格中，點擊「頁面屬性」部分旁邊的向下箭頭以展開。你應該能看到一個「模板」下拉選單，如果你的主題有全寬模板，它會在這裡列出，如「全寬模板」。

如果你的主題沒有全寬頁面模板，請放心，你可以使用以下方法輕鬆添加。

方法 2. 使用插件創建全寬頁面模板

這是最簡單的方法，適用於所有 WordPress 主題和頁面構建插件。

首先，你需要安裝並啟用 Fullwidth Templates 插件。查看我們的初學者指南，學習如何安裝 WordPress 插件。

這個插件會添加三個新的頁面模板選項：

• FW No Sidebar: 移除側邊欄，但保留其他內容。
• FW Fullwidth: 移除側邊欄、標題和評論，並將佈局拓展至全寬。
• FW Fullwidth No Header Footer: 除了移除 FW Fullwidth 的所有元素外，還會移除頁首和頁尾。

如果你只打算使用內建的 WordPress 編輯器，「FW No Sidebar」可能是最佳選擇，但這個插件提供的自定義選項有限。

如果你想在不寫代碼的情況下自定義你的全寬模板，則需要使用頁面構建插件。

方法 3. 使用頁面構建插件設計全寬頁面

如果你的主題沒有全寬模板，那麼這是最簡單的方法，可以用於創建和自定義全寬模板。

這允許你輕鬆編輯全寬頁面，並通過拖放界面為你網站創建不同的頁面佈局。

在這篇教程中，我們將使用 Thrive Architect 這款拖放頁面構建插件，它可以幫助你輕鬆創建頁面佈局，無需編寫代碼。

首先，安裝並啟用 Thrive Architect 插件。更多詳情，請參見我們的逐步指南。

啟用後，編輯現有頁面或創建一個新頁面，然後點擊「啟動 Thrive Architect」按鈕。

接著，你會被要求選擇頁面類型，可以選擇創建普通頁面或預建登錄頁面。點擊「預建登錄頁面」選項。

這將帶你進入 Thrive Architect 的登錄頁面庫，從這裡可以選擇一個預製模板作為全寬頁面的基礎。

選擇一個喜歡的模板，點擊應用模板按鈕，頁面構建器將自動加載它。

方法 4. 使用 SeedProd 創建完全自定義的全寬頁面

雖然 Thrive Architect 是一個不錯的選擇，但你可能會尋找更強大的自定義選項。 SeedProd 就是這樣一個強大的插件。

SeedProd 是最好的 WordPress 登錄頁面插件，提供了易於使用的拖放頁面構建界面。

首先安裝並啟用 SeedProd 插件。啟用後，前往 SeedProd » 頁面，添加新的登錄頁面。你可以從300多個預建模板中選擇，包括許多全寬選項，或從頭創建自定義全寬頁面。

方法 5. 手動創建全寬 WordPress 頁面模板

如果上述方法均不適合你，可以手動編輯 WordPress 主題文件，需要基礎的 PHP、CSS 和 HTML 知識。如果你從未做過這類操作，請查看我們的代碼複制/粘貼指南。

首先，用純文本編輯器如 Notepad 打開一個空白文件，粘貼以下代碼：

<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>

將該文件保存為 full-width.php 在電腦上。

這段代碼定義了模板文件的名稱並告訴 WordPress 獲取頁首模板。

接著，使用 FTP 客戶端（或 WordPress 主機文件管理器）連接網站，導航至 /wp-content/themes/你的主題文件夾/。找到 page.php 文件，複製除了 get_header() 行外的所有代碼，粘貼到 full-width.php 文件中。

在 full-width.php 文件中，找到並刪除 get_sidebar() 行，這行代碼會從主題中顯示側邊欄，刪除它後，全寬模板不會顯示側邊欄。

接下來，上傳 full-width.php 文件到你的主題文件夾，然後在 WordPress 儀表板中編輯或創建一個新的頁面。在「文件」窗格中，選擇「頁面屬性」→「模板」下拉選單，選擇新創建的「全寬模板」。

發布或更新頁面後，你會看到側邊欄消失，頁面呈現為單列佈局，然後你可以使用 CSS 進一步調整佈局。

希望這篇文章能幫助你學習如何在 WordPress 中輕鬆創建全寬頁面。你可能也想了解如何增加 WordPress 插件來擴展網站功能，以及最佳的 WordPress LMS 插件比較。

為什麼要在 WordPress 中顯示相關文章？

當您的 WordPress 博客開始成長時，用戶可能會發現很難找到有關同一主題的其他文章。在每篇博客文章的末尾顯示相關內容列表是一種讓訪問者留在您的網站並增加頁面瀏覽量的好方法。它還有助於通過顯示您最佳內容的位置來提高最重要頁面的可見性，使人們輕鬆找到它們。

如果您不熟悉代碼，那麼選擇一個可以顯示相關文章的 WordPress 插件會更簡單。但如果您想知道是否可以不使用插件來顯示相關文章，我們將分享兩種使用代碼生成帶縮圖的相關文章的方法：

方法 1：如何按標籤在 WordPress 中顯示相關文章

一種有效定位相關內容的方法是查找共享相同標籤的其他文章。標籤通常用於聚焦於文章中的特定細節。考慮到這一點，您可能希望為想要彼此相關的文章添加一些共同的標籤。可以在 WordPress 編輯器中的 “標籤” 框中輸入它們。

在為您的文章添加標籤後，接下來要做的是將以下代碼片段添加到您的主題的 single.php 模板中。如果需要幫助將代碼添加到您的網站，請參閱我們的指南，了解如何將網絡上的片段粘貼到 WordPress 中。

$orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);
if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
'tag__in' => $tag_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=>5,
'ignore_sticky_posts'=>1
);
$my_query = new wp_query( $args );
if( $my_query->have_posts() ) {

';
}
}
$post = $orig_post;
wp_reset_query();

這段代碼查找與頁面關聯的標籤，然後運行數據庫查詢以提取具有相似標籤的頁面。您應該將代碼放在哪裡？這取決於您的主題，但在大多數情況下，您應該可以將代碼粘貼到您主題的 single.php 模板中的主要文章之後和評論區之前。如果您使用的是 Twenty Twenty-One 主題，那麼將代碼粘貼到 template-parts/content/content-single.php 文件中的標題和

這將自動顯示任何 WordPress 文章上的相關內容。您需要添加自定義 CSS 以更改相關文章的樣式和外觀，使其與您的主題匹配。

提示：

我們建議使用像 WPCode 這樣的代碼片段插件，而不是編輯您的主題文件，這樣可能會破壞您的網站。WPCode 使在 WordPress 中添加自定義代碼變得安全和簡單。而且，它附帶的 “插入” 選項可讓您自動在 WordPress 網站的特定位置插入和執行片段，例如在文章之後。更多詳情，請參閱我們的指南了解如何在 WordPress 中添加自定義代碼。您還可以查看我們詳細的 WPCode 評測以深入了解該插件。

方法 2：如何按分類在 WordPress 中顯示相關文章

顯示相關內容的另一種方法是列出同一分類中的文章。這種方法的優點是相關文章列表幾乎不會為空。像方法 1 一樣，您需要將一個代碼片段添加到您的主題的 single.php 模板或像 WPCode 這樣的代碼片段插件中。更多詳情，請參閱方法 1 和我們的指南瞭解如何在 WordPress 中添加自定義代碼。

$orig_post = $post;
global $post;
$categories = get_the_category($post->ID);
if ($categories) {
$category_ids = array();
foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;
$args=array(
'category__in' => $category_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=> 2,
'ignore_sticky_posts'=>1
);
$my_query = new wp_query( $args );
if( $my_query->have_posts() ) {
echo '

';
}
}
$post = $orig_post;
wp_reset_query();

專家指導：關於在 WordPress 中顯示相關文章

想了解更多關於在 WordPress 中顯示相關文章的信息？查看這些有幫助的教程：

• 如何在 WordPress 中顯示相關文章（逐步指南）
• 如何在 WordPress 中按同一作者顯示相關文章
• 如何將內嵌相關文章添加到 WordPress 博客帖子中
• 如何在 WordPress 中顯示隨機文章
• 如何在 WordPress 中顯示相關頁面

希望這個教程幫助您了解如何在不使用插件的情況下在 WordPress 中顯示縮圖相關文章。您可能還想了解如何追蹤您的 WordPress 網站訪問者，或查看我們的網站加速 24 個技巧清單。

如果您喜歡這篇文章，請訂閱我們的 YouTube 頻道了解 WordPress 影片教程。您也可以在 Twitter 和 Facebook 上找到我們。

尋找適合你的 WordPress 主題的最佳 Google 字體

首先，你需要找到你喜歡的 Google 字體。只需訪問 Google 字體網站並瀏覽其庫存。

當你找到喜歡的字體時，點擊它以查看可用的不同樣式。然後點擊 ‘查看選定的系列’ 按鈕，這將打開一個側邊欄。在 ‘網頁使用’ 部分下，你會看到使用說明。

你會發現有兩個添加字體到你網站的選項：第一是鏈接方式，這是添加網頁字體的推薦標準方式。第二選項是使用 @import CSS 方法來通過你的 CSS 樣式表加載字體。我們將向你展示如何使用這些方法以及它們的優缺點。

方法 1：使用插件將 Google 字體添加到主題

對於此方法，我們將使用一個 WordPress 插件來加載 Google 字體。首先，你需要安裝並激活 Fonts 插件。詳情請參閱我們的逐步 WordPress 插件安裝指南。

啟用後，訪問 ‘外觀 » 自定義’ 頁面打開主題自定義器。從這裡，你會看到新的 Fonts 插件選項卡。

點擊它會顯示插件選項。你可以選擇為你網站的不同區域使用 Google 字體。

或者，你也可以只選擇為你的 WordPress 主題加載一個字體。只需切換到 ‘高級設置 » 僅加載字體’ 選項卡。

在這裡，你可以選擇要為你的 WordPress 主題加載的 Google 字體。只需輸入字體名稱並選擇它。

完成後，不要忘記點擊 ‘發布’ 按鈕以保存變更。現在，如果你使用插件的高級功能為網站的不同區域分配字體，那麼這些字體將自動生效。

另一方面，如果你選擇僅加載字體，則需要為它們添加自定義 CSS 規則。例如，這裡是如何為整個網站的段落元素加載一個字體：

p { 
font-family: 'Open Sans', sans-serif;
}

方法 2：將 Google 字體添加到主題頭部

這是將 Google 字體直接添加到你的 WordPress 主題的最簡單方法。只需編輯 WordPress 主題或子主題的 header.php 文件。然後，將鏈接代碼粘貼到主題樣式表鏈接代碼之前。

主要目標是儘早放置字體請求。這允許用戶的瀏覽器在呈現頁面之前下載字體。一旦完成後，您可以在主題的 CSS 文件中使用該字體：

h1 {
    font-family: 'Open Sans', sans-serif;
}

方法 3：在主題樣式表中添加 Google 字體

對於此方法，我們將在 WordPress 主題的主 CSS 文件中導入字體 CSS。只需編輯主題根文件夾中的 style.css 文件，並將 ‘ @import ‘ 標籤的代碼添加到 CSS 文件的頂部。

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;800&display=swap');

重要提示：確保將 ‘ @import ‘ 行添加到 CSS 文件的頂部。

方法 4：在 WordPress 中正確地佇列 Google 字體

我們之前提到的前兩種方法需要你直接通過編輯 WordPress 主題文件來添加字體。如果你使用子主題進行所有變更，這是可行的。

然而，如果你對主題進行這些變更，然後在下次更新主題時，你的變更將會丟失。一個更簡單的解決方法是，程式化地添加一些代碼，自動加載 WordPress 主題使用的 Google 字體。

為此，你可以將一些自定義代碼片段添加到特定站點的插件中或使用自定義代碼插件。詳情請參閱我們的 WordPress 添加自定義代碼教程。

只需將以下代碼片段添加到你的 WordPress 網站：

function wpb_add_google_fonts() {

wp_enqueue_style( 'wpb-google-fonts', 'https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,700,300', false );
}

add_action( 'wp_enqueue_scripts', 'wpb_add_google_fonts' );

注意：別忘了將URL替換為你要添加的Google字體的URL。

就這樣了，WordPress現在將自動使用鏈接方法來獲取你添加的Google字體。你可以通過查看你網站的源代碼來確認，會看到你的Google字體樣式表添加在網站腳註部分。

附加部分：網頁字體如何影響 WordPress 速度

Google字體加載速度非常快，因為它們通過Google的大型CDN網絡提供，該網絡在全球各地設有伺服器。

由於這些字體被數百萬個網站使用，使用者很可能早已將它們存儲在瀏覽器的緩存中。這減少了它們對網站速度的性能影響。你可以通過在設計中只使用一兩個網頁字體進一步減少這種影響。

更多提示，請參閱我們的 WordPress 性能和速度新手完整指南。

希望這份指南幫助你學會如何輕鬆地將 Google 網頁字體添加到你的 WordPress 主題中。你可能還想看看我們的從頭開始不需要編碼的自定義 WordPress 主題指南和我們的最佳免費網站託管服務列表。

如果你喜歡本文，請訂閱我們的 YouTube 頻道以獲取 WordPress 視頻教程。你也可以在 Twitter 和 Facebook 上找到我們。

什麼是翻譯準備好的 WordPress 主題？

翻譯準備好的 WordPress 主題在其代碼中使用了一套標準實踐，使用戶可見的字符串可以翻譯成其他語言和地區。

如何找到翻譯準備好的 WordPress 主題

儘管 WordPress 對於創建任何語言的網站提供了很好的支持，但主題開發者可能不會覺得有必要創建翻譯準備好的主題。如果您將創建一個非英語的網站，那麼您需要確保您購買或下載的主題是翻譯準備好的。

1. 找到一個免費的翻譯準備好的 WordPress 主題

對於免費主題，您可以訪問 WordPress.org 主題目錄，然後點擊“功能篩選器”菜單。在這裡，您需要選中“翻譯準備好”選項，然後點擊頂部的“應用篩選器”按鈕。WordPress 現在會顯示有翻譯準備好功能支持的主題。如果您要將主題翻譯成從右到左的語言（例如阿拉伯語、希伯來語、波斯語和烏爾都語），那麼您還應選中“RTL 語言支持”選項。此外，您可以通過勾選其他功能進一步縮小搜索範圍。不要忘記點擊“應用篩選器”按鈕來排序主題。

2. 找到一個高級的翻譯準備好的 WordPress 主題

付費或高級 WordPress 主題由第三方開發者在他們自己的網站上銷售。市場上大多數頂級 WordPress 主題都是翻譯準備好的，包括流行的主題如 Astra、Divi 和 StudioPress 主題。通常，您可以在主題網站上找到關於翻譯準備情況的信息。如果不確定，可以在購買前向主題開發者詢問。一旦找到翻譯準備好的 WordPress 主題，請在您的 WordPress 站點中安裝它。需要幫助？請參考我們的指南，了解如何一步步安裝 WordPress 主題。

翻譯 WordPress 主題

有多種方法可以翻譯翻譯準備好的 WordPress 主題，您可以根據需求選擇一種方法。在開始之前，首先準備好網站的翻譯工作。

選擇您的網站語言

首先，您需要選擇網站的語言，這將允許 WordPress 自動使用正確的翻譯文件。若您在製作一個非英文網站，請在 WordPress 設置中選擇網站語言。進入 WordPress 管理區域的設置 » 常規頁面，並向下滾動到“站點語言”部分。現在，選擇您的網站語言，然後點擊“保存更改”按鈕。此設置僅告訴 WordPress 該網站的前端主要使用此特定語言。接著，WordPress 使用此信息查看是否有可用的翻譯文件並自動下載和安裝。如無翻譯，則會使用您提供的翻譯。在沒有可用翻譯的情況下，WordPress 將使用主題的默認語言，通常為英文。

使用 TranslatePress 翻譯 WordPress 主題

此方法更簡單，適用於所有 WordPress 用戶。它允許您在實時預覽中可視化地翻譯網站主題，了解翻譯後的效果。首先，安裝並激活 TranslatePress 插件，您可以參考我們的逐步指南瞭解如何安裝 WordPress 插件。安裝後，請按照帳戶中的說明進行下載和激活插件，然後在您的 WordPress 管理區域內配置插件設置。輸入插件許可密鑰，選擇網站的默認語言，並添加您希望添加的語言。完成後，點擊“保存更改”。現在，點擊“翻譯站點”按鈕，進入翻譯屏幕並實時預覽您的網站。只需將鼠標懸停在文本上並提供翻譯，即可開始翻譯您的 WordPress 主題。保存更改以存儲翻譯。

手動翻譯 WordPress 主題

此方法要求下載 WordPress 翻譯模板並使用翻譯編輯軟件手動翻譯主題。首先，下載並解壓要翻譯的主題，找到“languages”文件夾，其中應含有 POT 文件。在 Ubuntu 或其他 Linux 系統上，最好使用 gettext 編輯器來翻譯主題。在 Windows 或 Mac 上，我們建議使用適用於 Windows、Mac 和 Linux 的 gettext 編輯器 Poedit。下載 Poedit 並安裝後，創建新項目並選擇主題的 POT 文件。選擇翻譯語言後，Poedit 將加載翻譯編輯器，列出所有可翻譯的字符串。翻譯完畢後，保存 PO 文件（按“語言_國家”格式命名，例如 fr_FR.po）並生成相應的 MO 文件，上傳到 /wp-content/themes/您的主題名稱/languages/ 文件夾中，WordPress 將自動開始使用您上傳的語言文件。

幫助翻譯 WordPress 主題和插件

如果您不是開發者但想幫助 WordPress 主題或插件開發者，翻譯是個不錯的方式。考慮將翻譯的 PO 文件提交給主題開發者，以便其他 WordPress 用戶也能使用。您也可以參與 WordPress 核心軟件的翻譯工作，訪問 WordPress 本地化網站以瞭解如何加入不同語言的 WordPress 本地化團隊。

我們希望這篇文章能幫助您輕鬆找到和翻譯一個翻譯準備好的 WordPress 主題。您可能還有興趣參閱我們有關如何自定義 WordPress 主題或如何在不編碼的情況下創建自定義 WordPress 主題的指南。如果您喜歡這篇文章，請訂閱我們的 YouTube 頻道，獲取 WordPress 視頻教程。您也可以在 Twitter 和 Facebook 上找到我們。

如何在WordPress中建立自訂單篇文章模板

我們的一位讀者詢問我們如何在WordPress中建立自訂的單篇文章模板。在WPressize Me，我們幫助過許多網站所有者通過個別文章的獨特佈局來提升其博客。自訂單篇文章模板可以讓您為您的博客文章使用不同的設計，賦予每篇文章不同的外觀。許多WordPress主題提供一些頁面模板，但如果需要，您也可以創建自己的模板。

在本文中，我們將展示多種方法，讓您輕鬆創建WordPress中的自訂單篇文章模板，您可以選擇最適合您的方法。

何時需要自訂單篇文章模板？

有時您可能希望您的某些文章在WordPress網站上具有不同的外觀和感覺。例如，您可能希望對精選文章或特定類別的故事使用不同的佈局。此時，您就需要在WordPress中建立自訂單篇文章模板。

默認情況下，WordPress使用基於WordPress模板層次結構的單篇文章模板。所有主題都附帶一個single.php模板，默認用於您的所有單篇文章。有些主題還可能包含額外的模板或佈局選項，您可以使用它們。這非常像創建一個自訂頁面模板。大多數WordPress主題還附帶頁面模板，您可以在WordPress中編輯文章或頁面時使用它們。

使用區塊編輯器創建單篇文章模板

這種方法實際上並非真正創建一個文章模板，且靈活性有限。然而，這是保存您自己的單篇文章佈局並重複使用它們的最簡單方法。默認的WordPress區塊編輯器內置了一個功能，允許您保存和重用區塊。可重用的一個區塊是群組區塊。群組區塊允許您將多個區塊和整個文章佈局放入一個群組中。然後，您可以保存這個群組區塊並在其他文章中重用它。

首先，您需要在WordPress中創建一篇新文章。之後，簡單地將群組區塊添加到內容區域。現在，您可以開始在群組區塊中添加區塊，以創建您WordPress博客的單篇文章佈局。

您可以添加任何想要的區塊，包括列、媒體和文本、封面圖片等。一旦您對創建的佈局滿意，您需要將滑鼠移到群組區塊，點擊三點菜單圖標，然後選擇『添加到可重用區塊』選項。接下來，您需要為可重用區塊提供一個名稱，然後點擊保存按鈕。WordPress現在將保存您的可重用區塊，包括群組區塊內的所有區塊。

使用SeedProd創建自訂單篇文章模板

使用SeedProd創建自訂單篇文章模板是最簡單的方法。它是最佳的WordPress網站構建插件，無需編寫任何代碼即可創建漂亮的網站佈局和自訂模板。第一件事是安裝並啟用SeedProd插件。詳情請參閱我們的逐步指南：如何安裝WordPress插件。

創建自訂WordPress主題

首先，前往SeedProd » Theme Builder頁面，使用SeedProd的預製主題作為起點，這將用新的、自訂的設計取代您現有的WordPress主題。您可以通過點擊『主題』按鈕來完成此操作。您將看到不同類型網站的專業設計主題列表，例如現代商業、營銷代理、房貸經紀人主題等。查看選項，點擊勾選圖標選擇最符合您需求的主題。

自訂默認單篇文章模板

SeedProd的拖放式頁面構建器使自訂默認的『單篇文章』模板變得簡單。只需點擊模板下的『編輯設計』鏈接，這將在SeedProd的可視化編輯器中打開您的文章模板。SeedProd的可視化編輯器具有兩列佈局：左側是您可以添加到設計中的區塊和部分，右側是模板的預覽，您可以在實時中查看更改。

您還可以拖動左列中的區塊到預覽列中以添加更多區塊。SeedProd使用模板標籤來拉取動態內容，如文章標題、特色圖片、評論等，讓您無需逐篇編輯便可將內容添加到模板中。例如，您可以在文章內容末尾添加一個Posts區塊，顯示訪客閱讀完当前文章後可能想要閱讀的最近文章。這個區塊將自動在所有使用此模板的文章中顯示。

使用主題設置來創建自訂單篇佈局

許多流行的WordPress主題帶有內置設置，可自訂單篇文章模板的外觀。如果您的主題支持這些設置，您將能夠在文章編輯屏幕上找到它們。例如，Astra主題在編輯單篇文章時提供自訂選項，您可以使用這些選項更改側邊欄、隱藏標題、菜單等。許多頂級WordPress主題還附帶即用型模板，您可以在『模板』或『文章屬性』面板中找到它們，這些模板是完整佈局，無需配置即可使用。

使用代碼手動創建自訂單篇文章模板

這種方法有點高級，因為需要您編輯主題文件、複製和粘貼代碼，並可選擇添加自訂CSS。如果您之前沒有做過此類操作，請參閱我們的教程如何在WordPress中複製和粘貼代碼。首先，您需要在電腦上打開一個純文本編輯器，如Notepad，然後將以下代碼粘貼到其中：

<?php
/
* Template Name: Featured Article
* Template Post Type: post, page, product
*/

 get_header();
?
>

這段代碼定義了一個名為『精選文章』的新模板，使其可用於post、page和product文章類型。您應將此文件保存為wpb-single-post.php，並上傳到當前主題文件夾中。

這樣，您就可以在WordPress管理區域內創建或編輯一篇文章。在文章編輯屏幕上，您會注意到一個新模板面板或文章屬性元框，其中有一個選項可以選擇這個新模板。現在，您的模板實際上是空的，所以選擇它將顯示一個白色屏幕。要修正這個問題，可以從主題的single.php文件中複製代碼並用作起點，然後進行自訂。您可以添加自訂CSS類、移除側邊欄、創建全寬模板或其他任何您想要的更改。

根據分類創建自訂單篇文章模板

您可以根據分類使用自訂單篇文章模板嗎？例如，給旅遊類別中的文章佈局不同於攝影類別中的文章。這可以通過SeedProd主題構建器或代碼來實現。

使用SeedProd根據分類創建自訂單篇文章模板

之前我們介紹了如何自訂SeedProd主題構建器的默認單篇文章模板。您可以通過複製原始模板，然後在SeedProd的可視化編輯器中進行定制，這樣您可以為每個分類設置不同的佈局。

使用代碼根據分類創建自訂單篇文章模板

首先，您需要將此代碼添加到主題的functions.php文件中，或使用代碼片段插件：

define('SINGLE_PATH', TEMPLATEPATH . '/single');
add_filter('single_template', 'my_single_template');
function my_single_template($single) {
 global $wp_query, $post;
 foreach((array)get_the_category() as $cat) :
 if(file_exists(SINGLE_PATH . '/single-cat-' . $cat->slug . '.php'))
 return SINGLE_PATH . '/single-cat-' . $cat->slug . '.php';
 endforeach;
}

這段代碼首先檢查WordPress是否請求單篇文章，如果是，則指示WordPress在主題的/single/文件夾中查找模板。

接下來，您需要在該文件夾內創建模板文件，命名為single-cat-{category-slug}.php，並根據需要進行編輯。

根據作者創建自訂單篇文章模板

這可以通過遵循與分類相同的技術實現，您需要將以下代碼添加到主題的functions.php文件中：

define('SINGLE_PATH', TEMPLATEPATH . '/single');
add_filter('single_template', 'my_single_author_template');
function my_single_author_template($single) {
 global $wp_query, $post;
 $curauth = get_userdata($wp_query->post->post_author);
 if(file_exists(SINGLE_PATH . '/single-author-' . $curauth->user_nicename . '.php'))
 return SINGLE_PATH . '/single-author-' . $curauth->user_nicename . '.php';
}

WPressize Me 自動生成的 CSS 速查表

您是否在尋找一個 WordPress 自動生成的 CSS 速查表？在大多數佈景主題中，WordPress 會自動為不同的元素添加一些 CSS 類別。這些默認的 CSS 類別可以用於在 WordPress 主題中設計這些元素。

在本文中，我們將向您展示 WordPress 自動生成的 CSS 速查表，並討論如何輕鬆找到 CSS 類別以及如何在需要時添加自訂 CSS 類別。

為什麼要學習 WordPress 自動生成的 CSS？

WordPress 會自動生成並添加默認的 CSS 類別到您網站上的不同元素。然後， WordPress 主題開發人員可以使用這些 CSS 類別為所有 WordPress 站點的常見區域進行設計。這些區域包括內容區域、側邊欄、小工具、導航菜單等。

了解這些 CSS 類別非常有用，無論您是學習 WordPress 主題開發還是僅僅嘗試為您自己網站創建子主題。如果您不希望學習 CSS 來修改主題樣式或創建自訂主題，可以使用例如 SeedProd 這樣的拖放建站器。

默認的 Body 類別樣式

HTML 中的 body 標籤包含任何網頁的整體佈局結構，在任何 WordPress 主題設計中都非常重要。WordPress 向 body 區域添加了幾個 CSS 類別，主題設計師可以使用這些類別來設計 body 容器。

// 當網站使用從右到左的語言時添加，例如阿拉伯語、希伯來語
.rtl {}
// 當顯示首頁時添加
.home {}
// 當顯示博客頁面時添加
.blog {}
…
// 當顯示封閉搜索頁面時添加，包含頁碼。
.search-paged-(page number) {}

默認的文章樣式類別

就像 body 元素一樣，WordPress 也會為文章元素添加動態類別。此元素通常是主題模板中的

如何讓每個 WordPress 帖子風格各異

你是否想要在你的网站上为每个 WordPress 帖子进行不同的样式设计？某些網站會透過自訂背景來突出特定的置頂貼文，或是為每個分類文章賦予獨特的外觀。你也可以這樣做，以反映不同的內容類型，並為用戶創造視覺上吸引的體驗。

在本文中，我們將向你展示如何輕鬆地為每個 WordPress 帖子進行不同的樣式設計。

為什麼要讓每個 WordPress 貼文風格各異？

如果你擁有一個 WordPress 博客，為每個帖子設計不同的樣式可以創造一個獨特的視覺體驗，讓不同的顏色和風格與不同的內容類型相互連結。例如，你可以使用不同的背景顏色來區分清單類文章、博客帖子和教程帖文。這樣能立即抓住用戶的注意並提高互動率。

然而，這樣做也有一些缺點。例如，你需要定期維護每個 WordPress 帖子的設計，這可能會非常耗時。此外，這可能導致用戶體驗不一致，並不利於建立你的品牌形象，因為統一的網站顏色對於建立品牌形象是非常重要的。

如何在 WordPress 中為個別帖子設計樣式

WordPress 會為網站上的各種元素添加默認的 CSS 類別。主題使用一個叫做 post_class() 的核心 WordPress 函數來告訴 WordPress 在哪裡添加這些默認的 CSS 類別到帖子中。如果你訪問你的网站并使用瀏覽器的檢查工具，你就能看到每個帖子的這些類別。

以下是根據用戶查看的頁面而添加的一些默認 CSS 類別:

• .post-id
• .post
• .attachment
• .sticky
• .hentry (hAtom 微格式页面)
• .category-ID
• .category-name
• .tag-name
• .format-{format-name}
• .type-{post-type-name}
• .has-post-thumbnail

示例輸出如下:

<article id="post-412" class="post-412 post type-post status-publish format-standard hentry category-news">

你可以使用這些對應的 CSS 類別或 ID 為每個 WordPress 帖子設計不同的樣式。要做到這一點，你首先需要找到每個帖子的 ID。你可以通過訪問 WordPress 儀表板中的 Posts » All Posts 頁面並將鼠標懸停在一個帖子上來找到。

接下來，將自訂的 CSS 類別和代碼添加到你的主題文件或主題定制器中。不過，這樣做有風險，因為一個錯誤可能會導致你的网站崩潰。所以我們建議使用 WPCode，它是最好的 WordPress 代碼片段插件，也是添加自訂代碼最安全的方法。

如何使用 WPCode 設計帖子樣式

首先，你需要安裝和激活免費的 WPCode 插件。激活後，訪問儀表板上的 Code Snippets » + Add Snippet 頁面，然後在 ‘Add Your Custom Code (New Snippet)’ 選項下點擊’Use Snippet’ 按鈕。

這會帶你到 ‘Create Custom Snippet’ 頁面，從那裏你可以開始為你的代碼片段添加名稱。然後，在右側的下拉菜單中選擇 ‘CSS Snippet’ 作為代碼類型。

接下來，將你的個別帖子的 CSS 類別和 ID 添加到 ‘Code Preview’ 框中，格式如下:

.post-13 { }

之後，你可以在花括號之間添加任何自訂的 CSS 代碼來設計你的帖子。 例如，如果你想更改個別帖子的背景顏色，你可以添加如下自訂 CSS 代碼:

.post-13 { background-color: #FF0303; color: #FFFFFF; }

完成後，將頂部的 ‘Inactive’ 開關切換到 ‘Active’ 並點擊 ‘Save Snippet’ 按鈕來保存設置。啟用代碼片段後，自訂 CSS 代碼將自動應用到你個別的帖子中。

如何基於特定分類設計帖子

如果你想設計所有屬於特定分類的帖子，你可以使用 WPCode 實現這一點。訪問 Code Snippets » + Add Snippet 頁面，選擇 ‘Add Your Custom Code (New Snippet)’ 選項。在新頁面上添加代碼片段名稱並選擇 ‘CSS Snippet’ 作為代碼類型。

接著，將特定分類的 CSS 類別添加到代碼預覽框中，例如:

.category-books { }

然後，你可以在框中添加任何自訂的 CSS 代碼來應用到不同分類中的所有帖子。例如，如果你想改變特定分類的所有帖子的字體大小和樣式，你可以使用以下代碼片段:

.category-books { font-size: 18px; font-style: italic; }

接下來，將 ‘Inactive’ 開關切換為 ‘Active’ 並點擊 ‘Save Snippet’ 按鈕保存設置。你可以現在訪問所有特定分類的帖子來查看應用的變更。

如何根據作者設計帖子

預設情況下，the_posts() 函數生成的 CSS 類別不包含作者名。如果你想根據作者自訂每篇帖子的樣式，你需要先將作者名添加為 CSS 類別。

要使用 WPCode 實現這一點，選擇 ‘Add Your Custom Code (New Snippet)’ 選項。進入 ‘Create Custom Snippet’ 頁面後，添加代碼片段名稱並選擇 ‘PHP Snippet’ 作為代碼類型。然後，在代碼預覽框中添加以下自訂代碼並替換 ‘user_nicename’ 為作者名:

$author = get_the_author_meta('user_nicename'); ?> <article id="post-" 

最後，將 ‘Inactive’ 開關切換為 ‘Active’ 並點擊 ‘Save Snippet’ 按鈕保存設置。這段代碼會將用戶的簡易名（適合用作 URL）添加為 CSS 類別。接下來在 ‘Create Custom Snippet’ 頁面上選擇 ‘CSS Snippet’。然後在 ‘Code Preview’ 框中添加作者的特定名字，例如:

.sarahclare { }

之後你可以添加自訂 CSS 代碼。以下範例顯示如何更改作者帖子背景顏色並添加邊框:

.sarahclare { background-color: #EEE; border: 1px solid #CCC; }

完成後，點擊 ‘Save Snippet’ 按鈕保存設置，然後將 ‘Inactive’ 開關切換為 ‘Active’。現在你可以訪問特定作者的帖子來查看應用的變更。

如何基於留言數設計帖子

某些網站會根據留言數設計熱門帖子小工具。這裡示範如何使用留言數設計帖子。首先，我們需要獲取留言數並將其與類別關聯。

將以下代碼添加到你的主題文件或使用 WPCode 插件:

approved; if ($my_comment_count = 10 && $my_comment_count = 20) { $my_comment_count = 'popular'; } ?>

這段代碼根據留言數將其歸類為 new、emerging 和 popular。接著，將留言數作為 CSS 類別添加到 post_class 函數中:

<article id="post-" >

你現在可以添加自訂 CSS 來根據留言數設計每個帖子，例如添加不同的邊框顏色:

.new { border: 1px solid #FFFF00; } .emerging { border: 1px dashed #FF9933; } .popular { border: 1px dashed #CC0000; }

Bonus: 為每個帖子顯示不同的側邊欄

設計每個帖子後，你可能還想為每個帖子添加一個獨特的側邊欄。你可以使用 SeedProd 插件，它是最好的 WordPress 頁面構建器插件。

激活插件後，你可以選擇一個自訂頁面作為登錄頁面的設計，然後選擇一個有側邊欄的佈局。之後，從左側欄拖放你選擇的區塊，包括聯繫表單、存檔、贈品、搜索框、留言等。完成後，點擊頂部的 ‘Save’ 和 ‘Publish’ 按鈕。

我們希望這篇文章能幫助你學會如何讓每個 WordPress 帖子風格各異。如果你喜歡這篇文章，請訂閱我們的 YouTube 頻道獲取更多 WordPress 視頻教程，你也可以在 Twitter 和 Facebook 上找到我們。