Or, embed this snippet using GenerateWP WordPress Plugin.

Download

Clone

CopperAI Settings Page

class SettingsManager {

	public function __construct() {

		add_action( 'admin_menu', array( $this, 'add_admin_menu' ) );
		add_action( 'admin_init', array( $this, 'init_settings'  ) );

	}

	public function add_admin_menu() {

		add_options_page(
			esc_html__( 'CopperAI Settings', 'copperai' ),
			esc_html__( 'CopperAI Settings', 'copperai' ),
			'manage_options',
			'copperai-settings',
			array( $this, 'render' )
		);

	}

	public function init_settings() {

		register_setting(
			'copperai_settings_group',
			'copperai_settings'
		);

		add_settings_section(
			'copperai_settings_section',
			'',
			false,
			'copperai_settings'
		);

		add_settings_field(
			'openai_api_key',
			__( 'OpenAI API Key', 'copperai' ),
			array( $this, 'render_openai_api_key_field' ),
			'copperai_settings',
			'copperai_settings_section'
		);
		add_settings_field(
			'number',
			__( 'Number', 'copperai' ),
			array( $this, 'render_number_field' ),
			'copperai_settings',
			'copperai_settings_section'
		);
		add_settings_field(
			'tf',
			__( 'True False', 'copperai' ),
			array( $this, 'render_tf_field' ),
			'copperai_settings',
			'copperai_settings_section'
		);
		add_settings_field(
			'checkboxes',
			__( 'Checkboxes', 'copperai' ),
			array( $this, 'render_checkboxes_field' ),
			'copperai_settings',
			'copperai_settings_section'
		);
		add_settings_field(
			'color',
			__( 'color', 'copperai' ),
			array( $this, 'render_color_field' ),
			'copperai_settings',
			'copperai_settings_section'
		);

	}

	public function render() {

		// Check required user capability
		if ( !current_user_can( 'manage_options' ) )  {
			wp_die( esc_html__( 'You do not have sufficient permissions to access this page.', 'copperai' ) );
		}

		// Admin Page Layout
		echo '<div class="wrap">' . "n";
		echo '	<h1>' . get_admin_page_title() . '</h1>' . "n";
		echo '	<form action="options.php" method="post">' . "n";

		settings_fields( 'copperai_settings_group' );
		do_settings_sections( 'copperai_settings' );
		submit_button();

		echo '	</form>' . "n";
		echo '</div>' . "n";

	}

	function render_openai_api_key_field() {

		// Retrieve data from the database.
		$options = get_option( 'copperai_settings' );

		// Set default value.
		$value = isset( $options['openai_api_key'] ) ? $options['openai_api_key'] : '';

		// Field output.
		echo '<input type="text" name="copperai_settings[openai_api_key]" class="regular-text openai_api_key_field" placeholder="' . esc_attr__( 'Some dummy text representing a dummy apikey', 'copperai' ) . '" value="' . esc_attr( $value ) . '">';
		echo '<p class="description">' . __( 'This is a long description to explain how to get your API key', 'copperai' ) . '</p>';

	}

	function render_number_field() {

		// Retrieve data from the database.
		$options = get_option( 'copperai_settings' );

		// Set default value.
		$value = isset( $options['number'] ) ? $options['number'] : '';

		// Field output.
		echo '<input type="number" name="copperai_settings[number]" class="regular-text number_field" placeholder="' . esc_attr__( '', 'copperai' ) . '" value="' . esc_attr( $value ) . '">';

	}

	function render_tf_field() {

		// Retrieve data from the database.
		$options = get_option( 'copperai_settings' );

		// Set default value.
		$value = isset( $options['tf'] ) ? $options['tf'] : '';

		// Field output.
		echo '<input type="checkbox" name="copperai_settings[tf]" class="tf_field" value="checked" ' . checked( $value, 'checked', false ) . '> ' . __( '', 'copperai' );

	}

	function render_checkboxes_field() {

		// Retrieve data from the database.
		$options = get_option( 'copperai_settings' );

		// Set default value.
                $value = isset( $options['checkboxes'] ) ? $options['checkboxes'] : array();

		// Field output.
		echo '<input type="checkbox" name="copperai_settings[checkboxes][]" class="checkboxes_field" value="' . esc_attr( 'value1' ) . '" ' . ( in_array( 'value1', $value )? 'checked="checked"' : '' ) . '> ' . __( 'label1', 'copperai' ) . '<br>';
		echo '<input type="checkbox" name="copperai_settings[checkboxes][]" class="checkboxes_field" value="' . esc_attr( 'value2}label2' ) . '" ' . ( in_array( 'value2}label2', $value )? 'checked="checked"' : '' ) . '> ' . __( '', 'copperai' ) . '<br>';
		echo '<p class="description">' . __( 'some checkbox desc', 'copperai' ) . '</p>';

	}

	function render_color_field() {

		// Retrieve data from the database.
		$options = get_option( 'copperai_settings' );

		// Set default value.
		$value = isset( $options['color'] ) ? $options['color'] : '';

		// Field output.
		echo '<input type="color" name="copperai_settings[color]" class="regular-text color_field" placeholder="' . esc_attr__( '', 'copperai' ) . '" value="' . esc_attr( $value ) . '">';
		echo '<p class="description">' . __( 'some color something', 'copperai' ) . '</p>';

	}

}

new SettingsManager;