What's different What's new WordPress 5.3 (New blocks, APIs admin User Interface)

WordPress 5.3 "Kirk" first came out initially launched on December, which is November 12th, 2019. It is now available to download.

What's new with WordPress 5.3?

There's plenty of wonderful things in it? Let's get our feet up and dig deeper to WordPress 5.3.

What's new in this Block Editor?

Performance improvements across the board can be seen as well. The benchmark is a measure of the how well the blog's largest article (36,000 words in 1,000 blocks) by using various versions of Gutenberg. Gutenberg plugin.

You might not be able to discern any differences between loading times for regular posts. There is no doubt that there has been an overall increase in the speed of editors.

It's hard to compile an exhaustive list of all adjustments, updates and bug fix, so we picked the ones that most impact users and developers, and then grouped them in the order below:

•       Enhancements to Editing Experience
•       features for theme designers and theme developers
•       Additional Block Developers

Improved Editing Experience

The latest Group block allows large alignments as well as backgrounds with a variety of colors . This gives WordPress users the flexibility to design their own material.

Additionally, in addition with the Group Block, as well when used in conjunction with Group block we were given an opportunity to examine 10 enhancements to the Block Editor. These improvements will have an influence on how you use the editor.

1. The Block Appender

Blocks for Groups and columns are updated to display an appender. Group Blocks as well as Blocks for Columns have been updated to provide an appender to the block in the event that they're not completely empty. Appenders are basically gray areas with the symbol plus inside. This makes it easier for users and can help facilitate the process for users.

2. Grouping Blocks via Group Interaction

You can now make Blocks that are combined using the 'group' interaction' that means you're able to select multiple block and group them with only few clicks quickly. This is as simple as adding every block that is required to your list and then selecting Group within the menu that shows in the ellipsis. Done!

3. Custom-width columns

The Columns block is now updated to support sliding control. Columns Block has been upgraded to support an option to slide control within the Block settings, allowing the user to select a customized size for every column (in the near future , there may further enhancements made to the Columns block when we've added the adjustability control, which is able to be set to adjust).

4. Layout Picker to Columns Blocks

Another enhancement made to one of the Block of Columns in the WordPress 5.3 is the layout picker. The feature was added to the editor together with Gutenberg 6.0, this choice lets users select from a range of designs (patterns) or select the default layout. This makes editing faster and makes the block more easy to navigate even for users who don't have technical skills.

The layout picker is based on the Block Pattern API. Block Pattern API which allows users to choose between a predefined selection of blocks to select from for adding a block. Apart from Blocks with Columns and Cover blocks, as well as Blocks with Columns, in addition to Columns Blocks, you are able to see some instances of Block patterns inside Table and Cover Blocks. There are more information regarding Block Patterns API on GitHub. Block Patterns API can be located here on GitHub.

5. Table Block Enhancements

Block for tables Block for tables has been upgraded with new features. The block now allows you to align text across the columns, headers of tables and footer as well as the background color.

6. Block Navigation Mode

Gutenberg 6.3 introduced the Navigation Mode that lets users switch between blocks with tab and arrow keys without the need to input the content of each block. It is possible to switch between the Navigation Mode within Edit Mode before returning to Edit Mode by using Enter as well as typing or. This is an excellent enhancement in the user's experience, especially for those who use screen readers.

7. The Motion was added to the block and was added to Rearrangements and Block Changes.

Another improvement in the user's experience can be seen in one of the features that makes it easier for users to use: intro motion to hold changes in place that remove objects in addition to changing the sequence of objects. Matias Ventura gives this explanation on the reason why this is a crucial feature:

list, which contains numerous items    

8. Gallery images reordered on the inline Blocks

Gallery block has been improved. Gallery block is improved now by incorporating the capability to rearrange images in the gallery inline. We can now rearrange photos within the gallery by using the button click Moving images to the left or to move them in forward and reverse buttons without needing to open the media modal window.

9. Its Latest Posts Block has been refreshed with brand new features. Recent Posts Block

The settings panel for block includes a brand new section which the user can turn off or turn on the publishing of content. If you have the function of posting Content is turned on in your block, you can choose between Excerpt or complete post options. Additionally, the slider permits you to change the length of the excerpt in the case that the Excerpt option is selected.

This last change forms an element of a larger strategy that focuses on overall UI improvements. Within the many variants in"Latest Posts" Block "Latest Posts" Block, Mel Choyce states:

To prepare for the development of the template pages for Gutenberg This will require a strong set of dynamic blocks that are able to be added to each page or post. The growth of this block can put us in a position to handle more intricate block designs that are both flexible and universal over the next decades.

The users should not need to be aware of the right way to make custom queries, or figure out the right method to include articles on their website. This block of Recent Posts block can be a good start. To be an effective solution it needs to allow posts to go beyond only title and dates.

10. The Blocks on the Lists Change

Lists blocks are now upgraded to incorporate shortcuts for indent and outdent the starting point, in addition to reverse order capabilities to create ordered lists.

Additional Enhancements to the Block Editor

The sheer volume of Gutenberg plugins merging with the Core there is many changes, improvements and bug fixes that we aren't able to not even discuss in this article. The other updates and enhancements include:

• The Columns block has been upgraded to permit vertical line alignment ( Gutenberg 5.4).
• The Media & Text block now permits vertical align ( Gutenberg 5.5).
• The Button block is now improved to give the option of connecting onto an object ( Gutenberg 6.2).
• The Separator block has been modified to permit border color ( Gutenberg 6.3).
• Blocks used for covering can be altered in the size ( Gutenberg 6.4).
• Experience better using Typewriter particularly helpful on phones (Gutenberg 6.4).
• The Image block comes with a circular crop version (Gutenberg 6.4).
• The all-new Social Links block has been added ( Gutenberg 6.5).
• The Gallery block has now capable of gallery captions (Gutenberg 6.5).

Innovative Tools for Theme Developers as well as Designers

WordPress 5.3 includes a variety of features that are new along with improvements of the Block Editor. Block Editor for theme developers and designers, too.

1. Within the containers of Group Block

The Group block now contains an inner container (wp-block-group__inner-container) that could extend beyond the main block container if not carefully designed. The result could be unexpected changes to how your site appears.

Thus, for themes that support large and full alignments, Block containers might require additional CSS for it to display exactly as you'd like it to.

This is an example from the Create WordPress Core blog showing how best to design blocks that can be styled to avoid this kind of issue.

Apply entry-content styles to the container that houses the block as well. .entry-content, .wp-block-group__inner-container width: 60vw; margin: 0 auto; // When a group block has a wide alignment, make sure that its full-width children do not extend beyond the width of the container. .alignwide, .wp-block-group.alignwide .alignfull margin-left: -10vw; width: 80vw; .alignfull margin-left: -20vw; width: 100vw; // Ensure wide and full-width children do not extend beyond the width of a standard-aligned Group block. .wp-block-group:not(.alignwide):not(.alignfull) * max-width: 100%; margin-left: 0;

2. New Class name for alignments of text

Prior to WordPress 5.3 at the time it was released, styles inline were used to change the alignment of text blocks (Heading paragraphs, paragraphs quoted as well as Verse).

The high-precision of styles inline can make it hard to modify the look of the blocks. However, theme developers are able to profit from three different CSS classes that are able to substitute the inline style.

• has-text-align-right
• has-text-align-center
• has-text-align-left

The blocks in place will be updated and classes will be added when the posts are archived and viewed within The Block Editor.

3. Gallery Block along with Table Block Markup Update

The Blocks Gallery as well as Table have been incorporated into Figures elements. The styles of the elements change and themes can be affected, and may need to be changed. The table block's current markings

 Center Right Center Right Center Right Left Center Right Right Center Left Left Center Right Left Center Right 

Learn more regarding class names as well as related themes updates at WordPress Core blog. WordPress Core blog. WordPress Core blog.

Block Developer's Toolkit has features designed specifically to help block developers.

WordPress 5.3 brings improvements and also improvements to the Block API.

1. Register and Unregister Block Styles

Prior to 5.3 Designers and developers used to make use of JavaScript to create and unregister styles.

With the release of WordPress 5.3, we can now take advantage of two new helper functions allowing to register and unregister block styles via PHP: register_block_style and unregister_block_style.

This register_block_style function produces a unique style of block. It is dependent on two arguments

• The name of the block.
• There are a variety of homes that feature the latest style.

The array can include the following factors:

• Names: (required) a unique identifier that identifies the style.
• label: (required) human-readable label.
• inline_style: (optional) a CSS code that is registered with the CSS class used for the style.
• style_handle: (optional) a handle that's linked to the style already in use (the handle used for styling is used to store the style at any time it's required).

We can register inline styles through a method similar to the code below:

add_action( 'init', 'register_custom_block_style' ); function register_custom_block_style() if( ! function_exists( 'register_block_style' ) ) return; register_block_style( 'core/quote', array( 'name' => 'blue-quote', 'label' => __( 'Blue Quote' ), 'inline_style' => '.wp-block-quote.is-style-blue-quote color: blue; ', ) ); ;

The updated style is accessible by visiting the Styles Settings section.

Instead of needing to register an inline style we could change a handle into the style that was previously registered:

wp_register_style( 'custom-style', get_template_directory_uri() . '/custom-style.css' ); register_block_style( 'core/quote', array( 'name' => 'custom-quote', 'label' => 'Custom Quote', 'style_handle' => 'custom-style', ) );

The illustration below is an example of the blue quote that is included in the illustration above.

To unregister a style previously registered on the server with register_block_style, we can use the function unregister_block_style.

We can use unregister_block_style as follows:

unregister_block_style( 'core/quote', 'custom-quote' );

2. API Block Examples

WordPress 5.3 features a modern JS property, which lets you review the chosen block within the library prior to making it available to your content.

The feature can be added to your block by setting the the example property of the block's configuration as follows:

blockSettings const = ... * registrationBlockType( Name and Setting );

Improvements to the Site Health Component

1. Eliminated the site health rating

When WordPress 5.2 was released, WordPress 5.2 the percent score was shown in the upper right corner of the Site Health status page. There were some users who were concerned about the result, stating that the score was unclear, and vague as it could want to achieve the overall score to 100 percent. That's not the ideal score for their site (read more details in these tickets).

The tool shows how many tests have been passed by a website, however it isn't able to show the amount of "health". The percentage of "health" has been removed too. This tool has been updated. Site Health tool now shows the two states that appear more like warnings, but are precise indicators of a website's effectiveness and security.

•       Needs to be enhanced      
• Good

2. Better recovery emails

When a glitch occurs, WordPress attempts to send an email with an announcement about recovery to the admin of the site. However, these emails aren't providing us any valuable information to assist us in diagnosing the problem since we're informed that something went wrong with our website.

Failure emails may have a different part which starts with the text: If you are seeking help with this problem, you might receive information such as:

The following information is provided:

• WordPress version.
• PHP version.
• Themes and variations.
• The name and version of the plugin are what can cause the problem.

Information is intentionally reduced at a bare minimum to avoid confusion for the end-users, but developers can use recovery_email_debug_info filter to add more details when needed (see ticket #48090 for further information).

3. Filters to conduct full tests of the Health Status of the Site

The new site_status_test_result filter allows developers to filter the output of a finished status test to extend the result of a test.

Developers may also utilize this filter to perform further actions. This is an excellent example of the use (see ticket #47864):

One good example is the hosting providers. PHP extensions aren't readily available, therefore they need to make an active link to the PHP extension manager on their control panel. It could be that they're trying for clarification or more clarity. PHP Version test, which recommends users update, they add the link in an ajax which will change the PHP version they like in a flash.

The filter is accessible within PHP for direct testing as well as a JavaScript implementation of testing that is synchronous.

A Better Experience for Admins

In addition to in addition to Site Health Tool, WordPress 5.3 adds a number of Admin UI features that are likely to dramatically improve the user experience of the WordPress dashboard.

1. Enhanced Color Contrast

The contrast of colors is now higher as well as accessibility issues have been fixed.

2. Admin Email Verification

Administrator's confirmation email is now sent out after an admin's email confirmation will now be sent in the event that an administrator isn't allowed access to their admin area for the period. By default, this interval is set to six months, but developers can set a different interval using the admin_email_check_interval filter (see tickets #46349 and #48144).

To disable the administration email verification to prevent administrators from receiving verification emails, you can use this filter:

add_filter( 'admin_email_check_interval', '__return_false' );

3. The uploads have been restarted

Large images that are taken via smartphones will not cause any damage during the course of uploading since WordPress permits resumption of uploads in the event of failure.

4. Image Rotation

Images have been correctly rotated to ensure that they're uploaded in accordance with EXIF orientation information.

A new theme and A New Design for the default use 20 Twenty

Twenty Twenty has been built out of an open-source template that was created by The Community Chaplin project by Anders Noren. The theme is built on an open and free typeface that has its own distinctive persona: Inter by Rasmus Andersson.

Modifications for WordPress Developers

WordPress 5.3 offers a wide range of improvements and changes to WordPress developers. Alongside the many changes, the following are worth mentioning:

•       the Date/Time Component Improvements
•       The ARIA current Attribute is new.
•       New ARIA-Label Label Attribute
•       Functions that add UGC value to rel attributes in the links
•       A REST API from WordPress 5.3

Enhanced Date/Time Essential Components

The main component in Date/Time controls all aspects of time, dates as well as timezones in WordPress. As Andrey "Rarst" Savchenko explains:

WordPress timestamp    

It was difficult to eliminate entirely WordPress timestamps, but it was achievable in reverse compatibility. The component's code is being improved with several improvements to the bug. The on-line manual is updated as needed.

Additionally, with this version of WordPress 5.3 we have access to many new API functions for Date/Time:

• timezone_string wp_timezone() - This function will determine the timezone on your website in strings. It could return a PHP timezone string or +-HH:MM offset.
• timezone WP() - This function is used to retrieve the timezone on your site in the form of a DateTimeZone object.
• wp_date() - This is a completely new function that allows the localization of dates. The intention is to use it into account date_i18n().
• Current_DateTime() - This function allows you to find the current date by converting it into an immutable DateTime object, with the capability of setting the timezone.
• get_post_datetime() - Retrieves post time DateTimeImmutable object.
• obtain_post_timestamp() - Retrieves the posting time as Unix timestamp.

All these functions are defined and documented in wp-includes/functions.php.

The use of the current_time(), get_post_time() and date_i18n() is now prohibited.

Take a look at new features for the Date/Time element in WordPress 5.3 and additional features which are included in the API through GitHub.

New ARIA-current Attribute

When a new page or blog post is posted its name appears on a range of choices and menus. Before WordPress 5.3 it wasn't easy for users to be aware of this link. This could lead to confusion, especially for people who have disabilities or screen reader users.

The new WordPress 5.3 version WordPress 5.3, a new aria-current="page" attribute is included in WordPress 5.3. It allows WordPress program to indicate websites that have been linked and themes are encouraged to use specific styles for the hyperlinks. The new attribute will impact the following widgets in WordPress' core:

• Recent Blogs.
• Navigation Menu.
• Pages.
• Category.
• Archives.

Here's an exampleof:

A[aria-current] CSS styles for the current URL

New ARIA-label Attributes to the Navigation Menus

" Landmarks provide a powerful way to identify the organization and structure of pages" and permit theme developers to integrate typing into websites with markers.

ARIA landmarks offer a context for web content and can help people who utilize assistive technology.

In light of the significance of ARIA Landmarks for accessibility, WordPress 5.3 has been capable of supporting the aria-label attributes for posts and comment navigation.

Theme designers and developers can include ARIA markers to post and menus for comments by including the brand-new aria_label parameter in the following methods:

• _navigation_markup()
• get_the_post_navigation()
• get_the_posts_navigation()
• get_the_posts_pagination()
• get_the_comments_navigation()
• get_the_comments_pagination()
• the_post_navigation()
• the_posts_navigation()
• the_posts_pagination()
• the_comments_navigation()
• the_comments_pagination()

Discover more information about the properties of ARIA-labels on blog posts, as well as the way to navigate comments by Creating WordPress Core.

Alternatives to enhance UGC value to rel attributes within Links

In September the year that was, Google has released two new attributes that let you identify the nature of hyperlinks: rel="sponsored" and rel="ugc":

rel="ugc"    

WordPress 5.3 introduces new features for users to add the rel="ugc" attribute within comments. The update was made available in under an hour, and it's fascinating to look at the speed at which the WordPress design team could to respond on the Google announcement (see ticket #48022).

In addition, WordPress 5.3 introduces two brand new possibilities permitting developers to apply nofollow in addition to UGC value to links. rel property of hyperlinks:

• wp_rel_callback() is used to add values are used to add values Re assigns attributes to linked sites, is a replacement for the obsolete wp_rel_nofollow_callback() function. The function is defined in wp-includes/formatting.php :

*Code >/** * Callback for including the rel attribute in HTML A element. Take out all string elements that are currently in use before making any modifications to prevent invalidation of (X)HTML. * * @since 5.3.0 * * @param array $matches Single match. * @param string $rel rel attribute that is added to the element. * @return String HTML element included in an attribute known as rel. */ function callbacks function callback( matches and the value of the variable $rel )

• WP_REL_UGC() adds that both Nofollow and Ugc values represent associated with rel attributes in links.
        The term "function" is described in wp-includes/formatting.php :

/** * adds `rel="nofollow ugc"string to the entirety of HTML A elements located within the content. *Since 5.3.0*. @param Text Content which may contains HTML A elements. * @return string Converted content. */ / function to use wp_rel_ugc( $text ) /// This is an automatic save filter meaning that text already has been encrypted. $text = stripslashes( $text ); $text = preg_replace_callback( '

From now, developers can add rel="nofollow UGC" attribute to links as per the following rules:

$link = 'User generated link example'; $ugc_link = wp_rel_ugc( $link ); echo $ugc_link; // output: User generated link example

This API for REST is available in WordPress 5.3

WordPress 5.3 contains a variety of improvements and enhancements to the REST API.

The most significant change is the addition to objects along with "array" types of data into register_meta functions..

Thanks to this improvement, this improvement means that the REST API is now capable of handling the most complicated metadata types. This enables us to use the API to verify schemas. This will allow the interactions between clients and code using complex values as well as allow developers to build intricate blocks using metadata through the REST API.

For a better knowledge about the subject read this WP 5.3 This subject can be used with Meta Types that are Array and Object in the REST API.

The second major improvement is the field parameter. This allows you to limit the types of fields which are included in JSON objects returned via the REST API. Check out the following examples:

/wp/v2/posts?_fields=id,title,author

When using in WordPress 5.3  The field parameter allows us to restrict the response object from the REST API using nesting fields. This means that we are able to request particular metadata fields or property inside the complex object. This field parameter can be used in the following method:

?_fields=meta.meta-key-1,meta.meta-key-2,meta.meta-key-3.nested-prop

For more detailed information of the features available through REST API that are being introduced to WordPress 5.3 check out this article on the REST API that is available in WordPress 5.3.

What is the best way to update WordPress to WordPress 5.3? WordPress 5.3

WordPress 5.3 was released on the 12th November 2019. Take these steps to update your WordPress website.

If everything is well with the upgrade and you're able to view your "Welcome to WordPress 5.3" screen. That's all there is to it! Simple and quick.

After you've signed in to the dashboard, you'll get an email to upgrade you database. Make sure to upgrade it to the most recent version. Just click"Update WordPress Database" or hit"Update your WordPress Database" or click on the "Update the database on your WordPress Database" button and you're good to go.

Troubleshoot WordPress Problems WordPress Update

If you are upgrading an older version of WordPress there are a lot of certain issues that arise which result from the variety of plugins and themes available. Here are a few ways to resolve common issues.

• Eliminate all plugins from your system and see if it fixes your issue. After you've fixed the issue, enable the plugins one at a time until you can decide which one of them needs an update by the developer.
• Troubleshoot and identify JavaScript difficulties within your browser.

Summary

We've selected the most thrilling enhancements and features that are available in WordPress 5.3.

The 13th edition of the Gutenberg plugin has been added to the core. Additionally, it includes enhancements to its Site Health Tool, a completely new default theme, changes to the admin interface as well as various new functions and features for developers and designers, as well as increased performance due to PHP 7.4 as well as a myriad of small adjustments, bug fixes and deprecations. WordPress 5.3 marks a major stage in the development of this CMS.

What are your favorite features/improvements? Did you notice that you've missed something crucial? Tell us about your experiences by leaving a comment.

Cut down on time and expenses and increase the performance of websites

• Support is readily available from WordPress hosting experts 24/7.
• Cloudflare Enterprise integration.
• The audience's reach is enhanced by 34 data centers worldwide.
• Optimization through the application's integrated Performance Monitoring.

The post first appeared on this site

This post was first seen on here