Settings page for the plugin on WordPress. OOP code example

In the main file of your plugin yourpluginname.php add code below:

<?php
/*
Plugin Name: My Plugin
Plugin URI: https://mypluginsite.com/
Description: One of best plugins in the planet
Version: 1.0
Author: John 
Author URI: https://facebook.com/john
Licence: GPLv2 or later
Text Domain: myplugin
Domain Path: /lang
*/
 

if(!defined('ABSPATH')){
    die;
}


class MyClass{

    function register(){

        add_action('admin_menu',[$this,'add_menu_item']); //Add our menu item

        add_filter('plugin_action_links_'.plugin_basename(__FILE__),[$this,'add_plugin_setting_link']); //Connect our link to the plugin settings 
    
        add_action('admin_init',[$this, 'settings_init']); //register our settings
   
    }

    // Create an item in the admin panel of the site
    public function add_menu_item(){ 
        add_menu_page(
            esc_html__('My plugin Settings Page','myplugin'),//title of the page 
            esc_html__('Title','myplugin'),//link title
            'manage_options', //access rights to this page
            'myplugin_settings',//page id
            [$this,'main_admin_page'],//function that will display the content of the page 
            'dashicons-admin-plugins',//menu icon
            100,//priority in menu
        );
    }

    public function main_admin_page(){ 
        require_once plugin_dir_url( __FILE__ ) .'admin/welcome.php';
    }

    public function add_plugin_setting_link($link){ // add a link to the settings page of our plugin (will be displayed on the plugin page)

        $mypluginsettings_link = '<a href="admin.php?page=myplugin_settings">'.esc_html__('Settings Page','myplugin').'</a>';
         array_push($link,$mypluginsettings_link);
 
          return $link;
      }

      public function settings_init(){ //register our settings

        register_setting('myplugin_settings','myplugin_settings_options');//myplugin_settings_options - settings id in database

        add_settings_section(
            'myplugin_settings_section',//section id
         esc_html__('Settings','myplugin'),//name
          [$this,'myplugin_settings_section_html'],//callback function
          'myplugin_settings'//page id
        );

        add_settings_field(
            'filter_title', //field id
         esc_html__('Title for Filter','myplugin'),//name
          [$this,'filter_title_html'],//callback function
          'myplugin_settings',//page id
          'myplugin_settings_section'//settings id
        );
        add_settings_field('page_title',
         esc_html__('Title for Page','myplugin'),
          [$this,'page_title_html'],
          'myplugin_settings',
          'mypluign_settings_section'
        );
    }

    public function myplugin_settings_section_html(){
        esc_html_e('Settings Plugin');
    }


    public function filter_title_html(){//HTML field name 
        $options = get_option('myplugin_settings_options');
        ?>
        <input type="text" name="myplugin_settings_options[filter_title]" value="<?php echo isset($options['filter_title']) ? $options['filter_title'] : "";  ?>" />
        <?php
    }

     public function page_title_html(){

        $options = get_option('myplugin_settings_options');

        ?>
        <input type="text" name="myplugin_settings_options[page_title]" value="<?php echo isset($options['page_title']) ? $options['page_title'] : "";  ?>" />
        <?php
    }


if(class_exists('MyClass')){
    $myClass = new MyClass();
    $myClass->register();
}

As you can see in the code. We have taken all the contents of the settings page into a separate file welcome.php . We recommend that you place this file atyourpluginname/admin/welcome.php

Add a code to it:

<h1><?php esc_html_e('This is My plugin','myplugin'); ?></h1>
<div class="content">
    <?php settings_errors(); ?>
    <form method="post" action="options.php">
        <?php
            settings_fields('myplugin_settings'); //https://developer.wordpress.org/reference/functions/settings_fields/
            do_settings_sections('myplugin_settings');//https://developer.wordpress.org/reference/functions/do_settings_sections/
            submit_button();
        ?>
    </form>
</div>

Use to display our settings in the template:

<?php 

$options = get_option('myplugin_settings_options');
if(isset($options['filter_title'])) {
    echo $options['filter_title'];
}

?>