Design Settings (extension)

Extensions use the same principles as themes, you can use the "Design Settings" the same way.

Design Settings

Where to find them in the BO?

We use the same place for extensions and themes design settings: Website > Design > Color groups (or other tab)

See using theme extensions to see how to filter only them.

Map Design Settings Binding between the extension and the theme

  • Your theme already has design settings (for example primary color, the font, etc..)

  • Your extension also has design settings

You can bind your extensions variables to existing variables from themes

This is a backoffice configuration

At platform level, Galaxy > Theme > your extension, tab "Design"

This lists all the design settings defined in the extension.

For each design setting from the extension, you can add "bindings" to design settings from themes, to take by default the value of the design setting from the theme. For example saying that a variable ibe_cards_background_color should use the color from a theme

User can disable the toggle to "unbind the variables at website level". This way, the user can put a specific color instead of using the binding defined

Binding Design Settings - Step by step

1 - Define with design team what should be the design mapping

2 - On the platform, go to the list of themes & extensions, and select your extension

3 - Go to the tab "Design"

it displays the list of all design variables inside your extension

4 - Choose the variable you want to bind to another variable from a theme

5 - After clicking on it, go to the tab "Binding"

It list all the binding between this variable and design settings from other themes

6 - Click on ADD and select the theme design setting.

The dropdown shows all design settings of the same type.

The binding can only exist between variables of the same type (you can not link a color variable from your extension to a font variable from a theme)

Contact us before using it, as this is beta feature

Last updated