WordPress.org

Make WordPress Core

Opened 22 months ago

Closed 16 months ago

Last modified 12 months ago

#33738 closed defect (bug) (fixed)

Quotes and other texturize characters are displayed differently in the customizer vs the front end of site

Reported by: seawaves Owned by: westonruter
Milestone: 4.5 Priority: normal
Severity: normal Version: 4.3
Component: Customize Keywords: has-patch commit
Focuses: Cc:

Description

For example, the customizer will show smart quotes when they are present in the site title, whereas the front end of the site will not for some themes.

Steps to reproduce:

  1. Change the theme to Twenty Ten
  2. Open the customizer
  3. Change the site title to something that contains a quote, for example "Site's Title". Do not save the changes yet.
  4. See that the quotes are displayed as smart quotes:

https://cldup.com/2wSkVLWhSE.png

  1. Click on 'Save & Publish'
  2. View the live site. See that the quotes are not curly on the live site:

https://cldup.com/6fjAMhnXK1.png

This was tested on a fresh installation of WordPress 4.3, with no plugins installed.

Attachments (2)

33738.0.diff (5.7 KB) - added by westonruter 16 months ago.
33738.1.diff (9.3 KB) - added by westonruter 16 months ago.

Download all attachments as: .zip

Change History (16)

#1 @westonruter
22 months ago

  • Milestone Awaiting Review deleted
  • Resolution set to wontfix
  • Status changed from new to closed

@seawaves: Thanks for the report, and you are totally right. This is actually a known issue and is to be expected given how changes to the title get previewed in the Core themes. The site title (blogname) has a postMessage transport for pushing the setting changes into the preview. This is opposed to the default refresh transport. When the refresh transport is used, whenever you change a setting the preview will do a full reload and PHP will re-generate the page with the new setting applied: this means that the PHP filters added to the site title can be applied, such as texturize. The refresh transport is slow however.

The postMessage transport is instant since it uses JavaScript to preview the change. The problem with the JavaScript preview mechanism, however, is that the logic being done in PHP has to be completely replicated and emulated on the client. As such, the postMessage transport violates the DRY principle since logic has to be written twice. What's more is that it is not possible to fully replicate all of the logic that exists in PHP since any number of plugins may add other PHP filters to how the title renders, such as making the text all uppercase.

We are actually investigating a middle-ground between postMessage transport and the refresh transport in this 4.4 release cycle: it's a sort of hybrid transport called partialRefresh. This is the mechanism that is used actually to preview changes to a menus in the Customizer in 4.3.

If a setting, such as the blogname, needs to fully make use of all the PHP filters applying to it without replicating all of the PHP logic in JS (which is not possible anyway), then in 4.4 it may be possible to use partialRefresh transport to update the blogname instead. It won't be instant preview, since an Ajax request is still required, but it will be faster than a full refresh and it will be sure to include all of the PHP logic applied by plugins.

I'll close this, but please do follow development on #27355 for updates on partialRefresh.

#2 @seawaves
22 months ago

Wow, thank you for the very detailed and quick answer @westonruter! I'm happy to hear this will be looked at for 4.4, that'll be awesome! I looked for a ticket about this in the Customize component prior to posting, sorry for the duplication.

#3 @westonruter
17 months ago

  • Milestone set to 4.5
  • Resolution wontfix deleted
  • Status changed from closed to reopened

This will be able to be fixed in 4.5 once selective refresh lands: #27355.

The question then remains as to whether Core themes should be updated to implement selective refresh for the site title and tagline.

The theme code could look like this:

<?php
add_action( 'customize_register', function( WP_Customize_Manager $wp_customize ) {
        
        // Abort if partials are not implemented.
        if ( ! method_exists( $wp_customize, 'add_partial' ) ) {
                return;
        }

        $setting = $wp_customize->get_setting( 'blogname' );
        $wp_customize->add_partial( $setting->id, array(
                'selector' => '.site-title a',
                'settings' => $setting->id, /* Note this is optional; default is to use partial ID */
                'render_callback' => function() { 
                        bloginfo( 'name' ); 
                },
        ) );
        $setting->transport = 'postMessage';

        $setting = $wp_customize->get_setting( 'blogdescription' );
        $manager->add_partial( $setting->id, array(
                'selector' => '.site-description',
                'settings' => $setting->id, /* Note this is optional; default is to use partial ID */
                'render_callback' => function() { 
                        bloginfo( 'description' ); 
                },
        ) );
        $setting->transport = 'postMessage';
}, 100 );

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


17 months ago

#5 @westonruter
16 months ago

  • Owner set to westonruter
  • Status changed from reopened to accepted

#6 @westonruter
16 months ago

  • Keywords has-patch added

33738.0.diff implements selective refresh for site title and tagline for twentyeleven, twentytwelve, twentythirteen, twentyfourteen, and twentyfifteen. Note the patch is not compatible with PHP 5.2 as is, due to the use of anonymous functions. I wasn't sure how the render_callback functions should be named across these themes. I did end up creating twentysixteen_customize_partial_blogname() and twentysixteen_customize_partial_blogdescription() in the PR for twentysixteen: https://github.com/WordPress/twentysixteen/pull/428

#7 @westonruter
16 months ago

Alright, 33738.1.diff implements the full-on PHP 5.2-compatible render_callback functions.

#8 @westonruter
16 months ago

  • Owner changed from westonruter to karmatosed
  • Status changed from accepted to assigned

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


16 months ago

#10 @karmatosed
16 months ago

@westonruter looks good for Twenty Sixteen. I merged it into Twenty Sixteen on GitHub.

Last edited 16 months ago by karmatosed (previous) (diff)

#11 @karmatosed
16 months ago

Patch for other defaults looks good to @westonruter.

#12 @westonruter
16 months ago

  • Keywords commit added
  • Owner changed from karmatosed to westonruter
  • Status changed from assigned to accepted

#13 @westonruter
16 months ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 36797:

Customize: Use selective refresh to preview changes to site title and tagline in core themes.

Fixes issue where wptexturize and other filters fail to apply when previewing changes via postMessage transport.

See #27355.
Fixes #33738.

This ticket was mentioned in Slack in #core-customize by westonruter. View the logs.


12 months ago

Note: See TracTickets for help on using tickets.