无插件开发基础,如何在WooCommerce PDF发票中打印产品图片
在WooCommerce PDF发票中添加产品图片的免费实现方案
嗨,这个需求完全能搞定!不用买付费插件,也不用懂复杂的插件开发,咱们借助WooCommerce官方的免费PDF工具+简单代码片段就能实现,具体操作如下:
第一步:准备基础工具
首先确保你安装了WooCommerce官方的免费插件 PDF Invoices & Packing Slips(如果还没装,直接在WordPress后台插件中心搜索安装启用就行,这是最常用的免费PDF发票工具)。
另外推荐安装「Code Snippets」插件——它能帮你安全添加自定义代码,不用修改主题的functions.php(避免主题更新时代码丢失,新手友好)。
第二步:添加自定义代码
打开Code Snippets的「添加新片段」页面,复制粘贴以下代码:
// 在PDF发票的每个订单项前插入产品图片 add_action( 'woocommerce_pdf_invoice_before_order_item', 'display_product_image_in_pdf_invoice', 10, 3 ); function display_product_image_in_pdf_invoice( $item, $order, $document_type ) { // 只针对发票文档生效,排除装箱单等其他类型 if ( $document_type !== 'invoice' ) return; // 获取当前订单项对应的产品对象 $product = $item->get_product(); if ( !$product ) return; // 获取产品的缩略图URL(这里用WordPress默认的thumbnail尺寸,可按需修改) $image_id = $product->get_image_id(); $image_url = wp_get_attachment_image_url( $image_id, 'thumbnail' ); // 如果产品有图片,就输出图片的HTML(PDF插件会自动解析渲染) if ( $image_url ) { echo '<img src="' . esc_url( $image_url ) . '" style="width: 50px; height: auto; margin-right: 12px; float: left;" />'; } }
代码小说明:
- 这段代码利用了PDF发票插件提供的钩子,会自动遍历订单里的每个产品(相当于帮你实现了foreach循环的逻辑),逐个为产品添加图片
- 你可以调整
width: 50px来修改图片大小,也可以把thumbnail改成medium等WordPress预设的图片尺寸 - 样式里的
float: left是让图片和产品文字并排显示,你可以根据需求调整样式细节
第三步:测试效果
保存并启用这个代码片段后,去后台找一个已有的订单,点击「生成PDF发票」,就能看到每个产品的缩略图显示在订单项的左侧啦!
备选方案(不用Code Snippets)
如果你不想装额外插件,也可以把这段代码添加到你的子主题的functions.php文件末尾——注意一定要用子主题,否则主题更新时代码会被覆盖掉。
内容的提问来源于stack exchange,提问作者Rakib Chowdhury




