Customizer Improvements in 4.7

WordPress 4.7 has been the most active release on record for the customize component, with four major feature projects merging and shipping with 4.7 and over 90 tickets closed as fixed. This post summarizes the highlights of the user and developer-facing changes.

4.7 Customizer Feature Projects

Create pages within live preview during site setup

Add new pages while building menus and setting a static front page; outline your site directly in the customizer.

This project began with the ability to create posts and pages direction from the available menu items panel in the customizer, as originally proposed near the end of the 4.6 cycle:

Subsequent changes also added the ability to create new pages when assigning the front page and posts page in the Static Front Page section. Because this is now built into the core dropdown-pages customizer control, themes and plugins can also allow users to create new pages for their options instead of relying on existing content. The homepage sections in Twenty Seventeen include this new allow_addition parameter. Here’s how to register a dropdown-pages control supporting new pages:

$wp_customize->add_control( 'featured_page', array(
	'label'          => __( 'Featured Page', 'mytextdomain' ),
	'section'        => 'theme_options',
	'type'           => 'dropdown-pages',
	'allow_addition' => true, // This allows users to add new pages from this dropdown-pages control.
) );

Additionally, a proposal for term statuses was developed as a first step toward expanding the menus functionality to work for creating and previewing taxonomy terms in a future release (see #37915).

Improvements to the Sliding Panels UI

Customizer navigation is now faster, smoother, and more accessible.

This project tackled a series of tickets focused on improving the usability of the “sliding panels” UI in the customizer controls pane. The first step was to refactor the section and panel markup so that sections and panels are not logically nested. This is the biggest internal change to the UI and has a dedicated post going into the details:

This primary change resolved numerous problems with sections and panels not opening and closing properly, and eliminated situations where navigation to leave a section could become hidden. The next step was making section and panel headers “sticky” so that navigation is easier to access within long sections (such as for a menu); see #34343.

Finally, hover and focus styling for navigation in the customizer has been updated to use the blue-border approach found elsewhere in core, including for the device-preview buttons in the customizer, in #29158. This completes a refresh of the customizer controls pane’s UI design that began in WordPress 4.3 with #31336. The core UI now uses the following consistent UI patterns in the customizer:

  • White background colors are used only to indicate navigation and actionable items (such as inputs)
  • The general #eee background color provides visual contrast against the white elements
  • 1px #ddd borders separate navigational elements from background margins and from each other
  • 15px of spacing is provided between elements where visual separation is desired
  • 4px borders are used on one side of a navigation element to show hover or focus, with a color of #0073aa
  • Customizer text uses color: #555d66, with #0073aa for hover and focus states on navigation elements

Plugins and themes should follow these conventions in any custom customizer UI that they introduce, and inherit core styles wherever possible.

Any custom sections and panels, as well as customizations to the core objects in plugins and themes, should be tested extensively to ensure that they continue functioning as intended with all of these changes in 4.7. It’s particularly important to ensure that things like the use of color match the core conventions so that the user experience is seamless between functionality added by plugins and core.

Customize Changesets (formerly Transactions)

Browse your site and switch themes more seamlessly within the customizer, as your changes automatically persist in the background.

This project rewrote the internals of the customizer preview mechanism to make changes persistent. Each change made to a setting in the customizer is saved to a changeset (a new customize_changeset post type), facilitating future features such as scheduled changes, revisions, or saving and sharing drafted changes. Changesets also open the door to using the customizer to preview Ajax requests, headless sites, and REST API calls for mobile apps. In 4.7, changesets enable switching themes in the customizer without needing to decide between publishing or losing your customizations, as they’re automatically persisted in the background.

For more details on changesets, check out the two dedicated posts:

Custom CSS

Fine-tune your site and take your theme customizations to the next level with custom css in the customizer.

#35395 introduced a user-oriented custom CSS option in the customizer. Now that the base functionality is in place, it will be further enhanced in #38707 in future releases. Read the feature proposal for details on the implementation and why it’s important for core:

There’s also a dedicated post that walks through the process of migrating existing custom CSS options in themes and plugins to the core functionality – be sure to follow those steps if your plugin or theme does custom CSS:

Other Changes with Dedicated Posts

4.7 features several other features deserving special attention. Read the posts for visible edit shortcuts (which expand the functionality of customizer partials), video headers (which extend the custom header feature), and starter content for more information:

Additional User-facing Changes

With over 90 tickets fixed in the customize component in 4.7, we can’t cover everything here. But, here are a few more highlights:

Improved Custom Background Properties UI

#22058 introduces a more comprehensive and more usable custom background properties UI when a custom background is set up. There are now presets to control all of the detailed options at once, and the individual options are presented in a more visual way. Background size and vertical position are also now available as standalone options when using a custom preset.

Theme developers should update their add_theme_support() calls for custom-background to specify the default size, vertical position, and preset to reflect their default background image CSS. Perhaps the most significant improvement here is the ability for users to easily set up fixed full-screen backgrounds – and the ability for themes to make that behavior default if desired.

And even more…

4.7 also:

  • Loads the frontend preview iframe more naturally, eliminating a lot of weirdness with JS running in an unexpected location and ensuring that JS-based routing will work (#30028)
  • Allows the search results page to be previewed, and any forms that use the GET method in general can now be submitted whereas previously they would do nothing when submitted (#20714)
  • Hides edit post links in the customizer by default. Plugins, such as Customize Posts, can restore the links if they make post editing available in the customizer (#38648), although the visible edit shortcuts should generally be used instead.
  • Shows a cursor: not-allowed for mouse users when hovering over external links in the preview, as these can’t be previewed
  • Officially removes support for the customizer in Internet Explorer 8, preventing users of this outdated browser from accessing the customizer at all (#38021)

Additional Developer-oriented Changes

Hue-only Color Picker

#38263 adds a hue-only mode to the Iris color picker, wpColorPicker, and WP_Customize_Color_Control. Built for Twenty Seventeen’s custom colors functionality, the hue-only mode allows users to select a hue and saves the hue degree as a number between 0 and 359. To add a hue-color control:

$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'colorscheme_hue', array(
	'mode' => 'hue',
	'section' => 'colors',
) ) );

As demonstrated in Twenty Seventeen’s custom colors strategy, the hue-selection strategy opens up a whole new world of possibilities for custom color options in themes. Rather than introducing numerous text and background color options and requiring users to adjust them to ensure that adequate color contrast is provided, themes can consolidate their color options into one or more hue pickers. Then, the corresponding use of hsl colors in CSS allows themes to define color patterns where users customize color hues without impacting the lightness of a color option, thereby preserving the designer’s use of proper contrast between text and background colors, and any use of color lightness for visual hierarchy. Check out the implementation in Twenty Seventeen for inspiration (including instant live preview).

Fix Sections that .cannot-expand

When creating custom customizer sections that, for example, display an external link but don’t actually expand to show section contents, the cannot-expand class can be added to the section title container to prevent JS events and CSS hover/focus styles from being applied. Be sure to also remove the tabindex="0" from the container if you copy the core code since your custom section shouldn’t be focusable if it can’t expand (and any contained links or buttons would be keyboard-focusable automatically). See #37980 for details.

Allow Plugins to do Comprehensive Late Validation of Settings

To account for custom subclasses of WP_Customize_Setting that don’t apply the customize_validate_{{$setting_id}} filter, this filter now will be applied when WP_Customize_Manager::validate_setting_values() is called. This ensures that plugins can add custom validation for every setting. For more, see #37638.


Huge thanks to the 61 people (and counting) receiving props for the 120+ customize component commits in 4.7 (as of RC2): @westonruter, @celloexpressions, @afercia, @sirbrillig, @ryankienstra, @helen, @ocean90, @melchoyce, @bradyvercher, @folletto, @johnbillion, @delawski, @karmatosed, @georgestephanis, @dlh, @curdin, @valendesigns, @mattwiebe, @michaelarestad, @joemcgill, @sstoqnov, @lgedeon, @mihai2u, @coreymcollins, @stubgo, @utkarshpatel, @desrosj, @odysseygate, @johnregan3, @aaroncampbell, @mapk, @iseulde, @mrahmadawais, @vishalkakadiya, @sayedwp, @hugobaeta, @jonathanbardo, @jorbin, @tristangemus, @deltafactory, @kkoppenhaver, @seancjones, @Presskopp, @Mista-Flo, @nikeo, @adamsilverstein, @lukecavanagh, @coffee2code, @peterwilsoncc, @presskopp, @pento, @Kelderic, @sebastian.pisula, @mckernanin, @FolioVision, @MikeHansenMe, @welcher, @cdog, @grapplerulrich, @iamfriendly, @flixos90.


#4-7, #customize, #dev-notes

Visible Edit Shortcuts in the Customizer Preview

#27403 added visible edit shortcuts to the customizer preview, making it easier to see which elements of your site are editable in the customizer and how to edit them. Here’s a demo with Twenty Fifteen (note that the ability to toggle icons off has since been removed):

Implementation: Selective Refresh Partials

Visible edit shortcuts are an extension of the existing “shift-click-to-edit” functionality built into customizer partials. Partials are sections of the front end of the site, in the customizer preview, that are associated with customizer settings. When settings change, their associated partials are selectively refreshed via an Ajax call without reloading the entire preview. Partials are to the customizer preview what controls are to the customizer editing pane: a visual representation of a setting.

Buttons are now injected into partials within the preview to expose this relationship visually and to users of all input modes. However, the role of the customizer preview is to provide an accurate representation of the frontend of the site as it’ll appear once changes are published. Accordingly, visible edit shortcuts pose a challenge as they have the potential to significantly hamper the preview-ability of the preview.

To balance between discoverability and providing an accurate preview, the initial core iteration showed a flash of the buttons when the preview first loads, then hid them. To show the shortcuts, or to toggle them on and off, you could click/tap anywhere in the preview (except on a link or button). Keyboard users had a screen-reader-text button (visible on focus) to toggle the shortcuts on and off. This functionality was removed in [39131] and icons are currently persistently visible when customizing but hidden when the controls are collapsed, and supplemental usability testing validated this decision.

Background & Prior Implementations

Shift-click to edit an element in the customizer preview was first implemented with the widget customizer project in WordPress 3.9. Visual approaches to exposing this functionality were explored, but left for a future release. Selective refresh was also first proposed, and put on hold pending development of the concept.

The first core implementation of selective refresh came with menu management in the customizer in WordPress 4.3. Menus include shift-click-to-edit on a per-menu-item bases, further demonstrating the powerful potential of associating portions of the customizer preview with their associated settings and controls. currently supports a similar feature with visible edit icons in the customizer. This approach serves as the inspiration for the final UI being introduced in core, with additional UX adjustments and a complete rewrite of the implementation to make it compatible with as many themes as possible.

Adding Theme Support

Theme support for this feature is all about supporting selective refresh, which was added in WordPress 4.5. In some cases, a small amount of additional CSS will be required to ensure that the shortcuts are positioned properly. Edit shortcuts will be enabled by default for all themes, but are contingent on themes supporting selective refresh.

Selective Refresh for Widgets

See the post from WordPress 4.5 for adding support for selective refresh for widgets. In most cases, add_theme_support( 'customize-selective-refresh-widgets' ) is the only requirement:

Selective Refresh for Menus

Menus support selective refresh out of the box unless: a custom nav menu walker is used, the echo argument is false, or wp_nav_menu isn’t used. In those cases, you’ll need to add support directly. Some themes may still be missing full support for selective refresh of menus, which has been enabled by default since WordPress 4.3.  Reference the post for details, but note that it predates the core implementation of an API for selective refresh:

Selective Refresh for Custom Options

Custom logo (since 4.5) and header video (since 4.7) support selective refresh automatically if you use the core features via add_theme_support. Other core options such as the site title and tagline or header images can support selective refresh if you register partials for them and set their settings’ transport argument to postMessage. Here’s an example from Twenty Fifteen:

$wp_customize->get_setting( 'blogname' )->transport        = 'postMessage';
$wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';

$wp_customize->selective_refresh->add_partial( 'blogname', array(
	'selector' => '.site-title a',
	'render_callback' => 'twentyfifteen_customize_partial_blogname',
) );
$wp_customize->selective_refresh->add_partial( 'blogdescription', array(
	'selector' => '.site-description',
	'render_callback' => 'twentyfifteen_customize_partial_blogdescription',
) );

Where the render callbacks call bloginfo( 'name' ); and bloginfo( 'description' ); For more details on adding support for selective refresh for custom theme options, reference the official customizer documentation.

Support in Default Themes

Twenty Eleven through Sixteen support selective refresh as of WordPress 4.5, and also support edit icons for most of their features as a result. Twenty Fourteen and Sixteen require a few very minor positioning tweaks to ensure that all of the icons are visible. This is typical of what most themes could expect needing to add.

Twenty Seventeen will be a great showcase for this new functionality, as the first theme to ship natively with selective refresh support and with visible edit shortcuts. A few additional adjustments in this new theme will ensure that every option can be previewed with selective refresh and provides visible edit shortcuts where appropriate.

Limitations & Future Iterations

The biggest limitation of the current approach is that implementation is entirely dependent on themes supporting it. However, unlike with many other theme-supported features, there is no add_theme_support for visible edit shortcuts. Where themes are already using selective refresh, shortcuts will be available out of the box in WordPress 4.7. To add theme support for edit shortcuts, themes need to add theme support for selective refresh, another newer customizer feature that allows the customizer preview to update granularly. Selective refresh provides superior user experience to the default refresh behavior because the preview context is not lost when changes are made.

Edit shortcuts currently rely on the presence of selective refresh partials for every setting that needs an icon. Some settings may be previewed exclusively with JavaScript via postMessage. Icons also aren’t needed for every option; for example, layout or color options are broader than a specific area of the site, so they aren’t associated with a particular edit icon in the preview. In the future, a structured JavaScript API for partials in the customizer preview could facilitate adding icons to JS-previewed settings that don’t use selective refresh.

Visible edit shortcuts are also the first step toward exploring the potential to edit elements of a site directly within the customizer preview. For this to be fully investigated, it’s imperative that a majority of themes and customizer option support selective refresh so that areas of the preview are associated with the appropriate customizer settings and so that context-disrupting full page reloads can be minimized.

Contributors & Call for Help

@sirbrillig led development of the feature for core based on the equivalent feature on Core props went to @sirbrillig, @mattwiebe, @celloexpressions, @melchoyce, @westonruter, and @afercia. Thanks to everyone who has contributed so far!

Now, your help is needed! Here’s what you can do to make this feature shine in WordPress 4.7:

  • Theme authors: add support for selective refresh to your themes. Start with widgets and make sure it’s working for menus, then make sure you’re using the core custom logo feature. Then, add selective refresh to the site title and tagline, header images, and any custom options with associated regions on the frontend.
  • Theme authors: adjust icon positioning in your theme’s CSS. You can add styles to.customize-partial-icon button to adjust all icons, and scope that to a specific container or even .customize-partial-icon-setting_id to adjust a particular edit icon. Note: these were updated with [39136].
  • Everyone: test edit shortcuts with your current theme with WordPress 4.7 Beta 1 (or newer). Most themes should be able to support them on widgets, menus, and logos with minimal effort. Contact your theme’s developer with any bugs or missing edit icon support, refer them to this post, and ask them to add support for visible edit shortcuts.
  • Everyone: test as many themes as possible and look for anywhere the shortcuts don’t display as expected, or at all. Contact the theme author with your findings, refer them to this post, and ask them to improve support for visible edit shortcuts in their themes.

#4-7, #customize, #dev-notes, #themes

Week in Core, Mar 1 – Mar 8 2016

Welcome back the latest issue of Week in Core, covering changes [36801-36888]. Here are the highlights:

Ticket numbers based on trac timeline for the period above.

Note: If you want to help write the next WordPress Core Weekly summary, check out the schedule over at make/docs and get in touch in the #core-weekly-update Slack channel.

Continue reading

#4-5, #week-in-core

WordPress Core Weekly

Here we go again! It’s time to look at what’s going on in WordPress core. This edition of WordPress Core Weekly covers March 28, 2015 [31916] through April 4, 2015 [32002].

Note: If you want to write the next WordPress Core Weekly summary, check out the schedule over at make/docs and get in touch in the #core-weekly-update Slack channel.

Highlights from this week

This week WordPress 4.2 Beta 4 got released. This hopefully last beta saw lots of accessibility improvements and added the ability to make admin notices dismissible. Emoji support in core is now pretty stable – maybe the next weekly post is written in emojis only? Also, there were some notes posted on utf8mb4 and the term splitting in WordPress 4.2.

Last but not least, @obenland and @wonderboymusic were announced as release leads for WordPress 4.3 and 4.4, respectively. Congrats! 🎉

Code Updates

Posts, Post Types

  • After [31114] and [31323], ‘View Post’ generated in get_sample_permalink_html() should go to pretty permalink. [32002] #30910
  • Avoid duplicate classes for different terms with UTF–8 slugs in post_class() and body_class(). [31979] #30883
  • In WP_Posts_List_Table::get_views(), don’t add the current class to the all status link if ->user_posts_count has a value, which triggers the additional mine status. [31959] #24869


  • WP_User_Query: When querying users with fields=all, ensure that caps and roles are filled for the current site. [32001] #31878
  • When updating the email address for an existing user, make sure the email address is not already in use. [31963] #30647



  • WordPress 4.2-beta4 [31997][31998]
  • Respect numerical keys in add_query_arg(). Avoid the use of array_replace() in add_query_arg(). [31966][31967] #31306
  • TinyMCE: always focus the editor after using the floated toolbar. [31972] #30619


  • Enhance twemoji.js to support passing of additional attributes for the replacement images. [31948] #31627
  • When encoding emoji into HTML entities, 0 was being incorrectly trimmed from the right side of the hex string, causing some characters to be encoded incorrectly. [31926]
  • When staticizing emoji into <img> tags, include an alt attribute of the original Emoji, to match both Smiley and Twemoji <img> tags. [31924]
  • Change the emoji CDN to, from [31938][31977] #31651


  • Accessibility improvements for Themes screen: fix keyboard events and callbacks for the Search field, increase trigger timeout a bit, improve Esc. key handling. [31994] #26600
  • Improve focus styling of add-new-theme link. [31952] #31203
  • Add a filter to short-circuit wp_prepare_themes_for_js(). [31943] #31789


  • Accessibility improvements for Options general screen: add missing labels and aria attributes. [31993] #31144
  • Accessibility: Add landmark roles to WordPress admin areas. [31955] #31450
  • Make sure the update button in “At a Glance” dashboard widget does not overlap with long strings. [31928] #30766

Press This

  • Prevent pasting of HTML in the title H2. Insert the clipboard text instead. [31987] #31768
  • Use more accurate wording on Tools screen. [31980] #31836
  • Use the error message returned by wp_update_post() instead of a generic one. [31930] #31808
  • Fix accessibility for the post options “sidebar”. Fix size of the Add Category button. [31925] #31575


  • Introduce a string representing bulk plugin update success, ready for string freeze. Not used yet. [31991] #31770
  • Plugins Browser: Replace the download count with the number of Active installs of the plugin. [31990] #31865
  • Add beforeunload string for shiny updates. [31989] #31769
  • Update aria-label when doing a shiny plugin update [31982] #31722
  • Add some logic into wp_tempnam to prevent it creating ‘falsey’ directory names that might get used elsewhere within WordPress. [31936] #31811


  • Merge title strings on Edit Site screens. [31962] #31844
  • Remove unused printf() on network setup screen. [31961] #31841
  • Decouple strings where the singular and plural form are not just the same string with different numbers, but essentially two different strings. [31941][31951] #28502


  • Theme Switcher: Navigation streamlining. [31975] #31289
  • Theme Switcher: Remove “Add New” references. [31968] #31837
  • Theme Switcher: Switch the details/live preview buttons. [31954] #31791
  • Theme Switcher: Use the global panel back button instead of adding a new one. [31918] #31794
  • Theme Switcher: Fix invalid HTML markup when New Theme control is added. [31950] #31203
  • Make the available widgets overlay closable on narrow screens. [31974] #28784
  • Defer rendering theme controls until the section is displayed. [31944] #31793
  • Revert [31911]. We want to preserve url and return URL parameters to make the experience smoother. [31933] #31782
  • Increase size of search field and disable text size adjustment to prevent auto zooming. [31917] #31794
  • Increase initial-scale viewport specification to 1.0. [31921] #31794, #28784
  • Fix selector for container which includes the controls. Broken since [30102]. [31916] #31794, #31014


  • Correctly set the post author in wp_xmlrpc_server::mw_editPost() when the current user is not the author of the post. [31983] #24916

Networks and Sites


  • Admin notices: Make (most) core notices dismissible. These no longer return upon refreshing the page when JS is on and working, so users should be able to dismiss them. [31973] #31233, #23367

Bundled Theme

  • Twenty Eleven: add postMessage support for header_textcolor to improve the user experience in the Customizer. [31971] #24128
  • Twenty Fifteen: adjust scroll behavior to make sure sidebar height is calculated during scroll events, not just resize events. [31934] #31734
  • Twenty Thirteen: make sure submenu links work correctly on small screens with touch events. [31932] #31762


  • Alter the regex in wptexturize() to properly handle input like: <> "Hello world" <>. [31965] #30344


  • When shifting WP_Rewrite::flush_rules() to a later action if it was called too early, make sure to do a hard flush if requested. [31964] #30501


  • When editing an image from the editor, and the image has a value for alignment (but not for width or caption), don’t bail without first checking that the alignment’s value is not alignnone. If so, add the class to the <a> before bailing. [31958] #21848
  • Media Library: Add a label for attachment type select in list mode. [31942] #31795



  • When we check the character set of a column, and find that it’s utf8mb4, we should also check that the current connection supports utf8mb4. It’s possible that the environment may have changed since upgrading the DB, so we can fall back to utf8 when that happens. [31947] #31771
  • When we’re checking to see if the MySQL client library supports utf8mb4, we need a separate check for mysqlnd versions, which using different version numbering to libmysqlclient. [31939] #31644

Login and Registration

  • Disable body scrolling when session expired log in modal is open. [31945] #31610


  • Revert using require for JS modules because that made them read-only for the public. [31935] #31684, #28510


  • Fix duplicate ID for Save Menu button on Menus screen. [31927] #31803

Thanks to @A5hleyRich, @adamsilverstein, @afercia, @azaozz, @boonebgorges, @cdog, @celloexpressions, @davideugenepratt, @dd32, @deconf, @Denis-de-Bernardy, @designsimply @dllh, @DrewAPictur, @DrewAPicture, @ericlewis, @evansolomon, @folletto, @helen, @iseulde, @jeremyfelt, @joedolson, @johnbillion, @jorbin, @jorbin, @kraftbj, @lancewillett, @markoheijnen, @mattheu, @mattwiebe, @MattyRob, @mehulkaklotar, @MikeHansenMe, @miqrogroove, @mordauk, @mrahmadawais, @ocean90, @paulwilde, @pento, @ramiy, @redsweater, @rittesh.patel, @sagarjadhav, @SergeyBiryukov, @sgrant, @stephdau, @swissspidy, @tyxla, @valendesigns, @westonruter, and @wonderboymusic for their contributions!

#4-2, #week-in-core

WordPress Core Weekly

Hi Everyone!

It’s time for another run-down of what’s going on in WordPress core. This edition covers March 20, 2015 [31845] through March 28, 2015 [31915].

If you want to write the next WordPress Core Weekly summary, check out the schedule over at make/docs and get in touch in the #core-weekly-update Slack channel.

This week’s highlight is WordPress 4.2 Beta 3, which was released on Thursday. There were many accessibility and emoji improvements and bug fixes. Also, shiny installs functionality was removed.


  • Improve newly added strings for i18n. [31905] #31776
  • Remove <code> tags from translatable strings. Uncomment deprecation notice for get_bloginfo( 'text_direction' ). [31899] #30614


  • Theme Switcher: Opening themes details modal shouldn’t require two clicks on touch devices. [31914] #31794
  • Theme Switcher: Reset font size of theme names in overlay. Apply left position only to themes section. [31892] #31303
  • Theme Switcher: Don’t hide action buttons on narrow screens. [31912] #31794
  • Use proper preview URL for Live Preview links. [31911] #31782
  • Avoid SecurityErrors when the Customizer is embedded in an origin other than wp-admin. [31885] [31893] #31687
  • Use responsive button styles if screen is max-width 640px. [31913] #31794, #28784


  • [31864] changed emoji image’s inline style from height to max-height. Unfortunately, anything using (for example, NewsBlur) strips out max-height, which gives us massive emoji in feeds. This re-adds height, and also reminds us why we can’t have nice things. [31909] #31719
  • When we’re replacing emoji with <img>s in email, we can only do that if the Content-Type is text/html – otherwise, they’ll show up in the email as the HTML string. [31860] #31720
  • Instead of loading the emoji JS files automatically, we now include a small JS shim in the header, to test if the user’s browser needs Twemoji. It then loads the emoji JS files only if they’re needed. [31875] [31877] [31879] #31701
  • Set the emoji image protocol with set_url_scheme(), instead of defaulting to HTTPS. [31861] #31735

Press This

  • Remove role="application" from the Categories list wrapper. This doesn’t make it work better in screen readers. [31907] #31443
  • On sites that support oEmbed, if the user has selected some text, quote it below the embed. [31894] #31763
  • Fix the links on inserted images to point to the source site. Fix inserting of images above the blockquote when the editor has not been focused. [31868] #31745


  • Fill $plugins['upgrade'] with extra info for use in list table [31872] #31738
  • Remove Shiny Plugin Installs [31897] [31900] [31901] #31773, #29820
  • When creating a temporary working directory, strip off .tmp as well as .zip incase we end up using that directory as the items main directory. [31863] #30945


  • Remove ambiguity in the time display format in core, switches to using 24hr notation where am/pm isn’t specified. [31862] #31121
  • Comments List: Don’t let “Quick Edit” break on smaller screens. [31889] #31482
  • Admin menu: Revert [31720] for swipe open/closed. This is problematic on any device that uses swipe for history navigation, particularly iOS. [31910] #31187
  • Do not output empty name and id HTML attributes in get_submit_button(). [31880] #31749
  • When altering the admin URL to reflect the canonical location, keep the existing hash (if present) in the URL. [31882] #31758, #23367
  • WordPress 4.2-beta3 [31902] [31903]


  • When saving post, ensure that non-hierarchical taxonomy input is defined before attempting to parse it. [31895] #30859
  • Taxonomy List Tables: On mobile devices, hide the slug column, to avoid cramping the action links into two rows. [31865] #29992
  • Supplement hook documentation for the get_terms_fields filter to more clearly explain the expected consequences of using it to modify the fields to select in a terms query. [31855] #31174


  • Make sure the editor is not completely empty before checking if the user clicked above or below a wpView. [31888] #31765
  • Pad empty paragraphs with <br> in Chrome to stop it from inserting non-breaking spaces in them. [31878] #31255
  • Fix error and PHP warning when adding more than one instance in RTL mode. [31874] #31578
  • Fix the icon for the wp_code button. [31858] #31733
  • When pasting an URL, check if the node it is pasted at is empty and remove any empty inline child elements. [31856] #31158

Script Loader

  • Avoid a PHP notice in wp_enqueue_script() if $handle is an array. Calling wp_enqueue_script() with an array as the first argument is a “hidden feature” and should be avoided. Use dependencies instead. [31887] #31636, #14488


  • Text Widget: Use !empty() for checking if the filter setting is set. [31886] #31690
  • Trigger _doing_it_wrong() if register_sidebar() is not passed an id. [31850] #31675

Login and Registration

  • Implement an aria-describedby attribute for login screen errors, and improve the “Forgot password?” anchor text. [31871] #31143


  • Introduce attachment_url_to_postid filter to let plugins manage the uploads location better. [31867] #31717
  • Show filename instead of extension in the list table. [31857] #30943

Bundled Theme

  • Update editor styles to better display images and captions in small screens. [31849] #31250

Build/Test Tools

Thanks to @A5hleyRich, @afercia, @aferica, @atimmer, @azaozz, @boonebgorges, @Cheffheid, @dd32, @dkotter, @DrewAPicture, @ericlewis, @extendwings, @HarishChaudhari, @helen, @ianmjones, @iseulde, @jacklenox, @janhenckens, @johnbillion, @johneckman, @jorbin, @kraftbj, @lamosty, @lancewillett, @magicroundabout, @maimairel, @markjaquith, @mattheu, @mattwiebe, @MikeNGarrett, @nerrad, @obenland, @ocean90, @pento, @ramiy, @rianrietvel, @SergeyBiryukov, @sorich87, @stephdau, @swissspidy, @tschutter, @tyxla, @valendesign, @valendesigns, and @westonruter for their contributions!

#4-2, #week-in-core

WordPress Core Weekly

Hi Everyone!

It’s that time again: WordPress Core Weekly is here. This is a catchup post and covers all commits since the last post up until 11/9/2014.

First, a couple quick notes!


  • Do not create shared taxonomy terms. [30240] #21950; See #5809.
  • Split shared taxonomy terms during term update. [30238] [30239] [30241] #5809
  • Don’t force child_of=0 for non-hierarchical taxonomies in get_terms(). [30265] #30275
  • In get_adjacent_post(), $excluded_terms should check term_id rather than term_taxonom_id. [30263] #29663, #22112.
  • Allow resource_type to be specified in get_ancestors(). Being explicit about resource type (taxonomy vs post_type) allows for the proper resolution of conflicts when a taxonomy and post_type share a slug. [30141] #15029
  • In wp_insert_term(), clean up accidental duplicate terms after insert. [30238] See #22023, #5809.
  • Add some unit tests for is_object_in_term(). These tests check a number of the ways that different kinds of values for $terms (integers that match term_id, strings that match term_id or name or slug) are handled. [30204] #29467
  • In in_object_in_term(), only check numeric string values against term_id. [30205] #29467
  • Introduce term_template param to get_the_taxonomies() to allow theme and plugin authors to specify the formatting on term links as they are parsed into the taxonomy list. [30209] See #27238.
  • Allow duplicate slugs across different post types. [30158] #18962
  • In get_terms(), do not override hierarchical and pad_count when parent is present. The previous behavior resulted in descendant terms being improperly excluded from the results when passing a parent, even when hierarchical had been set to true. [30107] #29815
  • Clean up get_term_by() caching, fix cache key/group modification that was missed in [30073], and update unit tests. [30108] #21760

Twenty Fifteen


  • Bump db_version and add upgrade routine for schema change in [30056]. [30121] [30134] #22023
  • WPDB’s __get() function should perform strict comparisons against member names. [30292]


  • Allow revision Backbone classes to be used on pages other than revision.php. [30128] #30221
  • Add a single responsibility function for outputting Revisions JS templates: wp_print_revision_templates(). Use it in wp-admin/revision.php. [30129] #30220
  • Revisions modules should not rely on global settings; only pass in global settings on init, this allows the classes to be used agnostically elsewhere. [30131] #30219


  • Pass all updated meta IDs to filters in update_metadata(). [30140] #11683
  • Unserialize get_metadata() results when key is omitted. [30115] #15030



  • Display error message when Media Library upload fails. [30156] [30177] #29891
  • Delete admin_created_user_subject() rather than deprecate. As it was never used as anything more than a callback to a filter before the MU merge, and is only available in user-new.php in multisite, it is safe to remove this function entirely. [30176] #29915


  • Improve/introduce Customizer JavaScript models for Controls, Sections, and Panels, along with a reference. [30102] see #28032, #28579, #28580, #28650, #28709, #29758. Fixes #29529.
  • Improve ColorControl‘s wpColorPicker to update UI based on setting changes. Update Twenty Fifteen’s colorScheme control to properly interact with the API, using wp.customize.control(). [30126] #30031
  • Add stable sorting for panels, sections and controls in JS. Improve sorting in PHP. [30214] #30225
  • Bind input and propertychange events for range input types. [30219] #30223
  • Twenty Fourteen: Make featured content in Customizer contextual to the front page. [30143] #29578


  • Introduce new template functions for archive titles and descriptions: [30223] #21995
    • get_the_archive_title() and the_archive_title() for returning/displaying the title of the current term, date, post type, post format, or author archive.
    • get_the_archive_description() and the_archive_description() for returning/displaying the description associated with the current term archive.
  • In get_page_children(), only check $page->ancestors once to avoid duplicates when the function recurses. Adds an argument, $ancestors. [30246] #18962
  • Allow get_pages(), with child_of passed to it, to work with interrupted hierarchies. [30159] #18962

Thanks to @afercia, @avryl, @azaozz, @bobbingwide, @boonebgorges, @bradyvercher, @Caspie, @celloexpressions, @dancameron, @davidakennedy, @davidjlaietta, @dikiy_forester, @dlh, @donutz, @DrewAPicture, @ericlewis, @filosofo, @florianziegler, @garyc40, @gcorne, @greuben, @hereswhatidid, @iamtakashi, @iandstewart, @imath, @Jayjdk, @jeremyfelt, @jesin, @joedolson, @johnbillion, @jorbin, @kitchin, @kovshenin, @kraftbj, @kurtpayne, @lancewillett, @landakram, @loushou, @markjaquith, @mattkeys, @mattwiebe, @mboynes, @MikeHansenMe, @mlteal, @mordauk, @morganestes, @nacin, @NikV, @nobinobi, @obenland, @ocean90, @pento, @philiparthurmoore, @realloc, @rmccue, @ryankienstra, @sakinshrestha, @SergeyBiryukov, @slobodanmanic, @TobiasBg, @tollmanz, @tywayne, @voldemortensen, @wedi, @westonruter, and @wonderboymusic for their core contributions!

Revisions covered: [30094] to [30292]. For the complete list of commits to trunk, check out the log on Trac.

Interested in joining in? Write or test a patch for 4.1.

#4-1, #week-in-core

WordPress Core Weekly

Hi everyone!

It’s this time of the week again: WordPress Core Weekly is here. This updates covers all commits since last week up to to today, October 29th.

In case you missed it, the new default theme, Twenty Fifteen, is coming along very well, the feature plugins planned for 4.1 are being tested extensively and the Customizer JavaScript API is getting more and more complete.

But there are many more things going on behind the scenes and Core has even passed revision [30,000]! Let’s have a look at this week:


  • Add labels to the Personal Options input fields on the user profile editing screen. [30027] #30101
  • Editor: Use <button> instead of <a> for the Visual/Text buttons, make them focusable. [30002] #27553
  • Customizer: Add the ability for a customizer control to render its controls via a JavaScript template. Switches the default color picker control to a JavaScript template. [30014] #29572


  • Twenty Fifteen: If the sidebar is taller than the viewport scroll it with the content, if it’s shorter keep it fixed. [30025] #29979
  • Introduce a new means of outputting a <title> tag in the theme head. Requires a theme to add support by calling add_theme_support( 'title-tag' ). [30074] #18548
  • Introduce some new template functions for navigation [30065] #29808
    • get_the_post_navigation() and the_post_navigation() for navigation to the next and previous post.
    • get_the_posts_navigation() and the_posts_navigation() for navigation to the next and previous page of posts.
    • get_the_pagination() and the_pagination() for paginated navigation between pages of posts.
    • Uses paginate_links(). This reduces the need for themes to define their own sets of navigation functions.


  • Deprecate admin_created_user_subject() [30005] #29915
  • Introduce an edit_form_before_permalink action which gets fired after the title field but before the permalink fields. [30028] #29691
  • In wp_link_pages(), only output link separators between actual pagination links. [30030] #24940
  • Rename _wp_password_hint() to _wp_get_password_hint() to bring it inline with core terminology. [30033] #21243
  • Don’t add sticky class in get_post_class() if ignore_sticky_posts query var is set. [30036] #18035
  • Don’t display Standard post format twice in the meta box if the theme unnecessarily mentions it in the add_theme_support() call. [30038] #16555
  • Add comment_reply_link_args filter for get_comment_reply_link() arguments. [30039] #10569
  • Allow slug param of get_terms() to accept an array. [30042] #23636
  • Introduce orderby=include support for get_terms(). [30052] #23261
  • Remove UNIQUE key from slug column of terms table. [30056] #22023
  • Add wp_json_encode(), a wrapper for json_encode() that ensures everything is converted to UTF-8. Change all core calls from json_encode() to wp_json_encode(). [30055] #28786
  • Introduce wp_is_trusted_network(). A first step to establish concepts around trusted and untrusted networks. [30071] #30145
  • Don’t hardcode height for videos – this was a workaround for MediaElement internals causing problems. Responsive videos now work properly and don’t cause extra whitespace. [30082] #30078
  • Introduce some actions and filters which aid plugins in revisioning post meta. [30091] #20564


  • Allow ORDER BY in WP_Comment_Query::query() to be disabled. [30004] #29902 DisableORDER BY by passing boolean false, an empty array, or the string none to the orderbyparameter. This mirrors the behavior of WP_Query.
  • Accept orderby=include in WP_User_Query. [30016] #30064 This lets the results of a user query be sorted manually by the value of the include param.
  • Fix count in WP_Comment_Query when using meta_query. [30026] #23369
  • Optimize site query when performing network database upgrades [30029] #30097
  • Improve WP_Tax_Query param sanitization for empty strings. [30031] #30117
  • Support multiple status values in WP_Comment_Query. [30084] #29612

Thanks to @peterwilsoncc, @iamtakashi, @nacin, @mnelson4, @afercia, @psycleuk, @rianrietveld, @davidakennedy, @celloexpressions, @DrewAPicture, @jipmoors, @ipm-frommen, @mattwiebe, @avryl, @heshiming, @desaiuditd, @ankit-k-gupta, @captaintheme, @marcosf, @obenland, @tmtrademark, @briandichiara, @tareq1988, @jakub.tyrcha, @johneckman, @kosvrouvas, @ptahdunbar, @nacin, @pushplaybang, @joedolson, @aaroncampbell, @jfarthing84, @dlh, @danielbachhuber, @wpsmith, @hotchkissconsulting, @JustinSainton, @jwenerd, @wonderboymusic, @tollmanz, @chrisbliss18, @joostdevalk, @TobiasBg, @nofearinc, @karpstrucking, @ebinnion, @boonebgorges, @mattheu, @adamsilverstein, @momo360modena, @tareq1988 for their core contributions!

Revisions covered: [29995] to [30093]. For the complete list of commits to trunk, check out the log on Trac.

Interested in joining in? Write or test a patch for 4.1.

#4-1, #week-in-core

Last Week in WordPress Core

Hi Everyone! This is the first Last Week in WordPress Core for WordPress 4.0! Last week, a minor update, 3.9.1 was released, and autoupdates started shortly afterwards. Development on 4.0 is ongoing, and you can see notes and meeting details posted by @helen on this blog as well.


  • In, when handling checkboxes, check for a value of false in addition to casting value to boolean. !! false evaluates to true. [28371] #23954
  • Allow users to set overrides for MediaElement instances by always passing _wpmejsSettings instead of just _wpmejsSettings.pluginPath. [28370] #25243
  • When pausing “all” players attached to MCE views, don’t reach into global scope and pause every player. Only pause the players bound to MCE views. [28364] #27971
  • In wp_read_image_metadata(), the values from exif_read_data() should only override values from iptcparse() that are empty. [28367] #23706
  • Support loop for [audio] and [video] shortcodes that specify files that are played using MediaElement’s Flash plugin bridge. [28363] #27368
  • MediaElement players need clear: both to play nice with adjacent floated elements. [28361] #27385


  • Custom Navigation Widget: Force users to choose a nav menu in the custom nav menu widget, for a better customizer UX. Before, they had to make a dummy change to get it to render. Now they are made to choose a nav menu from the dropdown, which feels more natural. [28197] #27878
  • Recent Posts Widget: Use ob_end_flush() instead of ob_flush(). ob_end_flush() flushes the output buffer and turns output buffering off, same as ob_get_flush(). [28195] #28009

Themes and Templates:

  • Prevent paged-* from being added to body classes and prevent Page %s from being added to page title on 404 error pages on default themes. [28249] #16468
  • Bundled Themes:Prevent Page %s from being added to page title on 404 error pages in bundled themes. [28250] #16468.
  • Bundled Themes: Use correct logic in IE conditional comments in header template. [28341] #28151
  • Set the proper value for wp_title() when is_author() and is_post_type_archive() are both true. post_type should always win due to the precedence indicated in get_queried_object(). [28251] #25398
  • Update the default (WP-defined) styles for MediaElement players to be more in-line with our flat aesthetic. Use the new official colors. [28365] #27516

Custom Headers:

  • Allow to skip cropping header images if image width is smaller than or equal to theme width. [28219] #27936
  • Avoid hiding ‘Remove’ buttons unrelated to custom headers. [27882] #27848
  • Keep header image from being removed when background image is removed. [28269] #28046
  • Avoid warnings in the process_default_headers() method. #27850
  • Fix logic when a theme doesn’t set default-text-color. [28294] #28042


  • Move home option to the top of populate_options() to make it easier to find next to siteurls for manual changes. [28260] #28141
  • Scrutinizer Cleanup: @wonderboymusic has started the process of cleaning up core with Scrutinizer. Check out the full list of fixes so far on #27882.
  • Hack/HHVM Compatibility: More from @wonderboymusic. See #27881 and #22400.
  • Dev Tools: Introduce default wp-cli.yml for core development. [28221] #28036
  • Add .dfxp and .srt files to mime-type whitelist in wp_get_mime_types(). They are both captioning formats supported by MediaElement. [28259] #27643
  • Add .xps and .oxps extensions to list of supported document types. More about the types on Wikipedia. [28372] #15697
  • When $type is atom in get_the_category_rss(), use get_bloginfo_rss( 'url' ) when setting the scheme attribute for the <category> node. [28258] #24444
  • In WP_Date_Query::get_sql_for_subquery(), don’t parse duplicate parameters – only parse one of w and week or month and monthnum. [28252] #25835
  • Add a filter for wp_list_comments() arguments. [28285] #19581
  • In get_the_author_posts(), if there is no current $post, return 0 and bail. [28362] #27998
  • In WP_Terms_List_Table::single_row(), call sanitize_term() on the passed term ($tag). [28360] #16864



  • First pass at wpview logic for the shortcode. URLs pasted on their own line are parsed as well. The toolbar will appear with the “remove” button when the view is clicked. Edit has not been implemented yet, nor have safety measures for non-iframe embeds. [28358] #28195
  • Audio, video, and playlist shortcodes: [28342] #22400, #27881
    • Convert all instances of variable variables to array properties
    • Stop using extract()
    • Rename $atts to $html_atts where collision with new $atts (shortcode atts holder) var might occur
  • Shortcode JS: Avoid errors when an escaped shortcode includes a newline between brackets. [28223] #27907


  • Fix case sensitivity regressions in 3.9. [28276] #27866
  • Treat “www” as a special subdomain, reversing 3.9 regression. [28280] #27927

Thanks to @andrezrv, @arnee, @avryl, @azaozz, @boonebgorges, @celloexpressions, @Clorith, @danielbachhuber, @dimadin, @ebinnionm, @ehg, @ericlewis, @feedmeastraycat, @GaVrA, @gcorne, @greenshady, @helen, @hlashbrooke, @imath, @jartes, @jdgrimes, @jeremyfelt, @johnbillion, @jorbin, @jupiterwise, @mattwiebe, @MikeHansenMe, @m_i_n, @obenland, @ocean90, @pavelevap, @psoluch, @rob1n, @rzen, @sergej.mueller, @SergeyBiryukov, @t4k1s, @Tmeister, @westonruter, and @wonderboymusic for their help!

For the complete list of commits to trunk, check out the log on Trac. We’ve been chatting about 4.0 plans, and things are shaping up. Come chat this Wednesday to continue the discussion, and please note if you encounter issues with 3.9.1 on Trac.

#4-0, #week-in-core

JavaScript Coding Standards

The PHP files in WordPress core become cleaner and easier to read with every release, thanks in part to our standards for PHP code style. Our JavaScript, on the other hand, hasn’t gotten nearly enough love. This post is intended to open up the recent discussion around JavaScript style to the greater community so we can make up for lost time.

Don’t we already have a style guide for JavaScript?

Back in March, @tommcfarlin added a set of coding standards for JavaScript to the developer handbook. These WordPress JS coding standards are a great work-in-progress, but weren’t fully comprehensive (leading to some comment threads clarifying various areas). More importantly, without any clear implementation plan the style guide failed to gain traction.

At WordCamp Boston’s core contributor day I revisited this style guide with @mattwiebe and Corey Frang (@gnarf37). It is important to identify *and implement* conventions for JS style ASAP because syntax issues in the JS within WordPress may hide latent bugs, and inconsistent code discourages contribution. Focusing on implementation lead us to look for an existing, proven JS style guide with a .jshintrc file (a set of configuration options for the JSHint code quality tool) which we could adopt largely as-is: Getting JSHint in place lets us see the biggest issues in our JS, so we can begin tackling them incrementally (perhaps in the same manner as the inline docs effort).

After looking at Idiomatic.js and several other widely-adopted JS style guides, we feel the jQuery Foundation’s jQuery Core JavaScript Style Guide guide is the closest match for what we need in WordPress.

Adopting the jQuery Core JavaScript Style Guide

jQuery’s guide shared WordPress core’s love of white space—the same “when in doubt, space it out” mantra from the existing JS style page. Moreover, jQuery’s code conventions have been referenced in trac tickets as an example of how we should be writing our code. Adopting their guide wholesale capitalizes on our stylistic similarities, and will let us adopt their .jshintrc and any future code quality tools they write with minimal changes.
Continue reading

#coding-style, #javascript

#22862: Consider a CSS preprocessor

In #22862, it was proposed that core move to using a CSS preprocessor. Given that we now have the appropriate tooling in place and MP6 has been greenlighted for preparation to merge into core, it is time we hash this out: which, if any, CSS preprocessor should we use, why that particular one, what does implementing it take, and what does the contribution process look like? Some of this discussion has already taken place on-ticket, which is great, including a ton of proof-of-concept patching by @wonderboymusic.

For further reference, MP6 currently uses SCSS for its color schemes, with a branch that demonstrates what it would look like in LESS. Many thanks to @ryelle for maintaining the LESS branch. By no means does this dictate what happens in core itself, but it is certainly an influence and a great data point.