如何在WordPress文章中使用切換效果顯示和隱藏文字

您是否想在WordPress文章中使用切換效果來顯示和隱藏文字？

有時候，您可能希望在訪客點擊特定鏈接之前隱藏內容。這在創建常見問題解答（FAQ）部分或希望在單個頁面上包含大量文本而不至於壓倒讀者時特別有用。

在本文中，我們將向您展示如何在WordPress文章中使用切換效果來隱藏文字。

為什麼要在WordPress文章中顯示和隱藏文字？

許多網站默認隱藏文字，通常會顯示一個簡短的預告然後包含一個「閱讀更多」或「查看更多」的鏈接。訪客可以點擊該鏈接以獲取更多信息。

如果您需要在頁面上添加大量信息，但擔心一整塊文字可能會壓倒訪客，這非常有用。FAQ是個很好的例子，因為大多數訪客只想要某個問題的答案。如果您顯示所有答案，則訪客可能會難以找到所需的信息。

通過使用切換效果隱藏文字，訪客可以掃描大量文章、功能、好處或其他信息，然後選擇他們想要了解的項目。

既然如此，讓我們來看看如何在WordPress中使用切換效果來顯示和隱藏文字。只需使用下面的快速鏈接跳轉到您想要使用的方法：

• 方法1：使用短代碼在WordPress中顯示和隱藏文字（快速且簡單）
• 方法2：使用SeedProd在WordPress中顯示和隱藏文字（最適合FAQ）
• 方法3：使用WordPress詳細信息塊顯示和隱藏文字（無需插件）

方法1：使用短代碼在WordPress中顯示和隱藏文字（快速且簡單）

添加一個「閱讀更多」鏈接到任何頁面或文章最快速和簡單的方法是使用Read More Without Refresh。這款免費插件允許您自定義「閱讀更多」鏈接，然後使用短代碼將其添加到您的網站任何位置。

首先，您需要安裝並啟用Read More Without Refresh插件。更多詳細信息，請參閱我們的分步指南：如何安裝WordPress插件.

啟用後，點擊‘RMWP設置’來配置插件的設置。您可以開始通過在兩個文本字段中鍵入內容來更改「閱讀更多/更少」鏈接的文本。您也可以更改文本顏色、背景顏色等，這有助於您創建完美符合您的WordPress主題的鏈接。

完成後，請確保點擊‘保存更改’按鈕，即使您沒有進行任何更改。這很重要，因為如果您不點擊此按鈕，插件將無法按預期工作。

完成後，您可以為任何頁面或文章添加切換效果。您需要找到要隱藏的文字，然後將其包裹在短代碼中。打開任何頁面或文章的塊編輯器，然後單擊‘添加塊’圖標以在要隱藏的文字之前添加一個塊。

在短代碼框中，添加以下短代碼：[read more]

完成後，您需要在要隱藏的文字之後添加另一個短代碼塊。點擊‘+’圖標，按照上面描述的相同過程創建另一個短代碼塊。在此塊中，添加以下代碼：[/read]

現在，您可以點擊‘更新’或‘發布’使文字生效。

現在，訪問您的WordPress博客，您將看到短代碼塊之間的文字默認情況下被隱藏。要顯示文字，只需單擊‘閱讀更多’或類似鏈接。

方法2：使用SeedProd在WordPress中顯示和隱藏文字（最適合FAQ）

在您的WordPress網站上使用隱藏文字的方式有很多種。例如，如果您有一個影評網站，您可以使用這種技術來隱藏劇透。然而，FAQ是最常見的用途之一。如果您想要創建一個具有良好佈局且專業的問答部分，我們建議使用頁面構建插件。

SeedProd是市場上最好的頁面構建器，允許您為WordPress網站創建各種自定義登陸頁面。它帶有超過300個現成的站點模板，包括可用於推廣產品、服務、網絡研討會等的設計。所有這些設計都是添加FAQ部分的完美場所。

選擇模板後，SeedProd甚至有不同的現成FAQ部分，您可以單擊一下就將其添加到您的頁面設計中。許多這些FAQ部分帶有內置的隱藏/顯示文字切換效果，它們也完全可定制，因此您可以輕鬆添加自己的問題和答案文字。

有關如何使用SeedProd的更多信息，請參閱我們的指南：如何在WordPress中創建自定義頁面

創建頁面後，可以輕鬆添加現成的FAQ部分。在SeedProd頁面編輯器中，只需單擊左側菜單中的‘部分’選項卡。現在，您可以選擇‘FAQ’以查看所有SeedProd的問答部分。

要預覽設計，將鼠標懸停在其上，然後單擊小放大鏡。找到想要使用的設計後，單擊‘選擇此部分’。SeedProd將進行添加，並將部分添加到頁面的底部。您可以使用拖放來移動FAQ部分到新位置。

之後，點擊選擇FAQ手風琴塊，以添加自己的文字。左側菜單將更新為顯示所有問題的列表。要編輯某個問題和答案對，只需單擊左側菜單中的該問題。這將打開兩個小型文本編輯器，您可以在其中添加自己的問題和答案。

重複這一過程直至所有問題和答案都填寫完成。如果需要添加更多問題，只需單擊‘添加新項目’按鈕。要刪除問題和答案對，只需將鼠標懸停在左側菜單中的該問題上，然後單擊出現的垃圾桶圖標。

當您對輸入的信息感到滿意時，您可以使用‘字體大小’和‘間距’滑塊來更改文字的外觀。還有一個‘圖標’部分，定義了每個問題旁邊顯示的小圖片。要自定義此圖片，只需單擊展開‘圖標’部分。在這裡，您可以更改圖標的對齊和顏色。

如果要使用完全不同的圖標，只需將鼠標懸停在‘關閉圖標’或‘開啟圖標’預覽上，然後單擊‘圖標庫’縮圖。這將打開SeedProd的內置庫，包含超過1400個Font Awesome圖標字體。

您還可以通過選擇‘高級’選項卡進一步自定義FAQ部分的外觀。在這裡，您可以更改字體、添加邊距和間距，甚至添加CSS動畫，使FAQ部分更加突出。

完成後，您可以繼續在SeedProd頁面上添加新的塊和自定義內容。當您對外觀感到滿意時，只需單擊‘保存’按鈕旁邊的箭頭，然後選擇‘發布’。

現在，如果您訪問您的網站，您將看到頁面設計和FAQ部分已經上線。

方法3：使用WordPress詳細信息塊顯示和隱藏文字（無需插件）

如果您不想使用插件或任何短代碼，可以使用WordPress內置的詳細信息塊來顯示和隱藏文字。此功能也非常適合FAQ。

要使用此塊，只需打開需要編輯的頁面或文章的Gutenberg編輯器。在介面上的任何地方，單擊‘+ 添加塊’按鈕以找到詳細信息塊。在向下箭頭標誌旁邊的空間中，您可以寫下您的常見問題。在底部，您可以鍵入該問題的答案。在塊設置側欄中，您可以選擇是否希望答案默認情況下打開。

完成後，只需預覽您的網站。然後，單擊‘更新’或‘發布’。

我們希望這篇文章能幫助您了解如何在WordPress文章中使用切換效果來顯示和隱藏文字。您可能還想查看我們的最佳小型企業即時聊天軟件列表以及如何在WordPress中創建聯繫表單的教程。

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