wp-content/themes/twentysixteen/js/customize-preview.js

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