內容簡介
WPWing Sticky Block 可以添加在任何地方，並且在滾動到頁面頂部時，可以成為浮動塊並保持在頂部，並提供可選的偏移像素。WPWing Sticky Block 是一個容器塊，意味著您可以在其中添加其他塊（使它們全部浮動），或者將其添加到另一個塊中，例如列等。
功能特色
容器塊：WPWing Sticky Block 可以作為容器塊，可容納其他塊。
常規塊：您可以在任何列、群組或表塊中添加 WPWing Sticky Block。
從頂部定位：您可以在 WPWing Sticky Block 和頁面頂部之間添加任意空間。
管理列感知：如果當前用戶有管理工具欄，則 WPWing Sticky Block 將添加高度並在此之後浮動。
z-index：您可以使用 z-index，使任何元素都無法遮擋 WPWing Sticky Block。
外掛標籤
開發者團隊
原文外掛簡介
WPWing Sticky Block is a Gutenberg container block that sticks to the top of the page once the visitor scrolls past it. Drop any blocks inside — a navigation menu, a call-to-action, a contact button, a sidebar widget — and they will follow the reader down the page.
Unlike CSS position: sticky (which only works within its parent scroll container), WPWing Sticky Block uses position: fixed with intelligent scroll detection, so it works reliably in any layout.
Key Features
Multiple sticky blocks per page — place as many sticky blocks as you need, each with its own settings.
Container block — nest any Gutenberg blocks inside: navigation, buttons, headings, images, widgets.
Top offset — set how many pixels of space to leave between the sticky block and the top of the viewport.
Admin toolbar aware — automatically shifts down for logged-in users who have the WordPress admin bar visible.
Z-index control — fine-tune stacking order so the sticky block always sits above (or below) other elements.
Scroll direction mode — choose “Always sticky” or “Only while scrolling up” (the pattern used by modern sticky headers that appear on the way back up).
Stop before an element — un-stick the block before it overlaps a footer or another landmark, using a CSS selector (e.g. #footer).
Disable on mobile — turn off sticky behaviour below a configurable viewport breakpoint (default 768 px).
Sticky-state background color — set a background color that only appears while the block is stuck, e.g. a solid white behind a transparent nav.
Sticky-state shadow — add a drop shadow (Small / Medium / Large) that appears only when the block is in sticky position.
Sticky-state top padding — add extra breathing room above the content when the block is stuck.
Accessibility — set an aria-label on the sticky wrapper to give screen reader users useful context.
Zero dependencies — no jQuery. The frontend script is plain JavaScript, under 2 KB minified.
How to use
In the block editor, search for Sticky Block and insert it anywhere on your page.
Add blocks inside it — a Navigation block, a Button, a Group, anything you like.
Open the block settings panel on the right and adjust offset, z-index, scroll behaviour, and sticky-state styles.
Preview your page and scroll — the block will stick to the top.
