{"id":2529,"date":"2018-04-18T19:37:54","date_gmt":"2018-04-19T02:37:54","guid":{"rendered":"https:\/\/blocksylaunch.click\/documentation\/?p=2529"},"modified":"2018-04-27T15:53:39","modified_gmt":"2018-04-27T22:53:39","slug":"module-settings-groups","status":"publish","type":"post","link":"https:\/\/blocksylaunch.click\/documentation\/developers\/divi-module\/module-settings-groups\/","title":{"rendered":"Module Settings Groups"},"content":{"rendered":"

Note:<\/strong> This tutorial series is intended for advanced users. At least a basic understanding of coding in PHP and JavaScript is required.<\/p><\/blockquote>\n

When editing modules inside the Divi Builder, their settings appear in collapsable groups . You can assign a setting to a specific group using the toggle_slug<\/code> parameter in the setting definition<\/a>. You can use one of the builder\u2019s predefined settings groups<\/a> or you can use a custom group<\/a>.<\/p>\n

Predefined Settings Groups<\/h2>\n

The following groups are predefined and can be used by simply including one of their slugs as the toggle_slug<\/code> parameter in a setting definition.<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
Display Name<\/strong><\/th>\nSlug<\/strong><\/th>\n<\/tr>\n<\/thead>\n
Admin Label<\/td>\nadmin_label<\/td>\n<\/tr>\n
Alignment<\/td>\nalignment<\/td>\n<\/tr>\n
Animation<\/td>\nanimation<\/td>\n<\/tr>\n
Arrows Color<\/td>\narrows_color<\/td>\n<\/tr>\n
Attributes<\/td>\nattributes<\/td>\n<\/tr>\n
Audio<\/td>\naudio<\/td>\n<\/tr>\n
Background<\/td>\nbackground<\/td>\n<\/tr>\n
Bar Counter<\/td>\nbar<\/td>\n<\/tr>\n
Body Text<\/td>\nbody<\/td>\n<\/tr>\n
Border<\/td>\nborder<\/td>\n<\/tr>\n
Box Shadow<\/td>\nbox_shadow<\/td>\n<\/tr>\n
Bullet<\/td>\nbullet<\/td>\n<\/tr>\n
Button One<\/td>\nbutton_one<\/td>\n<\/tr>\n
Button Two<\/td>\nbutton_two<\/td>\n<\/tr>\n
Button<\/td>\nbutton<\/td>\n<\/tr>\n
CSS ID & Classes<\/td>\nclasses<\/td>\n<\/tr>\n
Caption Text<\/td>\ncaption<\/td>\n<\/tr>\n
Categories<\/td>\ncategories<\/td>\n<\/tr>\n
Circle<\/td>\ncircle<\/td>\n<\/tr>\n
Color<\/td>\ncolor<\/td>\n<\/tr>\n
Conditional Logic<\/td>\nconditional_logic<\/td>\n<\/tr>\n
Content Text<\/td>\ncontent<\/td>\n<\/tr>\n
Controls Colors<\/td>\ncolors<\/td>\n<\/tr>\n
Controls<\/td>\ncontrols<\/td>\n<\/tr>\n
Currency & Frequency Text<\/td>\ncurrency_frequency<\/td>\n<\/tr>\n
Custom CSS<\/td>\ncustom_css<\/td>\n<\/tr>\n
Dividers<\/td>\ndividers<\/td>\n<\/tr>\n
Dropdown Menu<\/td>\ndropdown<\/td>\n<\/tr>\n
Elements<\/td>\nelements<\/td>\n<\/tr>\n
Email Account<\/td>\nprovider<\/td>\n<\/tr>\n
Email<\/td>\nemail<\/td>\n<\/tr>\n
Exceptions<\/td>\nexceptions<\/td>\n<\/tr>\n
Excluded Item<\/td>\nexcluded<\/td>\n<\/tr>\n
Featured Image<\/td>\nfeatured_image<\/td>\n<\/tr>\n
Field Options<\/td>\nfield_options<\/td>\n<\/tr>\n
Field Text<\/td>\nform_field<\/td>\n<\/tr>\n
Fields<\/td>\nfields<\/td>\n<\/tr>\n
Filter Criteria Text<\/td>\nfilter<\/td>\n<\/tr>\n
Filters<\/td>\nfilters<\/td>\n<\/tr>\n
Icon<\/td>\nicon<\/td>\n<\/tr>\n
Image & Icon<\/td>\nicon_settings<\/td>\n<\/tr>\n
Image & Video<\/td>\nimage_video<\/td>\n<\/tr>\n
Images<\/td>\nimages<\/td>\n<\/tr>\n
Image<\/td>\nimage<\/td>\n<\/tr>\n
Input Text<\/td>\ninput<\/td>\n<\/tr>\n
Label Text<\/td>\nlabel<\/td>\n<\/tr>\n
Layout<\/td>\nlayout<\/td>\n<\/tr>\n
Links<\/td>\nlinks<\/td>\n<\/tr>\n
Link<\/td>\nlink<\/td>\n<\/tr>\n
Map<\/td>\nchild_filters<\/td>\n<\/tr>\n
Map<\/td>\nmap<\/td>\n<\/tr>\n
Menu Text<\/td>\nmenu<\/td>\n<\/tr>\n
Meta Text<\/td>\nmeta<\/td>\n<\/tr>\n
Module Text<\/td>\nmodule<\/td>\n<\/tr>\n
Navigation<\/td>\nnavigation<\/td>\n<\/tr>\n
Number Text<\/td>\nnumber<\/td>\n<\/tr>\n
Numbers Text<\/td>\nnumbers<\/td>\n<\/tr>\n
Overlay<\/td>\noverlay<\/td>\n<\/tr>\n
Pagination Text<\/td>\npagination<\/td>\n<\/tr>\n
Percentage Text<\/td>\npercent<\/td>\n<\/tr>\n
Play Icon<\/td>\nplay_icon<\/td>\n<\/tr>\n
Player Pause<\/td>\nplayer_pause<\/td>\n<\/tr>\n
Portfolio Title Text<\/td>\nportfolio_header<\/td>\n<\/tr>\n
Price Text<\/td>\nprice<\/td>\n<\/tr>\n
Redirect<\/td>\nredirect<\/td>\n<\/tr>\n
Result Message Text<\/td>\nresult_message<\/td>\n<\/tr>\n
Rotation<\/td>\nrotation<\/td>\n<\/tr>\n
Sale Badge<\/td>\nbadge<\/td>\n<\/tr>\n
Scroll Down Icon<\/td>\nscroll_down<\/td>\n<\/tr>\n
Search Field<\/td>\nfield<\/td>\n<\/tr>\n
Sizing<\/td>\nwidth<\/td>\n<\/tr>\n
Spacing<\/td>\nmargin_padding<\/td>\n<\/tr>\n
State<\/td>\nstate<\/td>\n<\/tr>\n
Styles<\/td>\nstyles<\/td>\n<\/tr>\n
Subhead Text<\/td>\nsubhead<\/td>\n<\/tr>\n
Subheader Text<\/td>\nsubheader<\/td>\n<\/tr>\n
Success Action<\/td>\nsuccess_action<\/td>\n<\/tr>\n
Tab Text<\/td>\ntab<\/td>\n<\/tr>\n
Text<\/td>\nmain_content<\/td>\n<\/tr>\n
Text<\/td>\ntext<\/td>\n<\/tr>\n
Title Text<\/td>\nheader<\/td>\n<\/tr>\n
Title Text<\/td>\ntitle<\/td>\n<\/tr>\n
Toggle Text<\/td>\ntoggle<\/td>\n<\/tr>\n
Visibility<\/td>\nvisibility<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Custom Settings Groups<\/h2>\n

Settings can be assigned to a custom group in the same way that you would assign them to predefined groups. However, you must also define all custom groups in the get_settings_modal_toggles()<\/code> method of your module\u2019s PHP class.<\/p>\n

Settings Group Definition<\/strong><\/p>\n

    \n
  • tab_slug<\/strong> (array)<\/em>\n
      \n
    • toggles<\/code> <\/strong>(array)<\/em> \u2014 All settings group definitions for the tab\n
        \n
      • toggle_slug<\/strong> (array)<\/em> \u2014 Settings group definition\n
          \n
        • priority<\/strong> (int)<\/em> \u2014 Groups are sorted based on this number (from lowest to highest)<\/li>\n
        • sub_toggles<\/strong> (array)<\/em> \u2014 Sub groups for this group (optional)\n
            \n
          • sub_toggle_slug<\/strong> (array)<\/em> \u2014 Sub group definition\n
              \n
            • icon<\/strong> (string)<\/em> \u2014 The slug of a predefined icon (optional)<\/li>\n
            • icon_svg<\/strong> (string)<\/em> \u2014 Raw SVG icon (optional)<\/li>\n
            • name<\/strong> (string)<\/em> \u2014 Display Name (only shown when no icon is defined)<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n
            • tabbed_subtoggles<\/strong> (bool)<\/em> \u2014 Whether or not to display sub groups as tabs<\/li>\n
            • title<\/strong> (string)<\/em> \u2014 Display name (localized)<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

              Custom Settings Groups Example<\/h3>\n