內容簡介
Floating News Headline 是一款專業級、輕量級的新聞跑馬燈外掛，旨在提供快速、美觀且不會與佈景主題衝突的解決方案。它可以在您的 WordPress 網站上顯示即時新聞、最新文章、精選標題或自訂警示，並以流暢的浮動條形式呈現。
【主要功能】
• 即時預覽：在控制台中實時查看變更，無需重新整理頁面
• 多來源內容：從最新文章中提取標題或自訂警示
• 手動選擇文章：搜尋並選擇最多 5 篇特定文章顯示
• 自訂速度：調整跑馬燈的滾動速度以符合需求
• 三種免費佈景主題：提供多樣化的設計選擇
外掛標籤
開發者團隊
📦 歷史版本下載
原文外掛簡介
Floating News Headline is a professional-grade, lightweight news ticker plugin designed for speed, beauty, and zero theme conflicts. Display breaking news, latest posts, hand-picked headlines, or custom alerts in a sleek, non-intrusive floating bar on your WordPress site.
Built from the ground up with a modern React admin dashboard and GPU-accelerated BEM-CSS architecture, this plugin delivers silky-smooth scrolling animations without slowing down your website.
🚀 Why Choose Floating News Headline?
Unlike other ticker plugins that rely on heavy jQuery dependencies and outdated markup, Floating News Headline uses:
Vanilla JavaScript on the frontend — zero jQuery dependency
CSS transform: translateX() animations — GPU-accelerated for 60fps scrolling
BEM (Block-Element-Modifier) CSS — zero naming collisions with your theme
WordPress Transient API — intelligent caching to minimize database queries
PSR-4 Style Autoloading — clean, maintainable PHP architecture
WordPress REST API — secure, nonce-verified AJAX communication
🎨 3 Premium Themes Included (Free)
Corporate Classic — Clean, professional Indigo-themed design with post thumbnails, author metadata, and a document icon label. Perfect for business and corporate sites.
Dark Night — Sleek, high-contrast Slate design with emerald status pulses, gradient blur overlays, and pipe dividers. Ideal for tech, gaming, and entertainment sites.
Floating Pill — Modern, bubble-style Emerald design with glassmorphism blur effects and rounded corners. Great for blogs, startups, and creative portfolios.
✅ Key Features
Instant Live Preview — See your ticker changes in real-time within the admin dashboard before saving. No page refresh required.
Multi-Source Content — Pull headlines from your latest blog posts, manually select specific posts, or write a custom alert message with a link.
Manual Post Picker — Search and select up to 5 specific posts (free version) to display in your ticker with a beautiful search UI.
Customizable Speed — Control the scrolling speed from 5s (fast) to 100s (slow) with an intuitive range slider.
Item Spacing Control — Adjust the gap between ticker items from 0px to 200px for the perfect visual density.
Page Targeting — Choose to show the ticker on all pages or only on the homepage/front page.
Scroll Behavior — Choose between “Fixed” (always visible) or “Sticky on Scroll” (appears after scrolling down).
Sticky Top Placement — Automatically inject the ticker at the very top of your site using wp_body_open, or place it anywhere with a shortcode.
Play / Pause Control — Users can pause and resume the ticker with a built-in toggle button. Accessible with proper aria-label attributes.
Seamless Infinite Loop — Headlines scroll continuously with a duplicated group technique — no gaps, no stuttering.
Short Content Protection — If total headline text is too short for a seamless loop, the plugin automatically multiplies items to prevent visual breaks.
Customizable Labels — Change the ticker label text (e.g., “Breaking News”, “Latest Updates”) from the admin panel.
Responsive Design — Looks great on desktop, tablet, and mobile devices with adaptive layouts.
Lightweight & Fast — Under 40KB total frontend footprint (CSS + JS). No external CDN dependencies.
Settings Migration — Automatically migrates settings from the legacy fnh_settings option key to the new floating_news_headline_settings key.
Developer Hooks — Filter floating_news_headline_items to programmatically modify ticker items before rendering.
🔒 Security
All REST API routes are protected with manage_options capability checks
Input sanitization using sanitize_text_field(), sanitize_key(), intval(), and esc_url_raw()
Output escaping using esc_html(), esc_attr(), and esc_url() in all templates
Nonce verification via WordPress REST API X-WP-Nonce header
ABSPATH checks on all PHP files to prevent direct access
🏗️ Architecture
Namespace: FloatingNewsHeadline
Autoloader: PSR-4 style with spl_autoload_register
Classes: Activator, Adapter, Admin, Assets, Deactivator, Frontend, REST_API, Settings
Templates: corporate.php, dark.php, pill.php (BEM-structured HTML)
Build System: @wordpress/scripts with custom Webpack config for dual entry points (index.js for admin, frontend.js for public)
