WordPress.org

Make WordPress Core

Ticket #51086: wp-admin-tabbed-settings-pages-demo.php

File wp-admin-tabbed-settings-pages-demo.php, 3.8 KB (added by stevegrunwell, 11 months ago)

A demo plugin that registers both a tabbed and non-tabbed settings page for testing/comparision

Line 
1<?php
2/**
3 * Plugin Name: WP-Admin Tabbed Settings Pages (DEMO)
4 * Description: A sample implementation of tabbed settings pages within WP-Admin.
5 * Author:      Steve Grunwell
6 * Author URI:  https://stevegrunwell.com
7 */
8
9namespace SteveGrunwell\WPAdminTabs\Demo;
10
11/**
12 * Register the individual settings sections.
13 */
14add_action( 'admin_init', function () {
15        // Register the setting.
16        register_setting(
17                'wp-admin-tabs',
18                'wp-admin-tabs-demo-option'
19        );
20
21        // Register multiple sections.
22        for ( $i = 1; $i <= 5; $i++ ) {
23                add_settings_section(
24                        "wp-admin-tabs-demo-section$i",
25                        "Section $i",
26                        __NAMESPACE__ . '\render_section_heading',
27                        'wp-admin-tabs-demo'
28                );
29                add_settings_field(
30                        "section$i-input",
31                        "Section $i Title",
32                        __NAMESPACE__ . '\render_input',
33                        'wp-admin-tabs-demo',
34                        "wp-admin-tabs-demo-section$i",
35                        [
36                                'label_for' => "section$i-input",
37                        ]
38                );
39                add_settings_field(
40                        "section$i-textarea",
41                        "Section $i Description",
42                        __NAMESPACE__ . '\render_textarea',
43                        'wp-admin-tabs-demo',
44                        "wp-admin-tabs-demo-section$i",
45                        [
46                                'label_for' => "section$i-textarea",
47                        ]
48                );
49        }
50} );
51
52/**
53 * Register the settings pages — one tabbed, one not.
54 */
55add_action( 'admin_menu', function () {
56        add_options_page(
57                __( 'Settings Page Demo (Classic)' ),
58                __( 'Non-tabbed Demo' ),
59                'manage_options',
60                'wp-admin-tabs-demo-classic',
61                __NAMESPACE__ . '\render_classic_settings_page'
62        );
63        add_options_page(
64                __( 'Settings Page Demo (Tabbed)' ),
65                __( 'Tabbed Demo' ),
66                'manage_options',
67                'wp-admin-tabs-demo-tabbed',
68                __NAMESPACE__ . '\render_tabbed_settings_page'
69        );
70} );
71
72/**
73 * Render the heading at the top of each section.
74 *
75 * @param mixed[] $args
76 */
77function render_section_heading( $args = [] ) {
78        echo '<p>This is ' . esc_html( strtolower( $args['title'] ) ) . '.</p>';
79}
80
81/**
82 * Render a generic input.
83 *
84 * @param mixed[] $args Additional arguments passed to the input.
85 */
86function render_input( $args = [] ) {
87        $id = ! empty( $args['label_for'] ) ? $args['label_for'] : false;
88
89        if ( ! $id ) {
90                esc_html_e( 'Invalid ID provided.' );
91                return;
92        }
93
94        $option = get_option( 'wp-admin-tabs-demo-option', [] );
95
96        printf(
97                '<input name="wp-admin-tabs-demo-option[%1$s]" id="%1$s" type="text" class="regular-text" value="%2$s" />',
98                esc_attr( $id ),
99                esc_attr( ! empty( $option[ $id ] ) ? $option[ $id ] : '' )
100        );
101}
102
103/**
104 * Render a generic textarea.
105 *
106 * @param mixed[] $args Additional arguments passed to the textarea.
107 */
108function render_textarea( $args = [] ) {
109        $id = ! empty( $args['label_for'] ) ? $args['label_for'] : false;
110
111        if ( ! $id ) {
112                esc_html_e( 'Invalid ID provided.' );
113                return;
114        }
115
116        $option = get_option( 'wp-admin-tabs-demo-option', [] );
117
118        printf(
119                '<textarea name="wp-admin-tabs-demo-option[%1$s]" id="%1$s" class="regular-text">%2$s</textarea>',
120                esc_attr( $id ),
121                esc_attr( ! empty( $option[ $id ] ) ? $option[ $id ] : '' )
122        );
123}
124
125/**
126 * Render the "classic" settings page.
127 */
128function render_classic_settings_page() {
129?>
130        <div class="wrap">
131                <h1><?php esc_html_e( 'Settings Page Demo (Classic)' ); ?></h1>
132                <form method="POST" action="<?php echo esc_attr( admin_url( 'options.php' ) ); ?>">
133                        <?php do_settings_sections( 'wp-admin-tabs-demo' ); ?>
134                        <?php settings_fields( 'wp-admin-tabs' ); ?>
135                        <?php submit_button(); ?>
136                </form>
137        </div>
138<?php
139}
140
141/**
142 * Render the tabbed version of the settings page.
143 *
144 * This uses the do_tabbed_settings_sections() function to create a tabbed settings page.
145 */
146function render_tabbed_settings_page() {
147?>
148        <div class="wrap">
149                <h1><?php esc_html_e( 'Settings Page Demo (Tabbed)' ); ?></h1>
150                <form method="POST" action="<?php echo esc_attr( admin_url( 'options.php' ) ); ?>">
151                        <?php do_tabbed_settings_sections( 'wp-admin-tabs-demo' ); ?>
152                        <?php settings_fields( 'wp-admin-tabs' ); ?>
153                        <?php submit_button(); ?>
154                </form>
155        </div>
156<?php
157}