[WordPress] 外掛分享: Accessible Carousel & Slider – WCAG AA Compliant Slideshow

首頁外掛目錄 › Accessible Carousel & Slider – WCAG AA Compliant Slideshow
WordPress 外掛 Accessible Carousel & Slider – WCAG AA Compliant Slideshow 的封面圖片
400+
安裝啟用
★★★★★
5/5 分(1 則評價)
2 天前
最後更新
問題解決
WordPress 6.5+ PHP 7.4+ v2.5.6 上架:2026-06-18

內容簡介

Accessible Carousel & Slider 是一款專為 WordPress 區塊編輯器設計的外掛,提供無障礙的旋轉木馬和卡片滾動功能,符合 WCAG Level AA 標準。它支援鍵盤操作和螢幕閱讀器,並具備可見的暫停控制,讓使用者能夠輕鬆地使用和編輯。

【主要功能】
• 提供無障礙的旋轉木馬和卡片滾動區塊
• 完全支援鍵盤操作與螢幕閱讀器
• 無自動播放選項,暫停控制始終可見
• 可插入和編輯現成的佈局樣式
• 具備高可見性的焦點指示器

外掛標籤

開發者團隊

⬇ 下載最新版 (v2.5.6) 或搜尋安裝

① 下載 ZIP → 後台「外掛 › 安裝外掛 › 上傳外掛」
② 後台搜尋「Accessible Carousel & Slider – WCAG AA Compliant Slideshow」→ 直接安裝(推薦)
📦 歷史版本下載

原文外掛簡介

Accessible Carousel & Slider gives the WordPress block editor two accessibility-first blocks — a hero carousel / slider and a native card scroller — built to WCAG Level AA. Use it as an accessible carousel, slider, or slideshow that is fully keyboard-operable, screen-reader friendly, and responsive, with an always-visible pause control and no forced autoplay. Both are real Gutenberg blocks, so there are no shortcodes and nothing is hidden from assistive technology, plus ready-made patterns you can insert and edit.
Live demo: Try the accessible carousel & slider demo »
Hero carousel (built to the W3C/WAI Carousels tutorial): each slide has a background image and a solid “contrast box” holding a heading, a paragraph, and an optional button, placed left, right, or bottom. The solid box guarantees readable text contrast over any image. No autoplay by default; when enabled, a configurable pause/stop control is always shown.
Card scroller: a native CSS scroll-snap row of cards. Because it uses real browser scrolling, it works with the keyboard, touch, the scrollbar, and screen readers with no JavaScript — and nothing is hidden from assistive technology, avoiding the focusable-but-hidden trap common to multi-slide carousels. “Cards per view” is pure CSS (it steps down to 2 then 1 on smaller screens), and there is no autoplay.
Patterns: insert ready-made layouts (hero overlay, hero card, autoplay showcase, minimal, features row, services row) from the Accessible Carousel category, then edit freely. To save your own configured layout as a template, use WordPress’s built-in “Create pattern” on the block toolbar.
Carousel accessibility features

Carousel is a labelled region containing a semantic list of slides; with JavaScript off it degrades to a readable list.
Controls are real buttons, fully keyboard operable, with no keyboard trap.
Keyboard focus is never moved by next/previous or by auto-advance.
A visually hidden polite live region announces “Item x of y” on user-initiated changes; auto-rotation stays silent so it does not interrupt screen reader users.
No autoplay by default; when enabled, a stop/start control is always provided (WCAG 2.2.2) and rotation pauses on hover and focus.
Transition animations (fade or slide) are disabled automatically under prefers-reduced-motion.
Background images are decorative by default, with a real alt-text option when the image is meaningful.
Solid contrast box, 44px control targets, and a high-visibility focus indicator.

Card scroller accessibility features

Native CSS scroll-snap: keyboard, touch, scrollbar, and screen readers all work with no JavaScript.
The scroll region is itself keyboard-focusable and labelled, so it can be scrolled with the arrow keys.
Cards are a real list; nothing is set to aria-hidden, so there is no focusable-but-hidden content.
Each card link carries hidden context (e.g. “Learn more – Design”) so repeated links have distinct names (WCAG 2.4.4).
No autoplay. Optional previous/next buttons are added only when the cards overflow, so there are never dead controls.
“Cards per view” is responsive by CSS (desktop value, capped at 2 on tablet and 1 on mobile).

Links

Plugin home & documentation
Live demo
More accessibility plugins from Ananyoo — further WordPress accessibility plugins are in active development.
Support & contact

Privacy
This plugin collects no data, contacts no external services, and adds no front-end links.

延伸相關外掛

文章
Filter
Apply Filters
Mastodon