內容簡介
Hero Color Picker 是一款為每篇文章提供背景色和字體顏色控制的外掛，讓使用者能夠透過 CSS 自訂英雄樣式，提升文章的視覺效果。
【主要功能】
• 提供背景色和字體顏色的控制選項
• 具備即時預覽功能，方便調整顏色
• 支援 WCAG AAA 正常文本的可及性檢查
• 只在編輯文章時顯示控制面板
• 移除自訂背景色時的特色圖片預覽輪廓
• 可在文章列表中顯示自訂英雄背景色的文章
外掛標籤
開發者團隊
原文外掛簡介
Hero Color Picker adds per-post background and font color controls to the editor sidebar for hero styling via CSS on elements with the hero-colored class.
Features:
– Two color controls: Background Color and Font Color
– On-demand color pickers in compact dropdown popovers
– Live preview of both colors together directly in the sidebar
– Applies selected colors to the editor post summary area for a closer backend preview
– Removes the featured image preview outline while a custom background color is active
– Accessibility check for WCAG AAA Normal Text with PASS / FAILED status
– Panel is shown only while editing posts (post), not in template editing contexts
– Adds a core-like posts list view Hero Background to show only posts with a custom hero background color
– Works on elements that have the CSS class hero-colored
Stored as post meta:
– hero_color_picker_hero_color
– hero_color_picker_font_color
Frontend output (only when values are set):
.hero-colored {
background-color: $background;
color: $font;
}
Important template setup:
– Open your block theme template (for example Single) in the Site Editor.
– Select the Group block that should receive the hero styles.
– In block settings, add hero-colored to Additional CSS class(es).
