內容簡介
CDN Error Mockups 外掛提供一個區塊，用於創建逼真的 Cloudflare 風格錯誤畫面。可用於錯誤頁面模板、維護頁面、設計預覽及輕鬆的網站體驗，幫助用戶更好地理解錯誤狀況。
【主要功能】
• 自訂錯誤標題、HTTP 錯誤碼及說明訊息
• 獨立配置瀏覽器、Cloudflare 和主機標籤及狀態
• 顯示訪客的 IP 地址而不需外部服務
• 生成新的模擬 Ray ID 和時間戳
• 保持鍵盤焦點並向輔助技術宣告 IP 地址
• 隔離區塊的 CSS 以避免與佈景主題衝突
外掛標籤
開發者團隊
原文外掛簡介
CDN Error Mockups provides a block for creating realistic Cloudflare-style
error screens.
Use it in error page templates, maintenance pages, design previews, and
lighthearted site experiences.
The block is independently developed and is not affiliated with, endorsed by,
or connected to Cloudflare, Inc.
Features
Customize the error title, HTTP error code, and explanatory messages.
Configure Browser, Cloudflare, and Host labels and statuses independently.
Choose which service is presented as the source of the error.
Reveal the visitor’s IP address without calling an external service.
Generate a new mock Ray ID and timestamp when the page loads.
Preserve keyboard focus and announce the revealed IP to assistive technology.
Adapt the three service statuses for desktop and narrow screens.
Keep the block’s CSS isolated from the surrounding WordPress theme.
Usage
Open a post, page, or template in the block editor.
Add the CDN Error Mockup – Cloudflare block.
Use the block settings sidebar to configure:
The title and error code.
The “What happened?” and “What can I do?” messages.
Browser, Cloudflare, and Host names, locations, and status text.
The service that should appear as the source of the error.
Publish or preview the page.
The block works well in:
404 and other error templates.
Maintenance and temporary outage pages.
Theme and page-builder previews.
Demo, educational, and humorous content.
IP address display and privacy
The IP address is requested only after a visitor selects Click to reveal.
The request is sent to this plugin’s REST API endpoint on the same WordPress
site.
No external IP lookup service is contacted.
The endpoint checks CF-Connecting-IP, X-Forwarded-For, and REMOTE_ADDR.
Sites behind a CDN or reverse proxy should configure that proxy correctly,
because forwarded headers can otherwise be inaccurate or spoofed.
The displayed value is informational and should not be used for authentication
or authorization.
Source code
Human-readable JavaScript and SCSS source is available in the
src directory.
Compiled assets distributed with the plugin are stored in build.
Credits
The project is based on ideas and code from
cloudflare-error-page by donlon, licensed under the
MIT License.
See THIRD_PARTY_LICENSES.md for details.
