WordPress Plugin: custom edit page in admin area?

Question

I've made my own plugin that allows users to subscribe by email. I created mysql table and when users subscribes on frontend email is written to my table.

Now I need some backend features. I have table with all users data (names, emails, etc). But now I need to delete and edit specific rows.

How can I make custom edit page in wordpress admin area? On my own URL? Something like: /wp-admin/admin.php?page=subscribe-plugin&do=edit&id=10 ? And how to show html form there? And how make post query then? To make database changes?

I read all manual and "codex", but no clue how to do it.

There are plenty tutorials out there on creating custom admin page(s) for a WordPress plugin. Have you tried any of those yet? If so, did you get stuck somewhere? Share your code and we'll help you out. — cabrerahector
@cabrerahector yes, I tried, sure. All I got: I can make menu item and page for it. But I need really custom page with my html form and it's handler. — a.anon
@brasofilo Sorry, but it's not what I want. It's too hard to make it with Custom Posts. I just need some tool to make my own html forms in wordpress and handle it. I found out how to make page without menu item. And made html form on it (editing my own item). Okay, that's nice. But how to handle this form's post query?.. — a.anon

Mo'men Mohamed Mo'men Mohamed · Accepted Answer · 2018-11-07T22:16:22

The first step is to create a top level admin page with the add_menu_page() function.

add_action( 'admin_menu', 'my_admin_menu' );

function my_admin_menu() {
    add_menu_page( 'My Top Level Menu Example', 'Top Level Menu', 'manage_options', 'subscribe-plugin/subscribe-plugin-admin-page.php', 'subscribe-plugin_admin_page', 'dashboard-tickets', 6  );
}

The function takes seven arguments.

$page_title (string) (Required) The text to be displayed in the title tags of the page when the menu is selected.

$menu_title (string) (Required) The text to be used for the menu.

$capability (string) (Required) The capability required for this menu to be displayed to the user.

$menu_slug (string) (Required) The slug name to refer to this menu by. Should be unique for this menu page and only include lowercase alphanumeric, dashes, and underscores characters to be compatible with sanitize_key().

$function (callable) (Optional) The function to be called to output the content for this page. Default value: ''

$icon_url (string) (Optional) The URL to the icon to be used for this menu. * Pass a base64-encoded SVG using a data URI, which will be colored to match the color scheme. This should begin with 'data:image/svg+xml;base64,'. * Pass the name of a Dashicons helper class to use a font icon, e.g. 'dashicons-chart-pie'. * Pass 'none' to leave div.wp-menu-image empty so an icon can be added via CSS. Default value: ''

$position (int) (Optional) The position in the menu order this one should appear. Default value: null

The next step is to create page content. All you need to do is create the function defined in argument five and echo your form.

function subscribe-plugin_admin_page(){
    ?>
    <div class="wrap">
        <h2>Welcome To My Plugin</h2>
        //Your form here
    </div>
    <?php
}

Example admin page URL with extra query args:

$query_args = array( 'page' => 'your-plugin-page', 'do' => 'edit' );
echo add_query_arg( $query_args, admin_url( 'subscribe-plugin/subscribe-plugin-admin-page.php' ) );

WordPress Plugin: custom edit page in admin area?

1 Answers