如何不修改vendor文件自定义sylius_taxon_image_widget控件

注意事项 #

• 禁止直接修改vendor目录下的原始文件，后续Sylius版本更新会直接覆盖你的自定义修改，需使用官方推荐的模板覆写机制实现修改。

操作步骤 #

1. 在你的项目模板目录下创建覆写用的路径：templates/bundles/SyliusUiBundle/Form/imagesTheme.html.twig
2. 将下方修改后的代码写入该文件即可生效：

{% block sylius_taxon_image_widget %}
    {% apply spaceless %}
        {{ form_row(form.type) }}
        {% if form.vars.value.path|default(null) is null %}
            <label for="{{ form.file.vars.id }}" class="ui icon labeled button"><i class="cloud upload icon"></i> {{ 'sylius.ui.choose_file'|trans }}</label>
        {% else %}
            <img class="ui small bordered image" src="{{ form.vars.value.path|imagine_filter('sylius_admin_product_original') }}" alt="{{ form.vars.value.type }}" />
            <label for="{{ form.file.vars.id }}" class="ui icon labeled button"><i class="cloud upload icon"></i> {{ 'sylius.ui.change_file'|trans }}</label>
        {% endif %}
        <div class="ui hidden element">
            {{ form_widget(form.file) }}
        </div>
        <div class="ui element">
            {{- form_errors(form.file) -}}
        </div>
    {% endapply %}
{% endblock %}

修改说明 #

本次仅调整了img标签src属性调用的liip_imagine过滤器，将原有的sylius_small替换为sylius_admin_product_original，其余逻辑和官方默认模板完全一致，不会影响原有上传功能的正常运行。

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