本文介绍如何在 wordpress 页面模板中，通过 php 动态生成 css 背景图 url，支持按页面 slug、id 或自定义规则匹配媒体库中的对应图片，并提供默认回退机制。
在 WordPress 主题开发中，为不同页面设置专属背景图是提升视觉差异化与用户体验的常见需求。与其为每个页面单独编写模板文件，更高效的方式是在单一页面模板（如 page.php 或自定义模板）中，通过 PHP 动态判断当前页面上下文，并注入对应的背景图路径。
✅ 推荐实现方式：基于页面 ID 自动匹配媒体库图片
你提到计划将图片统一存放在 wp-content/uploads/page-bgs/ 目录下，命名为 background-{page_id}.jpg（例如 background-123.jpg），这种结构清晰、易于维护。以下是专业、健壮的实现方案：
⚠️ 关键注意事项
- 路径安全：务必使用 wp_upload_dir() 获取真实服务器路径，而非拼接 URL 判断文件存在——URL 不可直接用于 file_exists()。
- 转义输出：使用 esc_url() 防止 XSS 风险；若图片路径含用户输入（如动态 slug），需额外校验。
- 性能优化：该逻辑仅在渲染时执行一次，无数据库查询开销；如需更高性能，可结合 wp_cache_set/get 缓存结果。
- 默认图建议：将 fallback-hero-bg.jpg 放入主题 assets/images/ 目录，便于版本控制和 CDN 加速；避免依赖外部占位服务（如 via.placeholder.com），保障离线/生产环境稳定性。
-
扩展性提示：如需按页面 slug（如 is_page('about')）或自定义字段（ACF）匹配，可替换 $page_id 逻辑，例如：
$slug = get_post_field('post_name', $page_id); $bg_filename = 'background-' . sanitize_key($slug) . '.jpg';
此方案兼顾灵活性、安全性与可维护性，无需插件即可实现“一模板多背景”，是 WordPress 主题开发中的最佳实践之一。
