You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在WordPress中实现含自定义内容与图片的Word文档下载按钮?

解决方案实现步骤

一、核心:PHP生成Word文档逻辑

Word支持解析带特定头部的HTML内容,我们可以通过输出HTML并设置响应头,让浏览器将其识别为Word文档下载。

  1. 创建生成Word的PHP函数(通过PHP代码片段插件添加):
function generate_newsletter_word() {
    // 拦截非POST请求
    if (!isset($_POST['generate_newsletter'])) {
        return;
    }

    // 获取目标页面片段内容
    // 示例:替换123为你需要提取内容的页面ID,或直接调用你的自定义内容生成函数
    $page_content = get_post_field('post_content', 123);
    // 若用自定义PHP生成内容,替换为:$page_content = your_custom_content_function();

    // 处理赞助商图片上传
    $sponsor_image = '';
    if (!empty($_FILES['sponsor_image']['tmp_name'])) {
        $upload_info = wp_upload_dir();
        $image_save_path = $upload_info['path'] . '/' . basename($_FILES['sponsor_image']['name']);
        move_uploaded_file($_FILES['sponsor_image']['tmp_name'], $image_save_path);
        $image_display_url = $upload_info['url'] . '/' . basename($_FILES['sponsor_image']['name']);
        $sponsor_image = '<div style="margin-top: 40px; text-align: center;"><img src="' . esc_url($image_display_url) . '" alt="赞助商图片" style="max-width: 100%;"></div>';
    }

    // 拼接最终文档内容
    $final_content = '<html>
<head>
<meta charset="UTF-8">
<title>通讯稿</title>
<style>
body { font-family: "微软雅黑", Arial, sans-serif; font-size: 14px; line-height: 1.6; }
h1 { font-size: 22px; text-align: center; margin-bottom: 30px; }
p { margin-bottom: 15px; }
</style>
</head>
<body>
<h1>通讯稿</h1>
' . apply_filters('the_content', $page_content) . '
' . $sponsor_image . '
</body>
</html>';

    // 设置响应头触发下载
    header("Content-type: application/vnd.ms-word");
    header("Content-Disposition: attachment;Filename=通讯稿_" . date('Ymd') . ".doc");
    echo $final_content;
    exit;
}
add_action('init', 'generate_newsletter_word');

二、前端页面实现(创建独立页面后添加)

通过短代码在页面中展示内容预览、上传区域和生成按钮:

function newsletter_page_content() {
    ob_start(); ?>
    <div class="newsletter-container">
        <h2>通讯稿预览</h2>
        <div class="newsletter-preview">
            <?php
            // 和生成Word时的内容保持一致,用于前端预览
            $page_content = get_post_field('post_content', 123);
            echo apply_filters('the_content', $page_content);
            ?>
        </div>

        <div class="sponsor-upload" style="margin-top: 40px; padding: 20px; border: 1px solid #eee;">
            <h3>添加赞助商图片</h3>
            <form method="post" enctype="multipart/form-data">
                <input type="file" name="sponsor_image" accept="image/*" style="margin-bottom: 15px;">
                <button type="submit" name="generate_newsletter" class="button button-primary">生成Word文档</button>
            </form>
        </div>
    </div>
    <?php
    return ob_get_clean();
}
add_shortcode('newsletter_generator', 'newsletter_page_content');

在独立页面中插入短代码 [newsletter_generator] 即可生效。

三、关键注意事项

  • 替换代码中的页面ID(123)为实际需要提取内容的页面ID,或替换为你的自定义内容生成函数。
  • 确保wp-content/uploads目录有写入权限,保证图片上传功能正常。
  • 可根据需求修改HTML内的CSS样式,调整Word文档的排版效果。
  • 若不需要上传图片,直接删除表单中的文件上传字段和生成逻辑里的图片处理代码即可。

内容的提问来源于stack exchange,提问作者Marija Kasalo

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.09 11:37:49