如何在WordPress博客中不上传至媒体库，按日期展示对应照片组？

DevOps 小满

2026-5-19

Hey，这个需求简直是为日记类博客量身定做的！不用把几十张照片塞进WordPress媒体库（省得数据库臃肿），直接读取服务器文件夹里的图片就行，我给你整理了几个实用的方案，从简单到自动都有：

方案1：自定义文章模板（适合固定使用日记模板的场景）

如果你的所有日记文章都需要展示照片组，做个专属模板最方便：

找到当前主题的single.php文件，复制一份重命名为single-diary.php，然后在文件最开头加上模板声明：

<?php
/*
Template Name: 日记照片模板
Template Post Type: post
*/
?>

在模板里找到文章内容输出的位置（一般是the_content()函数附近），插入这段读取图片的代码：

<?php
// 获取文章标题（即yyyymmdd日期）
$date = get_the_title();
// 服务器上存储照片的文件夹路径
$photo_dir = ABSPATH . 'wp-content/daily-photos/';
// 照片的前端访问URL
$photo_url = get_site_url() . '/wp-content/daily-photos/';

// 匹配所有以当前日期开头的图片文件
$photos = glob($photo_dir . $date . '*.{jpg,jpeg,png,gif}', GLOB_BRACE);

if (!empty($photos)) {
    echo '<div class="daily-photos-gallery">';
    foreach ($photos as $photo) {
        $filename = basename($photo);
        $img_src = $photo_url . $filename;
        // 输出图片标签，带懒加载和安全转义
        echo '<img src="' . esc_url($img_src) . '" alt="每日照片 ' . $filename . '" loading="lazy">';
    }
    echo '</div>';
} else {
    echo '<p>今日暂无照片</p>';
}
?>

发布日记时，在文章编辑页的「模板」选项里选择「日记照片模板」，标题设为yyyymmdd格式即可自动加载对应照片。

方案2：短代码（灵活可控，想加哪里加哪里）

如果只有部分日记需要展示照片，短代码是更灵活的选择：

打开主题的functions.php文件，添加这段短代码函数：

function daily_photos_shortcode() {
    $date = get_the_title();
    $photo_dir = ABSPATH . 'wp-content/daily-photos/';
    $photo_url = get_site_url() . '/wp-content/daily-photos/';
    
    $photos = glob($photo_dir . $date . '*.{jpg,jpeg,png,gif}', GLOB_BRACE);
    
    if (empty($photos)) {
        return '<p>今日暂无照片</p>';
    }
    
    $output = '<div class="daily-photos-gallery">';
    foreach ($photos as $photo) {
        $filename = basename($photo);
        $img_src = $photo_url . $filename;
        $output .= '<img src="' . esc_url($img_src) . '" alt="每日照片 ' . $filename . '" loading="lazy">';
    }
    $output .= '</div>';
    
    return $output;
}
add_shortcode('daily_photos', 'daily_photos_shortcode');

写日记时，在文章内容里插入[daily_photos]，对应的照片组就会自动显示。
要是想让图片排列更美观，去主题「自定义」→「额外CSS」里加这段样式：

.daily-photos-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 15px;
    margin-top: 20px;
}
.daily-photos-gallery img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    object-fit: cover;
}

方案3：自动挂载图片（完全省心，发布即展示）

想彻底解放双手？用内容钩子自动给符合格式的日记加照片：
在主题的functions.php里添加这段代码：

function auto_add_daily_photos($content) {
    // 只处理标题为8位数字（yyyymmdd）的单篇文章
    $title = get_the_title();
    if (is_single() && preg_match('/^\d{8}$/', $title)) {
        $date = $title;
        $photo_dir = ABSPATH . 'wp-content/daily-photos/';
        $photo_url = get_site_url() . '/wp-content/daily-photos/';
        $photos = glob($photo_dir . $date . '*.{jpg,jpeg,png,gif}', GLOB_BRACE);
        
        if (!empty($photos)) {
            $gallery = '<div class="daily-photos-gallery">';
            foreach ($photos as $photo) {
                $filename = basename($photo);
                $img_src = $photo_url . $filename;
                $gallery .= '<img src="' . esc_url($img_src) . '" alt="每日照片 ' . $filename . '" loading="lazy">';
            }
            $gallery .= '</div>';
            $content .= $gallery;
        }
    }
    return $content;
}
add_filter('the_content', 'auto_add_daily_photos');

以后只要发布标题为yyyymmdd格式的文章，照片组会自动出现在内容末尾，连短代码都不用加！

关键注意事项

文件夹权限：服务器上的照片文件夹（比如wp-content/daily-photos）要设置为755权限，文件权限设为644，确保WordPress能正常读取。
图片命名建议：强烈建议给日期和序号加个分隔符（比如20240520-1.jpg），避免序号和日期混淆（比如20240520的序号12会和202405201的序号2重名）。改命名后记得把代码里的$date . '*'改成$date . '-*'。
安全与性能：代码里已经用esc_url()做了安全转义；loading="lazy"能减少页面加载压力；如果照片数量多，建议用CDN加速图片。
格式兼容：默认支持jpg、jpeg、png、gif，需要其他格式的话，直接在glob函数的大括号里添加即可（比如webp）。

内容的提问来源于stack exchange，提问作者jjp