Add new settings to Options Panel

22/03/2020

To add your element settings to Element Options Panel, you need to use the filter to create your options class that extends to the Fusion_Element class, which will be available in the filter. So, you can add the filter like this:

Copy to Clipboard

This will require you to add another file in the options folder named sample-options.php. In which, you need to check for the class Fusion_Element and create your new class for options and inherit it to the Fusion_Element class.

Once you are done with the class creation, just add a new function add_options() to the class, which will be used to add your options to the Options Panel by the Fusion_Element class automatically, like below –

The example is a complete class that will add the Sample Element settings to the options panel.

Copy to Clipboard

You can use the Sample Addon we created for better understanding of the implementation of options.

Option Correlations

After adding your setting to the options panel, you can also take advantage of the option correlations. This means when you edit the element in the builder, the current default value is displayed along with a link to that setting in the options panel. To do this, you can use a filter from your element class.

For example, the construct function would become:

Copy to Clipboard

and then a new function added below that:

Copy to Clipboard

The format for each is like so:

Copy to Clipboard
  • param_name = param_name of option in element.

  • shortcode = shortcode name as defined in your element class.
  • option_id = ID of the setting being added to the options panel.

There are also optional attributes which can be set in addition to theme-option:

  • subset – If the setting being added to the options panel contains multiple values, for example dimension values.
  • type = The type of setting being added. This changes the format of the description text.
  • reset = Adds the ability to reset the value in element. This is used for color and range types.

For a better understanding of the available options, please check the get_default_description function within class-fusion-settings.php