最近,我們的一位用戶詢問我們是否有辦法在他們的 wordpress 網(wǎng)站上添加常見問題解答手風琴。有許多插件可讓您在 wordpress 中添加常見問題或常見問題解答部分。在本文中,我們將向您展示如何在 wordpress 網(wǎng)站中添加 jquery faq 手風琴。
什么是手風琴?
在網(wǎng)頁設計中,手風琴是一個用于用戶界面設計模式的術語,該模式具有在用戶交互時折疊或展開的選項卡或內(nèi)容塊。每個選項卡下方都有內(nèi)容,當用戶單擊菜單項時,這些內(nèi)容會展開。簡單來說,它就像一個菜單,點擊它就會展開。我們在免費的 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并將以下代碼粘貼到其中: