Shopware Custom Fields - Plugin vs. App

You can do a lot with custom fields in shopware right? Custom fields are pretty easy to use and allow us to do many things. There are actually at least 3 ways to create custom fields:

• Custom Fields via Plugin
• Custom Fields via App
• Custom Fields via the Admin Dashboard

Now let's take a look at the differences. First we need to create a Shopware Plugin. To create a plugin simply run bin/console plugin:create YourPluginName.

We have our skeletal structure and can start to code!

Adding the custom field (Plugin)

First we will add the custom field to your plugin. For more information about custom fields please head over to the offical documentation.

<?php declare(strict_types=1);

namespace NINJA\CustomFieldExample;

use Shopware\Core\Framework\Context;
use Shopware\Core\Framework\DataAbstractionLayer\Search\Criteria;
use Shopware\Core\Framework\DataAbstractionLayer\Search\Filter\EqualsFilter;
use Shopware\Core\Framework\Plugin;
use Shopware\Core\Framework\Plugin\Context\InstallContext;
use Shopware\Core\Framework\Plugin\Context\UninstallContext;
use Shopware\Core\System\CustomField\CustomFieldTypes;

class CustomFieldExample extends Plugin
{
    public function install(InstallContext $installContext): void
    {
        parent::install($installContext);
        $customFieldSetRepository = $this->container->get('custom_field_set.repository');
        $check=$customFieldSetRepository->search( (new Criteria())->addFilter(new EqualsFilter('name', 'custom_field_example')),$installContext->getContext());
        if($check->getTotal()==0) {
            $customFieldSetRepository->create([
                [
                    'name' => 'cusom_field_example',
                    'config' => [
                        'label' => [
                            'de-DE' => 'Custom Field Tab Label',
                            'en-GB' => 'Custom Field Tab Label'
                        ]
                    ],
                    'relations' => [[
                        'entityName' => 'product'
                    ]],
                    'customFields' => [
                        [
                            'name' => 'custom_field_example',
                            'type' => CustomFieldTypes::BOOL,
                            'config' => [
                                'label' => [
                                    'de-DE' => 'Deutsches Custom Field Label',
                                    'en-GB' => 'English Custom Field Label'
                                ]

                            ]
                        ]
                    ]
                ]
            ], $installContext->getContext());
        }
    }
}

We add a boolean custom field on install. Let's add a small config to also do something with the custom field in the frontend.

<?xml version="1.0" encoding="UTF-8"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="https://raw.githubusercontent.com/shopware/platform/master/src/Core/System/SystemConfig/Schema/config.xsd">
    <card>
        <title>Configuration</title>
        <title lang="de-DE">Konfiguration</title>

        <input-field type="colorpicker">
            <name>textColor</name>
            <label>Text Color</label>
            <label lang="de-DE">Textfarbe</label>
        </input-field>

        <input-field type="text">
            <name>headline</name>
            <label>Headline Text</label>
            <label lang="de-DE">Überschrifts-Text (fett)</label>
            <placeholder>This is a headline</placeholder>
            <placeholder lang="de-DE">Das ist eine Überschrift</placeholder>
        </input-field>
    </card>
</config>

Since we added the custom field to products let's display the text from the plugin configuration on the product detail page. I extend Storefront/storefront/page/product-detail/buy-widget.html.twig for this.

{% sw_extends '@Storefront/storefront/page/product-detail/buy-widget.html.twig' %}
{% block page_product_detail_ordernumber_container %}
    {{ parent() }}
    {% if (page.product.customFields["custom_field_example"])  %}

        {% set headline = config('CustomFieldExample.config.headline') %}
        {% set textColor = config('CustomFieldExample.config.textColor') %}

        <div>
            <div style="color: {{ textColor }}">
                <p>
                    <b>{{ headline }}</b>
                </p>
            </div>
        </div>
    {% endif %}
{% endblock %}

If we go to a product and activate the custom field we can display the text from our plugin configuration. In the frontend will be a small text in the buy box:

That's easy and cool in the plugin. For the whole code please head over to github. Now let's see if it's easier in the Shopware App-System

Adding Custom Fields in the Shopware App-System

Our entry point for a Shopware-App is the manifest.xml and that's actually all we need to add a custom field. It simply looks like this:

<?xml version="1.0" encoding="UTF-8"?>
<manifest xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="https://raw.githubusercontent.com/shopware/platform/trunk/src/Core/Framework/App/Manifest/Schema/manifest-1.0.xsd">
    <meta>
        <name>NINJACustomFieldExample</name>
        <label>Custom Field Example</label>
        <label lang="de-DE">Custom Field Example</label>
        <author>Joschi Mehta</author>
        <copyright>(c) by Ninja Army</copyright>
        <version>1.0.0</version>
        <license>MIT</license>
    </meta>
    <custom-fields>
        <custom-field-set>
            <name>ninja_example_set</name>
            <label>Tab Label</label>
            <label lang="de-DE">Tab Label</label>
            <related-entities>
                <product />
            </related-entities>
            <fields>
                <bool name="ninja_custom_field_example">
                    <position>1</position>
                    <label>Custom field</label>
                </bool>
            </fields>
        </custom-field-set>
    </custom-fields>
</manifest>

Basically we created the same custom field just in the app system. What's great about it? It's like 10 times faster and also easier in my opinion. You bascially see the whole code you need for the app. If you want to clone it take a look at github again.

The frontend part here would be the same so we don't take a look at it. The best thing in my opinion is that you don't have to handle the custom field on an uninstall. But there are also some disadvantages in my opinion. Let's recap

Shopware Plugin vs. Shopware App (Custom Fields)

Plugin

• Adds the field in the admin dashboard
• Field can be edited in the admin dashboard
• More possibilities
• Add Field on install
• Remove Field on uninstall
• Takes more time

App

• Very easy to use
• Only needs the manifest.xml
• Very fast to implement
• Field is only being added to the related entities
• Field can not be edited from the admin dashboard
• Small limitations

Recap

I would always chose the app system for custom fields. As long as you can do what you need in the app syste with the custom field you should be a lot faster. Also it's a lot easier to implement and it should be easier to maintain. In some reasons it also make sense to chose the plugin system for sure. So it really depends on what you want to do.

A few months ago I did a lot with Plugins. Creating CMS-Element for example was only possible with the plugin system. However you already could create CMS-Blocks with the app-system. But only blocks is not enough? So here you can see a small limitation already right?

Well the limitation is actually gone. Since Shopware6.4.17.0 you are able to create CMS-Elements in the app-system as well. So what is something you can't do with the app-system now?