Extend configuration

Individual setting options in the child theme

In the previous post, I explained how to create a child theme. You can add another field to the theme.json file supplied:

You can find the possible configuration fields in the official Shopware developer documentation.

Tip: Just look in the main theme, where you can use existing fields as a guide.

Example of an additional color field

In the following example, I add a color field to the configuration, which you can then use from your administration. The color field is also compiled as CSS as an example in one of the following steps:

Individual SCSS

Your theme.json should include this code with an additional color field:

https://github.com/rhwebdesign/RHWebChildThemeTemplate/blob/master/src/Examples/_exampleColorField.json

{
  "configInheritance": [
    "@ParentThemeNamespace"
  ],
  "config": {
    "rhweb-custom-color-field": {
      "label": {
        "en-GB": "Individial Color Field",
        "de-DE": "Individuelles Farbfeld"
      },
      "helpText": {
        "en-GB": "",
        "de-DE": ""
      },
      "type": "color",
      "editable": true,
      "scss": true,
      "value": true,
      "tab": "tabName",
      "block": "blockName",
      "section": "sectionName",
      "order": 100
    }
  }
}

You can now use the SCSS variable $rhweb-custom-color-field in your code.

You can find more information on theme configuration in the official Shopware documentation.