Customizer, Preview: Visual survey of customizer device preview

Screenshots from my testing sessions for #31195 and #35875.

Macnchrome, sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. expanded

Macnchrome, sidebar collapsed

Macnfirefox, sidebar expanded

Macnfirefox, sidebar collapsed

 

Tablets and phones don’t have device preview.

iPad Air

iPhone 6+

iPhone 5

Nexus 5

#31195, #35875, #android, #chrome, #customize, #customizer, #desktop, #ios, #macos, #phablet, #phone, #preview, #safari, #visual-survey

Editor: Trying to upload a video, iPhone 6+, Macnchrome

My journey starts in Press This on a wordpress.comWordPress.com An online implementation of WordPress code that lets you immediately access a new WordPress environment to publish your content. WordPress.com is a private company owned by Automattic that hosts the largest multisite in the world. This is arguably the best place to start blogging if you have never touched WordPress before. https://wordpress.com/ site. I want to upload an image and a video. I upload both seemingly successfully, but only the image inserts. I go back into the media modal, and see this…

Notice also that the progress indicator is stuck and that scroll bleedScroll bleed Sometimes when scrolling a modal such as the media modal on touch devices, the scrolling bleeds through to the page beneath the modal. Instead of scrolling the modal, the page beneath scrolls. Sometimes the scrolling nests and sometimes the page beneath grabs scrolling all for itself. Android doesn't usually have this problem, but iOS triggers it often.https://make.wordpress.org/test/tag/scroll-bleed/ is evident.

Maybe this is a wordpress.com specific problem. Let’s try a self-hosted site on Bluehost.

That’s a different error than on wordpress.com, but the effect is the same. I can’t insert a video.

Maybe this is an iOSiOS The operating system used on iPhones and iPads. problem. Next, let’s try desktop with Macos and Chrome.

Broken on desktop too.

Broken on desktop too.

Video insertion is broken on Macnchrome as well. The video does upload correctly. I can download it from this link and play it back.

Attachment page showing link to video.

Attachment page showing link to video.

WordPress* mobile web failure.

#chrome, #desktop, #editor, #ios, #macos, #media, #phablet, #video

Embeds: Visual Survey of the oEmbed feature plugin, Macnchrome, iPhone 5S

Surveying the oEmbed API feature plugin, which makes WordPress an oEmbed provider and allows you to embed posts from other WordPress sites. Related ticket: #32522

Using it is pretty simple:

  1. Find a blog post you like to embed
  2. Copy its URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org
  3. Paste it into the editor

Note that the 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 needs to be active on both sites to work.

Chrome (on OS X), single site, admin user:

iPhone 5S, single site, admin user:

#chrome, #desktop, #feature-plugin, #feature-plugin-oembed, #ios, #macos

Media, Featured Images: Setting the featured image on an old post, Macnchrome

This thread discusses featured imageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. flowFlow Flow is the path of screens and interactions taken to accomplish a task. It’s an experience vector. Flow is also a feeling. It’s being unselfconscious and in the zone. Flow is what happens when difficulties are removed and you are freed to pursue an activity without forming intentions. You just do it.

Flow is the actual user experience, in many ways. If you like, you can think of flow as a really comprehensive set of user stories. When you think about user flow, you’re thinking about exactly how a user will perform the tasks allowed by your product.Flow and Context
through the media modal. There are some requests that the 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. in the media modal remember the “uploaded to this post” filter setting independently for the featured image flow. Here’s an attempt at capturing this flow.

“Uploaded to this post” requires that the image be attached to a post. Images uploaded through the media modal from the editor are attached to the post, but images uploaded directly to the media library are not attached and don’t get attached later when added to a post. We could use APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. for pulling images out of post content, like we do with some other media types.

 

#23041, #23205, #32622, #33773, #chrome, #desktop, #featured-images, #macos, #media

Toolbar: visual survey of toolbar experiments, Macnchrome, iPhone 6+

Surveying the Toolbar Experiments 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 for #32678.

Macnchrome, single site, admin user:

iPhone 6+, single site, admin user:

#32678, #chrome, #desktop, #feature-plugin, #feature-plugin-toolbar-experiments, #ios, #macos, #phablet, #toolbar, #visual-survey

Customize: preview site responsiveness, Macnchrome, iPad Air, iPhone 6+

A brief visual surveyVisual survey A visual survey is a collection of screenshots for a like set of screens or interfaces, such as all list table screens or all toolbar incarnations across various devices. These screens are not presented in the context of a particular flow.https://make.wordpress.org/test/tag/visual-survey/ for #31195 with WP 4.4-alpha-33848 and Customizer UI Experiments 0.1.

#4-4, #alpha, #chrome, #customize, #customizer, #customizer-ui-experiments, #desktop, #feature-plugin, #feature-preview-responsiveness, #ios, #macos, #phablet, #preview, #responsive, #tablet, #visual-survey

Passwords: Password reset via email, Macnchrome

#chrome, #desktop, #email, #macos, #passwords, #thresholds

Menus, Customize: Visual survey of menu locations, Macnchrome, iPhone 6+

Visuals for a locations, groups discussion. https://wordpress.slack.com/archives/design/p1440091790000074

Macnchrome:

iPhone 6+:

#chrome, #customize, #desktop, #ios, #macos, #menus, #phablet, #visual-survey

Upgrade/install: Update from an update notice, Macnchrome

This explores flows from the update notice. This site was running 4.3 RC3 and the 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. 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 when vizreced, so the update-core.php screen shows beta track ui.

The codex pages linked to from the update notice and upgrade-core.php are not at all compelling. They’re the opposite of that. 🙂 You don’t see anything compelling until you reach the About page after doing the upgrade.

update-core.php really needs the shiny updates treatment. Upgrading to the next releaseRelease A release is the distribution of the final version of an application. A software release may be either public or private and generally constitutes the initial or new generation of a new or upgraded application. A release is preceded by the distribution of alpha and then beta versions of the software. is a flowFlow Flow is the path of screens and interactions taken to accomplish a task. It’s an experience vector. Flow is also a feeling. It’s being unselfconscious and in the zone. Flow is what happens when difficulties are removed and you are freed to pursue an activity without forming intentions. You just do it.

Flow is the actual user experience, in many ways. If you like, you can think of flow as a really comprehensive set of user stories. When you think about user flow, you’re thinking about exactly how a user will perform the tasks allowed by your product.Flow and Context
that should be polished and compelling.

This entire process needs better localization.

#about, #chrome, #codex, #desktop, #l10n, #macos, #updates, #upgradeinstall, #wordpress-org