Today in the Nightly: Customize in the Toolbar, Passwords UI, List Tables on Phones, Dashicons

Welcome!

The WordPress coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. development team builds WordPress! Follow this site for general updates, status reports, and the occasional code debate. There’s lots of ways to contribute:

Found a bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority.? Create a ticket in our bug tracker.

Want to contribute? Get started quickly with our tickets marked as good first bugs for new contributors or join a bug scrub. There’s more on our reports page, like patches needing testing, and on our feature projects page.

Other questions? We also have a detailed handbook for contributors, complete with tutorials.

Development leading up to the first betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. brought several visual changes. These are available right now in the nightly build. Switch a site to nightly builds and try them out.

Customize in the toolbar

To disambiguate between links to the CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. and links to the Appearance screens from the front-end, Customize now has a top-level toolbar button rather than having links to it mixed with dashboard links in the site menu. This context mixing leads to disrupted user expectations as they navigate, as well as experiences that feel slower or actually are slower in some cases. See #32924.

This means an additional top-level menu item, but the existing links to Widgets and Themes in the dropdown will now point to the adminadmin (and super admin), as the Dashboard and Menus links do. The advantage and goal for this change is to make it clear that you are about to enter the customizer. Deep links have not been added back in this go-round; this means that direct links to HeaderHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. and Background are currently absent (with a very narrow exception related to old browsers). Those two deep links are still available in the admin menu under Appearance, which similarly mixes context but has not yet been addressed.

: Dashboard view, Macnchrome

: Front page view, Macnchrome

: Front page, iPhone 6+

: Dashboard, iPhone 6+

More changes are coming to the toolbar. Peek at a possibility for more general improvements to the toolbar, being discussed in #32678.

Phone friendly list tables

List tables now scale down to phones. The column truncation strategy they used before didn’t scale down to small screens. A single column layout with disclosures is the new strategy. Some of our most important screens use list tables, notably Media and Posts. Truncated columns was number 5 on our top 5 impediments to flow on touch devices list.

After:

: Media

: Posts

Before:

: Media

: Posts

See #32395.

For more screenshots, see these visual surveys of the list table screens.

Toolbar interaction fixes for touch devices

I’ve been wanting this one for a long time. Toolbar interaction was number 3 on the top 5 impediments to flow on touch devices.

Fixed!

See #29906. That ticketticket Created for both bug reports and feature development on the bug tracker. is a good read. It has: Visual feedback and visual surveys. Punting a working fix to the next release so that a new, more future proof approach could be tried. Development of touch capability detection. Working around iOSiOS The operating system used on iPhones and iPads.. Development of testing checklists. Lots of iteration.

Passwords UIUI User interface

The password set/change UI was updated with these improvements.

Generate the password for the user
More tightly integrate password strength meter
Warn on weak passwords

See #32589 for more screenshots.

Dashicons update

Dashicons received a big update.

New icons:

.dashicons-admin-customizer (f540)
.dashicons-admin-multisitemultisite Used to describe a WordPress installation with a network of multiple blogs, grouped by sites. This installation type has shared users tables, and creates separate database tables for each blog (wp_posts becomes wp_0_posts). See also network, blog, site (f541)
.dashicons-editor-table (f535)
.dashicons-filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. (f536)
.dashicons-hidden (f530)
.dashicons-image-filter (f533)
.dashicons-image-rotate (f531)
.dashicons-layout (f538)
.dashicons-sticky (f537)
.dashicons-thumbs-down (f542)
.dashicons-thumbs-up (f529)
.dashicons-unlock (f528)
.dashicons-warning (f534)

Updated icons:

.dashicons-plus (f132)
.dashicons-yes (f147)

See #30902.

Better styling for `.form-invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid.` inputs

: Macnchrome

: iPhone 6+

: Before

See #32490.

Responsive styling for my-sites.php

My Sites now moves to a single column layout on narrow viewports. Here it is on an iPhone 6, an iPad, and a Macbook, as well as at full-width.

: iPhone 6

: iPad

: full width

: Macnchrome

Here’s what it looked liked before.

See #31685 – Better responsive styling for my-sites.php

Crosslinking Customizer Panels

The graf in the Menus panel details about using the Customize Menu widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. now links directly to the widgets panel.

See #32742.

You might notice the misaligned question mark icon on that screenshot. #32733 is tracking that.

Easy switching between production and nightly builds

The beta tester pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party makes it easy to switch a site to nightly builds. Now switching back to the latest stable build is just as easy. It’s not the prettiest, but it is shown only to beta testers and will suffice until we finally refresh the Grand Unified Updater screen. For info on using the beta tester plugin to test with nightly builds, see the Beta Testing page of the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. handbook.

: Macnchrome

: iPhone 6+

See #32613.

Previously: Today in the Nightly: Site Icons, Text Editor in Press This

#beta-testing-flow, #customize, #dashicons, #list-tables, #multisite, #passwords, #today-in-the-nightly, #toolbar

Thong Tran 12:06 am on July 9, 2015

Awesome updates. Btw, the ability to move a widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. from one widget area to another has gone (in CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.) in WP 4.3 betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. 1, please bring it back.
- Nick Halsey 3:50 am on July 9, 2015
  
  To support a broader UXUX User experience change made in #31336, it is no longer possible to drag & drop items between widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas. However, the move-to-area functionality is still present along the reorder buttons when you enter the “reorder” mode, similar to the click-to-add functionality in the adminadmin (and super admin) page.
  - Monika 7:08 am on July 9, 2015
    
    this works like a charme 🙂
    and I do not love the customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings., because I can’t safe “options” 🙂 to move them from one WP to another 🙁
    - daronspence 10:03 pm on July 9, 2015
      
      Monika, there is a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party available on GithubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ that may help you transfer customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. options to other themes. Note, it isn’t guaranteed to work and is highly dependent on how your theme actually stores it’s settings in the database.
      
      https://github.com/ArrowRootMedia/Theme-Customizations-Cloner
Jon Brown 12:51 am on July 9, 2015

“Customize in the toolbar” getting it’s own top level menu is going to make me SOOOoooo happy you have no idea. Every time since 4.2.2 I hit that widgets link and get thrown into the customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. I scream curses at it my installs. Also just inspired me to write a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party… to scratch another itch I’ve long had around that menu.
nikeo 8:48 am on July 9, 2015

Hi, thanks for this post.

Funny : the customize button is something I’ve had to remove from my theme last year because there was “no real justification for elevating the Theme settings page to adminadmin (and super admin) toolbar status.”
See here : https://themes.trac.wordpress.org/ticket/18164#comment:5

Well, I guess this is now 100% justified and of course I think this button is an excellent choice ! 🙂
Remkus de Vries 10:21 am on July 9, 2015

Love the move of giving the CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. its own top level link. Love it.