WordPress.org

Make WordPress Core

Opened 5 months ago

Last modified 2 weeks ago

#47369 new defect (bug)

Admin pages have two viewport meta tags on mobile

Reported by: BettyJJ Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 3.3
Component: Administration Keywords: needs-patch dev-feedback
Focuses: Cc:
PR Number:

Description

One is add by wp-admin/admin-header.php:

<meta name="viewport" content="width=device-width,initial-scale=1.0">

Another one is added by wp-admin/includes/admin-filters.php and the content is

<meta name="viewport" id="viewport-meta" content="width=device-width, initial-scale=1">

Use Chrome DevTools to emulate any mobile browser and you can see them.

Having two viewport meta tags is not good practice. Besides, there is really no need to use two viewport meta tags here since their contents are virtually identical.

Attachments (1)

47369.diff (2.7 KB) - added by msaggiorato 4 months ago.

Download all attachments as: .zip

Change History (13)

#1 @mukesh27
5 months ago

  • Keywords dev-feedback added
  • Version set to 3.3

Hi @BettyJJ, welcome to WordPress Trac! Thanks for the report.

Also replicated same issue in mobile device.

Second viewport added via wp-admin/includes/admin-filters.php file with add_action( 'admin_head', '_ipad_meta' ); add_action code and it was introduce in WordPress 3.3.0

/**
 * @since 3.3.0
 */
function _ipad_meta() {
	if ( wp_is_mobile() ) {
		?>
		<meta name="viewport" id="viewport-meta" content="width=device-width, initial-scale=1">
		<?php
	}
}

@desrosj can you please review above and add your thought or further guidance.

#2 @SergeyBiryukov
5 months ago

  • Component changed from General to Administration
  • Keywords needs-patch added; dev-feedback removed
  • Milestone changed from Awaiting Review to 5.3

_ipad_meta() introduced in [18926], global <meta name="viewport"> introduced in [26134].

Looks like _ipad_meta() can be deprecated now.

#3 @BettyJJ
5 months ago

I'm glad my report is received so quickly. Thank you.
Between the two, I personally like _ipad_meta()'s add_action approach since it allows users to change or remove it if they need. So, whichever you'd keep, please consider using add_action instead of hardcoding it in admin-header.php.

Version 0, edited 5 months ago by BettyJJ (next)

#4 @ajayghaghretiya1
5 months ago

If _pad_meta() will be deprecated then do we need to remove all the dependency as in [18926]?

Thanks.

#5 @msaggiorato
4 months ago

I'm working on it

@msaggiorato
4 months ago

#6 @msaggiorato
4 months ago

Ok here's what i did:

  • Removed the viewport call from wp-admin/admin-header.php
  • Added a new function called wp_admin_viewport_meta() (similar to what's already used for wp_login)
  • Added a new hook customize_controls_head to use the same function in wp-admin/customize.php, and to be in line with admin_head and login_head.
  • Added a filter to the new function I added, to accomodate the different meta printed in the customizer.

Hopefully this works, let me know your thoughts.

#7 @msaggiorato
4 months ago

  • Keywords has-patch added; needs-patch removed

This ticket was mentioned in Slack in #core by pento. View the logs.


7 weeks ago

#9 @talldanwp
7 weeks ago

  • Keywords needs-patch added; has-patch removed

Hi @msaggiorato, thanks for working on this. The ticket was discussed in the core triage session (slack logs available in the link above).

The patch worked well in testing. There were a few separate improvements to the code that were recommended which I'll summarise:

  • Small improvements to the if statement in wp_admin_viewport_meta, it was recommended that this is flipped to if ( empty( $viewport_meta ) ) and an early return used, so that there's less indentation.
  • The id on the viewport tag (originally added in [18926]) doesn't seem to be in use any more and it looks like it can be removed.
  • Documentation needs to be added for the for the wp_admin_viewport_meta() and _customizer_mobile_viewport_meta() functions, as well as the admin_viewport_meta filter.

Thanks!

#10 @davidbaumwald
3 weeks ago

  • Keywords dev-feedback added

This ticket was mentioned in Slack in #core by david.baumwald. View the logs.


2 weeks ago

#12 @davidbaumwald
2 weeks ago

  • Milestone changed from 5.3 to Future Release

This ticket still needs a patch based on the most recent feedback. Moving to Future Release. If someone can take quick ownership and see this through, eel free to move it back up.

Last edited 2 weeks ago by davidbaumwald (previous) (diff)
Note: See TracTickets for help on using tickets.