customize-preview.js 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. /**
  2. * Live-update changed settings in real time in the Customizer preview.
  3. */
  4. ( function( $ ) {
  5. var style = $( '#twentysixteen-color-scheme-css' ),
  6. api = wp.customize;
  7. if ( ! style.length ) {
  8. style = $( 'head' ).append( '<style type="text/css" id="twentysixteen-color-scheme-css" />' )
  9. .find( '#twentysixteen-color-scheme-css' );
  10. }
  11. // Site title.
  12. api( 'blogname', function( value ) {
  13. value.bind( function( to ) {
  14. $( '.site-title a' ).text( to );
  15. } );
  16. } );
  17. // Site tagline.
  18. api( 'blogdescription', function( value ) {
  19. value.bind( function( to ) {
  20. $( '.site-description' ).text( to );
  21. } );
  22. } );
  23. // Add custom-background-image body class when background image is added.
  24. api( 'background_image', function( value ) {
  25. value.bind( function( to ) {
  26. $( 'body' ).toggleClass( 'custom-background-image', '' !== to );
  27. } );
  28. } );
  29. // Color Scheme CSS.
  30. api.bind( 'preview-ready', function() {
  31. api.preview.bind( 'update-color-scheme-css', function( css ) {
  32. style.html( css );
  33. } );
  34. } );
  35. } )( jQuery );