如果您想銷售商品或吸引訪問者注冊，WordPress 網站上的登陸頁面是一個非常寶貴的工具。在這篇文章中，您將了解如何在 WordPress 中免費創建登陸頁面并鼓勵人們購買或注冊您的服務。
我們將通過自定義第三方 WordPress 主題來創建著陸頁。這是免費創建 WordPress 登陸頁面的最佳方式，并為您提供最大的靈活性，但它需要一些編碼知識。如果您想創建一個無需編碼的登陸頁面，請查看我們的其他一些帖子。
著陸頁是關鍵頁面，旨在促使用戶采取行動。該操作的具體內容取決于您的業務，但可能是以下兩種情況之一：
- 買一些東西，可能是大件商品，因為您會使用產品頁面來購買較小的產品。
- 注冊某項內容，可能是服務或課程的訂閱，也可能是郵件列表。
您需要盡可能多地吸引此頁面的流量，因為它將對您的網站非常重要。您可以通過搜索引擎優化、廣告或直接營銷（或者兩者的結合）來做到這一點。
但是，一旦人們到達該著陸頁，您就需要確保他們購買或注冊。
頁面的內容將成為您執行此操作的一部分 – 不僅是內容本身，還有您的布局方式。一般來說，商品越貴，您需要的文字和號召性用語就越多。
但這不僅僅是內容的問題。您還需要確保當有人登陸該頁面時，他們唯一可用的選項是單擊購買按鈕。如果有導航菜單、某些小部件或可點擊的徽標，他們就有可能點擊離開以調查網站的其余部分，并且永遠不會返回到著陸頁。
這就是在主題中創建登陸頁面的用武之地。登陸頁面不會有內容之外的鏈接。不會有菜單，沒有小部件，頁眉、頁腳或其他任何地方都沒有可點擊的鏈接。它通常是全寬的（因為您不需要側邊欄小部件），并且它有一個干凈的布局，旨在將注意力集中在內容上。
在本教程中，我將向您展示如何為您的主題創建登陸頁面模板。這包括四件事：
- 為您的目標網頁創建頁面模板
- 為沒有鏈接的著陸頁創建標頭
- 為著陸頁創建一個不帶鏈接的頁腳
- 使用模板創建目標網頁
那么讓我們開始吧。我將為“二十二十”主題創建此登陸頁面模板，這意味著創建一個子主題，這樣我就不會編輯第三方主題。
您需要什么
要學習本教程，您需要：
- WordPress 的測試或開發安裝
- 代碼編輯器
- 已安裝主題
那么讓我們開始吧。
創建子主題
如果您正在開發自己的主題，則可以跳過此部分。但是，如果您使用從主題目錄下載的第三方主題或從 ThemeForest 或其他來源購買的第三方主題，則需要一個子主題。
按照我們的指南創建子主題，并將新主題保存在您網站的 wp-content/themes 目錄中。
創建登陸頁面模板文件
現在您需要創建一個頁面模板作為您的登陸頁面模板。您需要復制主題中頁面使用的任何模板并重命名新文件。對于許多主題來說，就是 page.php。對于二十二十，那就是singular.php。您可以使用 WordPress 模板層次結構來確定正在使用哪個模板文件。
如果您使用子主題，您可以將副本復制到子主題。如果您正在使用主主題，請將副本保存在主主題中。注意：不要在您的實時網站上執行此操作！
如果您的主題有全角頁面模板，請使用它而不是 page.php，因為頁面布局已經設置為沒有側邊欄，并且側邊欄將有已被刪除。
我已將文件命名為landing-page-template.php。不要給它一個以 page 開頭的名稱。如果您隨后使用該名稱創建頁面，WordPress 會自動將模板分配給該頁面。最好保持手動操作，以便您擁有更多控制權。
這是我的新 landing-page-template.php 文件的完整內容。如果您使用不同的主題，您的主題看起來會有所不同。
<?php /** * The template for displaying single posts and pages. * * @link https://developer.wordpress.org/themes/basics/template-hierarchy/ * * @package WordPress * @subpackage Twenty_Twenty * @since Twenty Twenty 1.0 */ get_header(); ?><main id="site-content" role="main"><?php if ( have_posts() ) { while ( have_posts() ) { the_post(); get_template_part( 'template-parts/content', get_post_type() ); } } ?></main><!-- #site-content --><?php get_template_part( 'template-parts/footer-menus-widgets' ); ?><?php get_footer(); ?>
現在是時候編輯文件了。從頂部注釋掉的文本開始。將其替換為頁面模板所需的文本：
<?php /** * Template Name: Landing Page * */
下一步是刪除對側邊欄或頁腳的任何調用。如何執行此操作取決于您的主題以及您是否首先使用全角模板。
在《二十二十分》中，沒有對側邊欄的調用，所以我不需要刪除它。如果您的模板中有此行，則需要將其刪除：
<?php get_sidebar(); ?>
注意：編輯完此模板文件后，您可能會發現布局在側邊欄應有的位置留下了間隙。編輯模板的 css 或更改內容部分中的類以使其全寬。
現在是頁腳。您不想完全刪除頁腳，因為您仍然需要版權頁和對 wp_footer 的調用，因此您不必刪除 get_footer() 調用，而是將其保留在那里并為您的目標網頁創建一個新的頁腳文件。
在《二十二十分》中，頁腳無法以標準方式工作。我的模板文件中有兩個調用：
<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?><?php get_footer(); ?>
第一個調用一個包含文件，該文件只包含小部件。第二個調用我需要的頁腳，但我們稍后會對其進行編輯。所以我刪除這一行：
<?php get_template_part( 'template-parts/footer-menus-widgets' ); ?>
現在保存您的文件。我們很快就會回來討論這個問題。
為您的目標網頁創建標頭
現在是時候為您的目標網頁創建一個沒有導航、小部件或鏈接的標題了。
復制主題的 header.php 文件（在主主題或子主題中）并將其命名為 header-landing.php。
刪除徽標或網站標題中的鏈接
在頭文件中查找站點名稱或徽標。我的由一個函數組成：
twentytwenty_site_logo();
我不會嘗試編輯該函數，而是將其替換為對徽標的調用：
@@##@@/images/xxx.jpg” >
將上面代碼中的xxx.jpg替換為您自己的徽標名稱，并確保使用正確的路徑。
如果您的網站在標題中使用網站標題而不是徽標圖像，請使用以下內容：
<div class="site-title faux-heading"> <?php bloginfo( 'name' ); ?> </div>
注意：我上面使用的類是特定于 20 20 的。編輯它們以反映您的主題。
如果您的主題以比二十二十更標準的方式工作，您可能會發現此代碼已經存在。您所要做的就是刪除其周圍的任何 元素，以便網站標題或徽標仍然存在，但它們不會充當鏈接。
刪除導航菜單
現在是時候刪除導航菜單了。在頭文件管理器中找到它的代碼。在《二十二》中，它位于一個如下所示的元素內：
<div class='“header-navigation-wrapper"'> </div><!-- .header-navigation-wrapper —>
如果您正在使用“二十二十”，請刪除它以及其中的所有內容。如果沒有，您需要找到具有相似名稱的 div、aside 或 section。
Twenty Twenty 在這些元素內還有兩個用于移動設備的切換導航按鈕：
<button class="toggle search-toggle mobile-search-toggle"> </button>
<button class="toggle nav-toggle mobile-nav-toggle"> </button>
刪除這些內容，確保不要刪除它們之間的網站標題和說明。如果您的主題有類似的內容，請將其刪除。
刪除任何小部件區域或其他帶有鏈接的代碼
《二十二十》也有搜索代碼，我也將刪除它。您的主題可能在小部件中包含此內容，在這種情況下，請刪除頭文件中的所有小部件區域。
最后，在《二十二十》中，文件末尾有一個模式菜單，我也想將其刪除。同樣，您的主題可能沒有這個 – 《二十二十》比許多主題更復雜！
我的header-landing.php文件現在看起來簡單多了：
<?php /** * Header file for the Twenty Twenty WordPress default theme. * * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials * * @package WordPress * @subpackage Twenty_Twenty * @since Twenty Twenty 1.0 */ ?><!DOCTYPE html> <html class="no-js" <?php language_attributes(); ?>> <head> <meta charset="<?php bloginfo( 'charset' ); ?>"> <meta name="viewport" content="width=device-width, initial-scale=1.0" > <link rel="profile" href="https://gmpg.org/xfn/11"> <?php wp_head(); ?> </head> <body <?php body_class(); ?>> <?php wp_body_open(); ?> <header id="site-header" class="header-footer-group" role="banner"> <div class="header-inner section-inner"> <div class="header-titles-wrapper"> <div class="header-titles"> <?php // Site title or logo. bloginfo( 'name' ); // Site description. twentytwenty_site_description(); ?> </div><!-- .header-titles --> <!-- .header-titles-wrapper --> <!-- .header-inner --> <!-- #site-header —>
保存文件并返回到您的模板文件。找到調用標題的行：
get_header();
編輯它，以便它調用新的頭文件：
get_header( ‘landing’ );
現在保存您的文件。
為著陸頁創建頁腳
現在是時候為您的目標網頁創建頁腳了。
復制 footer.php 并將其命名為 footer-landing.php。打開您的新文件。
找到小部件區域的任何代碼并將其刪除。 《二十二十》在 footer.php 文件中沒有小部件區域；它們位于一個包含文件中，我已經刪除了對該文件的調用。
您還需要編輯版權頁以刪除鏈接。這是《二十二十分》的版權頁：
<div class="footer-credits"> <p class="footer-copyright">© <?php echo date_i18n( /* translators: Copyright date format, see https://www.php.net/date */ _x( 'Y', 'copyright date format', 'twentytwenty' ) ); ?> <a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a> </p><!-- .footer-copyright --> <p class="powered-by-wordpress"> <a href="<?php%20echo%20esc_url(%20__(%20'https://wordpress.org/',%20'twentytwenty'%20)%20);%20?>"> <?php _e( 'Powered by WordPress', 'twentytwenty' ); ?></a> </p><!-- .powered-by-wordpress --> <!-- .footer-credits -->
刪除代碼中的所有鏈接。我的現在是這樣的：
<div class="footer-credits"> <p class="footer-copyright">? <?php echo date_i18n( /* translators: Copyright date format, see https://www.php.net/date */ _x( 'Y', 'copyright date format', 'twentytwenty' ) ); ?><?php bloginfo( 'name' ); ?></p> <!-- .footer-copyright --> <p class="powered-by-wordpress"> <?php _e( 'Powered by WordPress', 'twentytwenty' ); ?></p> <!-- .powered-by-wordpress --> </div><!-- .footer-credits -->
現在保存頁腳文件并返回到您的模板文件。找到對頁腳的調用：
<?php get_footer(); ?>
編輯它以調用新的頁腳文件：
<?php get_footer( 'landing' ); ?>
我的模板文件現在已被精簡，內容如下：
<?php /** * Template Name: Landing Page * */ get_header(); ?><?php get_footer( 'landing' ); ?>
保存您的模板文件，如果您正在使用子主題，請在 WordPress 管理員中激活它。
使用模板創建您的目標網頁
為您的目標網頁創建一個新的靜態頁面，并為其指定一個適合您希望其執行的操作的標題。
創建內容，然后在右側文檔窗格的頁面屬性部分中，選擇著陸頁 >模板?下拉菜單。
摘要
如果您確保人們到達目標網頁時可以采取的唯一操作是點擊您的“購買”按鈕，那么目標網頁就會更加強大。通過在 WordPress 主題中創建著陸頁模板，您將使著陸頁更加有效并獲得更多銷售或訂閱。
按照本指南操作，您將擁有適合您的主題的強大登陸頁面！
