jetpack_mobile_css_settings

Adds an option to allow your Custom CSS to also be applied to the Mobile Theme.

Description

jetpack_mobile_css_settings(); 

It's disabled by default, but this should allow people who know what they're doing to customize the mobile theme.


Usage

  1. if ( !function_exists( 'jetpack_mobile_css_settings' ) ) { 
  2. require_once ABSPATH . PLUGINDIR . 'jetpack-by-wordpress-com/modules/minileven/minileven.php'; 
  3.  
  4.  
  5. // NOTICE! Understand what this does before running. 
  6. $result = jetpack_mobile_css_settings(); 
  7.  

Defined (1)

The function is defined in the following location(s).

/modules/minileven/minileven.php  
  1. function jetpack_mobile_css_settings() { 
  2. $mobile_css = get_option( 'wp_mobile_custom_css' ); 
  3.  
  4. ?> 
  5. <div class="misc-pub-section"> 
  6. <label><?php esc_html_e( 'Mobile-compatible:', jetpack ); ?></label> 
  7. <span id="mobile-css-display"><?php echo $mobile_css ? __( 'Yes', jetpack ) : __( 'No', jetpack ); ?></span> 
  8. <a class="edit-mobile-css hide-if-no-js" href="#mobile-css"><?php echo esc_html_e( 'Edit', jetpack ); ?></a> 
  9. <div id="mobile-css-select" class="hide-if-js"> 
  10. <input type="hidden" name="mobile_css" id="mobile-css" value="<?php echo intval( $mobile_css ); ?>" /> 
  11. <label> 
  12. <input type="checkbox" id="mobile-css-visible" <?php checked( get_option( 'wp_mobile_custom_css' ) ); ?> /> 
  13. <?php esc_html_e( 'Include this CSS in the Mobile Theme', jetpack ); ?> 
  14. </label> 
  15. <p> 
  16. <a class="save-mobile-css hide-if-no-js button" href="#mobile-css"><?php esc_html_e( 'OK', jetpack ); ?></a> 
  17. <a class="cancel-mobile-css hide-if-no-js" href="#mobile-css"><?php esc_html_e( 'Cancel', jetpack ); ?></a> 
  18. </p> 
  19. </div> 
  20. </div> 
  21. <script type="text/javascript"> 
  22. jQuery( function ( $ ) { 
  23. $( '.edit-mobile-css' ).bind( 'click', function ( e ) { 
  24. e.preventDefault(); 
  25.  
  26. $( '#mobile-css-select' ).slideDown(); 
  27. $( this ).hide(); 
  28. } ); 
  29.  
  30. $( '.cancel-mobile-css' ).bind( 'click', function ( e ) { 
  31. e.preventDefault(); 
  32.  
  33. $( '#mobile-css-select' ).slideUp( function () { 
  34. $( '.edit-mobile-css' ).show(); 
  35.  
  36. $( '#mobile-css-visible' ).prop( 'checked', $( '#mobile-css' ).val() == '1' ); 
  37. } ); 
  38. } ); 
  39.  
  40. $( '.save-mobile-css' ).bind( 'click', function ( e ) { 
  41. e.preventDefault(); 
  42.  
  43. $( '#mobile-css-select' ).slideUp(); 
  44. $( '#mobile-css-display' ).text( $( '#mobile-css-visible' ).prop( 'checked' ) ? 'Yes' : 'No' ); 
  45. $( '#mobile-css' ).val( $( '#mobile-css-visible' ).prop( 'checked' ) ? '1' : '0' ); 
  46. $( '.edit-mobile-css' ).show(); 
  47. } ); 
  48. } ); 
  49. </script> 
  50. <?php