customizer.js 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. /**
  2. * Theme Customizer enhancements for a better user experience.
  3. *
  4. * Contains handlers to make Theme Customizer preview reload changes asynchronously.
  5. */
  6. ( function( $ ) {
  7. // Site title and description.
  8. wp.customize( 'blogname', function( value ) {
  9. value.bind( function( to ) {
  10. $( '.site-title a' ).text( to );
  11. } );
  12. } );
  13. wp.customize( 'blogdescription', function( value ) {
  14. value.bind( function( to ) {
  15. $( '.site-description' ).text( to );
  16. } );
  17. } );
  18. // Header text color.
  19. wp.customize( 'header_textcolor', function( value ) {
  20. value.bind( function( to ) {
  21. if ( 'blank' === to ) {
  22. $( '.site-title, .site-description, #hero-header #hero-social-navigation' ).css( {
  23. 'clip': 'rect(1px, 1px, 1px, 1px)',
  24. 'position': 'absolute'
  25. } );
  26. } else {
  27. if ( '#333332' === to ) {
  28. $( '#independent-publisher-2-custom-header-css' ).remove();
  29. $( '.site-title, .site-description, .site-header .social-navigation li a, .site-header .menu-toggle' ).removeAttr( 'style' )
  30. } else {
  31. $( '.site-title, .site-description, .site-header .social-navigation li a, .site-header .menu-toggle' ).css( {
  32. 'clip': 'auto',
  33. 'color': to,
  34. 'position': 'relative'
  35. } );
  36. $( '.site-header .menu-toggle' ).css( {
  37. 'border-color': to
  38. } );
  39. $( '.site-header .social-navigation, #hero-header #hero-social-navigation' ).css( {
  40. 'clip': 'auto',
  41. 'position': 'relative'
  42. } );
  43. $( '.site-description' ).css( {
  44. 'opacity' : 0.8
  45. } );
  46. }
  47. }
  48. } );
  49. } );
  50. } )( jQuery );