Section Field

A visual divider for grouping related fields inside an options panel section.

Overview

The Section field renders a horizontal divider with an optional heading and description — no input, no saved value. It is purely for visual organization inside the panel. Use it to divide a long section into named sub-groups, add breathing room between unrelated fields, or label a cluster of related settings without creating a separate navigation section.

For a styled notice block with a color variant, use the Info field instead.

Field Registration

[
    'id'    => 'colors_divider',
    'type'  => 'section',
    'title' => __( 'Brand Colors', 'your-textdomain' ),
    'desc'  => __( 'Core colors used throughout the theme.', 'your-textdomain' ),
]

Field Options

Option	Type	Required	Description
id	string	✅	Unique field identifier — not stored, but required for internal rendering
type	string	✅	Must be section
title	string	—	Heading text displayed beside the divider line
desc	string	—	Optional subtext shown below the heading
required	array	—	Conditional logic rules — see Conditional Logic
content	string	—	Alias for desc — use either, not both

Return Value

None. The Section field stores no value and never appears in the output of themeplus_get_option().

Usage Examples

Simple divider with a title

[
    'id'    => 'heading_colors_divider',
    'type'  => 'section',
    'title' => __( 'Heading Colors', 'your-textdomain' ),
],
[
    'id'      => 'h1_color',
    'type'    => 'color',
    'title'   => __( 'H1 Color', 'your-textdomain' ),
    'default' => '#0a0a0a',
],
[
    'id'      => 'h2_color',
    'type'    => 'color',
    'title'   => __( 'H2 Color', 'your-textdomain' ),
    'default' => '#1a1a1a',
],

Divider with title and description

[
    'id'    => 'footer_widgets_divider',
    'type'  => 'section',
    'title' => __( 'Footer Widget Areas', 'your-textdomain' ),
    'desc'  => __( 'Configure the widget columns displayed in the footer above the copyright bar.', 'your-textdomain' ),
],

Organising a long section into named sub-groups

themeplus_add_section([
    'id'     => 'header',
    'title'  => __( 'Header', 'your-textdomain' ),
    'icon'   => 'rectangle-ad',   // FontAwesome name only
    'fields' => [

        [
            'id'    => 'general_divider',
            'type'  => 'section',
            'title' => __( 'General', 'your-textdomain' ),
        ],
        [
            'id'      => 'header_layout',
            'type'    => 'button_set',
            'title'   => __( 'Header Layout', 'your-textdomain' ),
            'default' => 'standard',
            'options' => [
                'standard' => __( 'Standard', 'your-textdomain' ),
                'centered' => __( 'Centered', 'your-textdomain' ),
                'minimal'  => __( 'Minimal', 'your-textdomain' ),
            ],
        ],
        [
            'id'      => 'sticky_header',
            'type'    => 'toggle',
            'title'   => __( 'Sticky Header', 'your-textdomain' ),
            'default' => true,
        ],

        [
            'id'    => 'colors_divider',
            'type'  => 'section',
            'title' => __( 'Colors', 'your-textdomain' ),
        ],
        [
            'id'      => 'header_bg_color',
            'type'    => 'color',
            'title'   => __( 'Background Color', 'your-textdomain' ),
            'default' => '#ffffff',
        ],
        [
            'id'      => 'header_text_color',
            'type'    => 'color',
            'title'   => __( 'Text Color', 'your-textdomain' ),
            'default' => '#1e1e1e',
        ],

        [
            'id'    => 'typography_divider',
            'type'  => 'section',
            'title' => __( 'Typography', 'your-textdomain' ),
        ],
        [
            'id'    => 'nav_typography',
            'type'  => 'typography',
            'title' => __( 'Navigation Font', 'your-textdomain' ),
        ],

    ],
]);

Conditional divider — appears only when a feature is enabled

[
    'id'      => 'enable_mega_menu',
    'type'    => 'toggle',
    'title'   => __( 'Enable Mega Menu', 'your-textdomain' ),
    'default' => false,
],
[
    'id'       => 'mega_menu_divider',
    'type'     => 'section',
    'title'    => __( 'Mega Menu Settings', 'your-textdomain' ),
    'required' => ['enable_mega_menu', '==', true],
],
[
    'id'       => 'mega_menu_columns',
    'type'     => 'button_set',
    'title'    => __( 'Columns', 'your-textdomain' ),
    'default'  => '4',
    'options'  => ['2' => '2', '3' => '3', '4' => '4'],
    'required' => ['enable_mega_menu', '==', true],
],

Notes

• The id must be unique within the section even though the field stores no value — it is used internally for rendering and conditional logic targeting.
• Section fields are best used inside long field lists to create visual sub-groups. If a group is large enough to need its own navigation entry, create a proper section with themeplus_add_section() instead.
• For a colored notice block with info, warning, success, or error styling, use the Info field. The Section field is purely a visual divider — no color variants.
• Section fields do not appear in the Developer Panel or in themeplus_get_option() output.