What's the purpose of admin canonical tag?

Question

I have searched through Google and WordPress developer resources, but nothing came up.

I understand the purpose of rel="canonical" tag in a website's frontend (it's part of the website SEO), but I fail to understand its purpose in WordPress Admin area (backend).

Example in a local WordPress installation:

<link id="wp-admin-canonical" rel="canonical" href="http://localhost/wordpress/wp-admin/plugins.php" />

What is their purpose in WordPress Admin area?

Answer 1

What is frontend & what is backend in WordPress?

The PHP CODE, SQL Queries etc. that are executed on your server is the backend & any HTML/CSS/JavaScript CODE that comes to the browser as a result, is the frontend.

So even though, some parts of your site's "frontend" may be restricted by a password protected barrier, it's still considered as frontend. It's more accurate if you call it WordPress Admin Panel, instead of calling it the backend.

Why would WordPress Admin Panel pages need rel="canonical"?

Unless for a very very rare use case where you may make the admin pages public, there can be no SEO benefits from it. However, rel="canonical" can still be used (even for the admin panel pages): As part of the standard practice.

For a web page, rel="canonical" means:

The web page URL that is recognized as the go to URL for a collection of different pages having very similar or the same content.

Since this is the standard practice, even if you don't get any SEO benefit from it, it's still the right thing to do.

Where does it come from:

WordPress added wp_admin_canonical_url() function in WordPress 4.2. rel="canonical" part was there from the beginning & WordPress developers found no reason to remove it since then.

The original change came from the support ticket titled: Remove message parameters from admin URl's in the browser address bar. And if you go through the discussion, you'll see that the rel=canonical part was added as part of standard practice, nothing more.

Check the comment from the original developer:

3. rel=canonical is a standard practice, and I think this is a good use of it.

Why WordPress needs the <link id="wp-admin-canonical" /> tag?

As evident from the above discussion, rel=canonical part of the <link> tag is only there for standard practice, however, the <link> tag:

<link id="wp-admin-canonical" rel="canonical" href="__URL__" />

itself is functional. It was added to keep the URL & browser history clean from single-use query variable names.

For example, if you activate a Plugin, at the top of your admin panel, it gives you a message like:

Plugin activated.

After that, say you close the browser & open it back again later (or simply refresh the page). At that point, prior to WordPress 4.2 (if the browser is set to open the last opened tab), the page would still say:

Plugin activated

even though nothing really happened this time. Same applies when you use browser back button (because the message is shown in response to the single-use URL parameters from browser history as well).

This happens because WordPress redirects you to a URL like:

http://example.com/wp-admin/plugins.php?activate=true&plugin_status=all&paged=1&s=

after you activate a plugin. Notice the activate=true query string in the URL. This has no purpose other than showing you that "Plugin activated" message. So it has no use in the URL or browser history after the "Plugin activated" message is delivered to you.

That's why, in WordPress 4.2 wp_admin_canonical_url() function was introduced, where <link id="wp-admin-canonical" /> tag keeps the reference to the canonical version of the URL without the single-use query variable part & then the JavaScript CODE from the function replaces it from the browser's history entry.

As of writing this, there are 23 such single-use query variables that can be removed from the canonical URL from wp_removable_query_args() function:

'activate', 'activated', 'approved', 'deactivate', 'deleted',
'disabled', 'enabled', 'error', 'hotkeys_highlight_first', 
'hotkeys_highlight_last', 'locked', 'message', 'same', 'saved',
'settings-updated', 'skipped', 'spammed', 'trashed', 'unspammed', 
'untrashed', 'update', 'updated', 'wp-post-new-reload'

However, it can be extended from Plugins or Themes using the removable_query_args filter hook.

Answer 2

Wordpress use this in the admin to remove some query args from the url.

Its generated by the function wp_admin_canonical_url()

function wp_admin_canonical_url() {
    $removable_query_args = wp_removable_query_args();

    if ( empty( $removable_query_args ) ) {
        return;
    }

    // Ensure we're using an absolute URL.
    $current_url  = set_url_scheme( 'http://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] );
    $filtered_url = remove_query_arg( $removable_query_args, $current_url );
    ?>
    <link id="wp-admin-canonical" rel="canonical" href="<?php echo esc_url( $filtered_url ); ?>" />
    <script>
        if ( window.history.replaceState ) {
            window.history.replaceState( null, null, document.getElementById( 'wp-admin-canonical' ).href + window.location.hash );
        }
    </script>
<?php
}

The wp_removable_query_args() return an array with the query args that we want to remove the default ones for example.

$removable_query_args = array(
    'activate',
    'activated',
    'approved',
    'deactivate',
    'deleted',
    'disabled',
    'enabled',
    'error',
    'hotkeys_highlight_first',
    'hotkeys_highlight_last',
    'locked',
    'message',
    'same',
    'saved',
    'settings-updated',
    'skipped',
    'spammed',
    'trashed',
    'unspammed',
    'untrashed',
    'update',
    'updated',
    'wp-post-new-reload',
);

So now for example if we edit some post the url is http://example.com/wp-admin/post.php?post=32&action=edit

When we save the post we change the url to /wp-admin/post.php?post=32&action=edit&message=1 but with JS we change the url that stored in our browser history with window.history.replaceState and remove the message query arg.

And then if we change the url and click back we will back to our stored url instead of the url with the message.

And we won't see the message: Post updated. View post again.

It can be tested with creating new post you can see the message and then go to homepage and click back. and see that you won't see the message because our browser history url changed to be without the message query arg.

So why use the rel="canonical"?

From what I see wordpress core doesn't have a real purpose except semantics to use this tag. This tag are meant to tell us that the some url is duplicate to other url.

But as other crawlers used this tag as an option to check for duplications we can build our own crawler to our admin area for some purpose and we can use this tag.

Answer 3

There is no valid reason to have one in the backend (aka admin). The only one is that the function rel_canonical in wp-includes/link-template.php added from the action in default-filters.php file is always activated - regardless if it is front or backend.

And as the behaviour does not seem to be a problem to the community, it is left unchanged : the developer working on Wordpress would spend their time better improving something important than something that wouldn't add any value to Wordpress.