最近，我們的一位用戶詢問我們是否有辦法在他們的 wordpress 網站上添加常見問題解答手風琴。有許多插件可讓您在 wordpress 中添加常見問題或常見問題解答部分。在本文中，我們將向您展示如何在 wordpress 網站中添加 jquery faq 手風琴。

什么是手風琴？

在網頁設計中，手風琴是一個用于用戶界面設計模式的術語，該模式具有在用戶交互時折疊或展開的選項卡或內容塊。每個選項卡下方都有內容，當用戶單擊菜單項時，這些內容會展開。簡單來說，它就像一個菜單，點擊它就會展開。我們在免費的 wordpress 博客設置頁面上使用了類似的效果。下面是手風琴示例的屏幕截圖。

視頻教程

https://www.youtube.com/embed/xwC8wgKyjVw?version=3&rel=0&fs=1&showsearch=0&showinfo=1&iv_load_policy=1&wmode=transparent訂閱 WPBeginner

https://www.youtube.com/subscribe_embed?usegapi=1&channel=wpbeginner&layout=default&count=default&origin=https%3A%2F%2Fwpbeginner.com&gsrc=3p&ic=1&jsh=m%3B%2F_%2Fscs%2Fapps-Static%2F_%2Fjs%2Fk%3Doz.gapi.en.vQiXRrxCe40.O%2Fam%3DAQ%2Fd%3D1%2Frs%3DAGLTcCMBxIGVyXSdvvcs43a64yHt_P7dfg%2Fm%3D__features__#_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart%2Concircled%2Cdrefresh%2Cerefresh&id=I0_1448178294715&parent=https%3A%2F%2Fwpbeginner.com

如果您不喜歡該視頻或需要更多說明，請繼續(xù)閱讀。

添加 jquery FAQ Accordion

在添加 jQuery FAQ 手風琴之前，您需要確保您有 FAQ 部分。首先按照我們有關如何在 WordPress 中添加常見問題解答部分的教程添加常見問題解答部分。

現(xiàn)在讓我們繼續(xù)添加 jQuery FAQ 手風琴。WordPress 附帶 jQuery 庫，但沒有 jquery 主題。我們將從 Google CDN 加載該腳本并在 WordPress 中對這些腳本進行排隊。我們還將創(chuàng)建一個短代碼來顯示我們的常見問題。最重要的是，我們將通過創(chuàng)建 WordPress 插件來完成這一切。

在桌面上創(chuàng)建一個文件夾并將其命名為 my-accordion。打開記事本或您選擇的任何其他文本編輯器。創(chuàng)建一個名為的文件my-accordion.php并將以下代碼粘貼到其中：