Samples Create a WordPress Settings Page - Page-Carbajal/WPExpress GitHub Wiki

I just finished an upgrade to the WPExpress/UI project.

To make my coding experience more enjoyable, I created a class called FieldCollection a dictionary of sorts. This class stores all of my field definitions and renders them on demand.

1. Basic Settings Page
2. Custom Template Path

1. Basic Settings Page

class ThemeOptions extends BaseSettingsPage
{

    public function __construct()
    {
        parent::__construct('Theme Settings', 'manage_options');
        $this->setPageDescription('Built with WPExpress');
        $this->addPageOptions();
    }

    private function addPageOptions()
    {
        // Add a text Field
        $this->fields->addTextInput('my-text')->setAttribute('placeholder', 'Change This!')->setID('my-text-1');
        $this->fields->setValue( $this->getOptionValue('my-text') );
        // Add a Select Field
        $mySelectValue = $this->getOptionValue('simple-list');
        $simpleList   = array( "Item 1", "Item 2", "Item 3" ); // The options for the select field
        $this->fields->addSelect('simple-list', $simpleList)->setValue($mySelectValue);
        // Add a TextArea
        $myBigTextValue = $this->getOptionValue('my-big-text');
        $this->fields->addTextArea('my-big-text')->setValue($myBigTextValue)->setAttributes([ "rows" => '10', 'cols' => 40 ])->addLabel('My Big Text!');
    }
}

What changed

The fields object of course. Adding options to your page is really easy. Just call the methods addTextArea, addTextInput, addHiddenInput, adSelect, addCheckBox or addRadioButton.

Set the attributes for the HTML output like this

$this->fields('my-text')->setAttribute('placeholder', 'Some message!');
// Or a bunch of them at once
$this->fields('my-text')->setAttributes( [ 'readonly' => 'readonly', 'placeholder' => 'Some Message Here!', 'data-post-id' => 12345 ] );

2. Custom Template Path

Being Developed!

Creating a Settings Page is today easier than it was before, so much that it makes me feel like I am cheating.