
內容簡介
摺疊區塊外掛(Accordion Block Lite)是一個可存取和具有回應式的外掛,可在區塊編輯器插入器中添加,用於顯示可展開和摺疊以顯示或隱藏相關內容的列表項目。
非常適合縮短冗長或複雜的內容,例如常見問題(FAQ)。同時也有助於減少頁面滾動。
主要功能:
- 可存取性
- 回應式
- 支援插入器按鈕添加折疊項目
設定:
- 區塊對齊
- 文字對齊
- 文字格式
- 頁首元素
- 頁首圖示 [高級版]
- 頁首圖示位置 [高級版]
樣式:
- 顏色
- 文字
- 背景
- 連結
- 頁首文字 [高級版]
- 頁首文字懸停 [高級版]
- 頁首文字選取 [高級版]
- 頁首圖示 [高級版]
- 頁首圖示懸停 [高級版]
- 頁首圖示選取 [高級版]
- 頁首背景 [高級版]
- 頁首背景懸停 [高級版]
- 頁首背景選取 [高級版]
- 面板文字 [高級版]
- 面板背景 [高級版]
字體排印:
- 字體系列
- 字體大小
- 外觀
- 行高
- 字母間距
- 文字裝飾
- 字母大小寫
尺寸:
- 內邊距
- 外邊距
- 項目內邊距 [高級版]
- 項目外邊距 [高級版]
- 頁首圖示寬度 [高級版]
- 頁首內邊距 [高級版]
- 頁首外邊距 [高級版]
- 面板內邊距 [高級版]
- 面板外邊距 [高級版]
邊框:
- 項目邊框 [高級版]
- 項目邊角半徑 [高級版]
- 頁首邊框 [高級版]
- 頁首懸停邊框 [高級版]
- 頁首選取邊框 [高級版]
- 頁首邊角半徑 [高級版]
- 面板邊框 [高級版]
- 面板邊角半徑 [高級版]
變化 [高級版]:
- 線條 [高級版]
- 區塊 [高級版]
展示示例:[連結](https://troytempleman.com/wordpress/blocks/accordion-block/)
HTML 結構示例:
<ul class="wp-block-tt-accordion ">
<li class="wp-block-tt-accordion-item wp-block-tt-accordion-item-1">
<p class="wp-block-tt-accordion-item-header">
<button class="wp-block-tt-accordion-item-header-button" id="wp-block-tt-accordion-item-header-button-9515cb6e-8464-424b-a277-3102bd5202cf" type="button" aria-expanded="false" aria-controls="wp-block-tt-accordion-item-panel-9515cb6e-8464-424b-a277-3102bd5202cf">
<span class="wp-block-tt-accordion-item-header-button-text">標題</span>
<span class="wp-block-tt-accordion-item-header-button-icon-arrow" aria-hidden="true">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
<polyline points="4.711,8 12,15.289 19.289,8" stroke="black" stroke-width="2" fill="none"></polyline>
</svg>
</span>
</button>
</p>
<div class="wp-block-tt-accordion-item-panel" id="wp-block-tt-accordion-item-panel-9515cb6e-8464-424b-a277-3102bd5202cf" role="region" aria-labelledby="wp-block-tt-accordion-item-header-button-9515cb6e-8464-424b-a277-3102bd5202cf" hidden="">
<p>面板</p>
</div>
</li>
</ul>
支援:
如果您需要關於摺疊區塊外掛的幫助,請在[支援論壇](https://wordpress.org/support/plugin/accordion-block-lite)提交票據。
捐助:
如果您喜歡摺疊區塊外掛並希望支持未來的開發,不妨為我買杯咖啡吧?
貢獻:
如果您希望貢獻開發摺疊區塊外掛,存放庫在GitHub上。
授權:
摺疊區塊外掛遵從GNU通用公共許可證第二版(GPLv2)發布。
需求:
- WordPress 6.0或更高版本
- PHP版本7.4或更高版本
- MySQL版本5.7或更高版本,或MariaDB版本10.3或更高版本。
Credits:
- W3C折疊式區塊(具有顯示/隱藏功能的區塊)
- 可存取的摺疊區塊
- 可摺疊區塊
- 我最喜歡的可存取折疊式區塊模式
- JavaScript和可存取性:折疊式區塊
- 創建使用InnerBlock組件的摺疊區塊。
外掛標籤
開發者團隊
原文外掛簡介
Accordion Block Lite adds an accessible and responsive Accordion block to the block editor inserter that can be added to display list items that expand and collapse to show and hide their associated sections of content.
Ideal for condensing longform or complex content, such as Frequently Asked Questions (FAQ). Also useful for reducing page scrolling.
Upgrade to Pro at https://troytempleman.com/wordpress/blocks/accordion-block/.
Features
Accessible
Responsive
Inserter button for adding accordion items
Settings
Block alignment
Text alignment
Text formatting
Header element
Header icon [Pro]
Header icon position [Pro]
Styles
Color
Text
Background
Link
Header text [Pro]
Header text hover [Pro]
Header text active [Pro]
Header icon [Pro]
Header icon hover [Pro]
Header icon active [Pro]
Header background [Pro]
Header background hover [Pro]
Header background active [Pro]
Panel text [Pro]
Panel background [Pro]
Typography
Font family
Font size
Appearance
Line height
Letter spacing
Text decoration
Letter case
Dimensions
Padding
Margin
Item padding [Pro]
Item margin [Pro]
Header icon width [Pro]
Header padding [Pro]
Header margin [Pro]
Panel padding [Pro]
Panel margin [Pro]
Border
Item border [Pro]
Item border radius [Pro]
Header border [Pro]
Header border hover [Pro]
Header border active [Pro]
Header border radius [Pro]
Panel border [Pro]
Panel border radius [Pro]
Variations [Pro]
Lines [Pro]
Blocks [Pro]
Demo
HTML
Accordion Block Lite will output an Accordion block with the following HTML structure:
-
Panel
Support
If you need help with Accordion Block Lite, please submit a ticket on the Support forum.
Donate
If you like Accordion Block Lite and would like to support it’s future development, how about buying me a coffee?
Contribute
If you would like to contribute to the development of Accordion Block Lite, the repository is located on GitHub.
License
Accordion Block Lite is released under the GNU General Public License, version 2 (GPLv2).
Requirements
WordPress 6.0 or greater
PHP version 7.4 or greater
MySQL version 5.7 or greater or MariaDB version 10.3 or greater.
Credits
W3C Accordion (Sections With Show/Hide Functionality)
Accessible Accordion
Collapsible Sections
My favourite accessible accordion pattern
JavaScript and Accessibility: Accordions
Creating an Accordion Block that uses the InnerBlock component
