如何通过自定义模块在Odoo电商网站中为产品添加多图功能？

嘿，我刚好折腾过类似的需求，给你一步步拆解怎么实现，全程用自定义模块搞定，不改动Odoo核心代码：

第一步：搭建自定义模块基础架子 #

先创建一个叫product_multi_image的模块，核心的__manifest__.py配置如下：

{
    'name': 'Product Multiple Images',
    'version': '1.0',
    'category': 'Product',
    'summary': 'Add multiple images to products for e-commerce',
    'depends': ['product', 'website_sale'],
    'data': [
        'views/product_template_views.xml',
        'views/product_image_views.xml',
        'views/website_sale_template.xml',
    ],
    'installable': True,
    'auto_install': False,
    'application': False,
}

注意：依赖里一定要加product和website_sale，不然模块跑不起来

第二步：创建产品图片关联模型 #

咱们需要一个单独的模型来存每张产品图片，和产品模板做一对多关联。在models/product_image.py里写：

from odoo import models, fields

class ProductImage(models.Model):
    _name = 'product.image'
    _description = 'Product Additional Images'
    _order = 'sequence asc'

    name = fields.Char('Image Description')
    image = fields.Binary('Image', required=True)
    sequence = fields.Integer('Sequence', default=10)
    product_tmpl_id = fields.Many2one('product.template', string='Product Template', required=True, ondelete='cascade')

这里的sequence字段是用来控制图片显示顺序的，数字越小越靠前；product_tmpl_id把图片绑定到对应的产品模板上。

第三步：给产品模板添加多图字段 #

接下来要在产品模板模型里加一个one2many字段，让产品能关联多张图片。创建models/product_template.py继承原模型：

from odoo import models, fields

class ProductTemplate(models.Model):
    _inherit = 'product.template'

    product_image_ids = fields.One2many('product.image', 'product_tmpl_id', string='Additional Images')

这样后台产品表单里就能看到这个多图字段了。

第四步：修改后台视图，让用户能上传多图 #

现在要把多图字段加到产品的表单视图里，方便管理员上传管理图片。在views/product_template_views.xml里写：

<odoo>
    <record id="product_template_form_view_inherit" model="ir.ui.view">
        <field name="name">product.template.form.view.inherit</field>
        <field name="model">product.template</field>
        <field name="inherit_id" ref="product.product_template_form_view"/>
        <field name="arch" type="xml">
            <!-- 在原产品图片字段后面添加多图区域 -->
            <field name="image" position="after">
                <page string="Additional Images">
                    <field name="product_image_ids" widget="one2many_list">
                        <tree editable="bottom">
                            <field name="sequence"/>
                            <field name="name"/>
                            <field name="image" widget="image" class="oe_avatar"/>
                        </tree>
                    </field>
                </page>
            </field>
        </field>
    </record>
</odoo>

同时别忘了给图片模型加个基础视图，在views/product_image_views.xml里：

<odoo>
    <record id="product_image_form_view" model="ir.ui.view">
        <field name="name">product.image.form.view</field>
        <field name="model">product.image</field>
        <field name="arch" type="xml">
            <form>
                <group>
                    <field name="name"/>
                    <field name="image" widget="image" class="oe_avatar_large"/>
                    <field name="sequence"/>
                </group>
            </form>
        </field>
    </record>
</odoo>

第五步：在电商前端显示多图 #

最后一步就是让网站上的产品详情页显示这些多图了。咱们继承电商的产品模板，在views/website_sale_template.xml里写：

<odoo>
    <template id="product_images_carousel_inherit" inherit_id="website_sale.product">
        <xpath expr="//div[hasclass('product_main_image')]" position="after">
            <div class="product_additional_images mt-4">
                <h5>更多图片</h5>
                <div class="d-flex flex-wrap gap-2">
                    <t t-foreach="product.product_image_ids" t-as="img">
                        <img t-att-src="website.image_url(img, 'image')" class="img-thumbnail" style="width:150px; height:150px; object-fit:cover;" t-att-alt="img.name or product.name"/>
                    </t>
                </div>
            </div>
        </xpath>
    </template>
</odoo>

这段代码会在产品主图后面显示所有附加图片，你也可以改成轮播组件（比如用Odoo自带的owl-carousel），效果会更美观。

最后一步：安装模块测试 #

把模块放到Odoo的addons目录下，刷新应用列表，找到Product Multiple Images模块安装。之后打开任意产品表单，就能看到“Additional Images”标签页，上传图片后去电商网站的产品详情页就能看到多图啦！

备注：内容来源于stack exchange，提问作者Karthick1211