Learn how to create plugin configuration in Shopware 6 using config.xml — covers input fields, cards, select dropdowns, media fields, and advanced component examples.
By Admin
November 18, 2022
3 Min Read
Table of Contents▾
How to create plugin configuration in Shopware?
Plugin configuration enables the admin user to control the plugin’s features and its configurations from Shopware backend. It’s easy to create plugin configurations in Shopware and utilize the stored configuration in the store. Before that, you must know how to create a custom plugin in Shopware.
Create config.xml file inside your plugin directory //custom/plugins/WebbytroopsShopFinder/src/Resources/config/config.xml. We have created a configuration with an input filed
Minimal configurationGerman Minimal configurationtitleTitle1Title is the main primary section to enter
Go to your store configuration page to update the value for the title field. You can find it under Extensions > My Extension > Shop Finder. You will have output similar to shared screenshot below:
If you have output with the above code, you have successfully created configuration for your plugin. It is simple process to create admin interface without any knowledge of backend architecture. Use the tags and put all your fields under the tags. There should be at least one and one to implement the configuration. Shopware does not come only with an input field text, there are several other input fields available. We will see those fields in brief along with the tags used in the config.xml file.
Configuration elements:
<Card>: Cards are simply a wrapper for your field that groups similar configurations in a single place. You can add a number of cards and add a number of fields there. </strong>: The title tag is to show the label for the card. There is another with a lang attribute which is used to show the label in a different language. <br /><strong><input-field></strong>: Input field tag used to create your custom field for the configurations. The important point is it should start with <strong><name></strong> element. After the <strong><name></strong> element you should put other elements such as <strong><label>, <placeholder>,<required>, <helptext>, <defaultValue></strong>, etc.</p>
<p>Shopware has a rich set of input fields here is a list of those input fields:</p>
<ul>
<li>text</li>
<li>textarea</li>
<li>text-editor</li>
<li>url</li>
<li>password</li>
<li>int</li>
<li>float</li>
<li>bool</li>
<li>checkbox</li>
<li>datetime</li>
<li>date</li>
<li>time</li>
<li>colorpicker</li>
<li>single-select</li>
<li>multi-select</li>
</ul>
<h3>Advanced custom input field</h3>
<p>Shopware does not only limit to general fields for store configuration, you can declare complex configuration with <strong><component anme="componentName"></strong> element. You can render the existing admin components as well as your own component. Here are some supported <a href="https://developer.shopware.com/docs/guides/plugins/plugins/plugin-fundamentals/add-plugin-configuration#advanced-custom-input-fields">advanced components</a> by Showpare:</p>
<ul>
<li>sw-entity-single-select</li>
<li>sw-entity-multi-id-select</li>
<li>sw-media-field</li>
<li>sw-text-editor</li>
<li>sw-snippet-field</li>
</ul>
<h3>Example of store configuration file</h3>
<p>File name: <strong><project-directory>//custom/plugins/WebbytroopsShopFinder/src/Resources/config/config.xml</strong></p>
<pre><code><?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/trunk/src/Core/System/SystemConfig/Schema/config.xsd">
<card>
<title>Minimal configurationGerman Minimal configurationisenable1truetitleHey Default valueTitle1Title is the main primary section to entermailMethodsmtpAdvanced ConfigurationErweiterte EinstellungenapikeyYour secret token for xyz...Dein geheimer Token für xyz...exampleProductproductexampleMultiProductIdsproductpluginMediatextEditorsnippetFieldmyPlugin.test.snippet
