| @@ -6,18 +6,20 @@ | ||
| 6 | 6 | /** |
| 7 | 7 | * Function to render the advanced panel. |
| 8 | 8 | */ |
| 9 | 9 | function ao_ccss_render_adv() { |
| 10 | - // Attach required globals. | |
| 11 | - global $ao_ccss_debug; | |
| 12 | - global $ao_ccss_finclude; | |
| 13 | - global $ao_ccss_rlimit; | |
| 14 | - global $ao_ccss_noptimize; | |
| 15 | - global $ao_ccss_loggedin; | |
| 16 | - global $ao_ccss_forcepath; | |
| 17 | - global $ao_ccss_deferjquery; | |
| 18 | - global $ao_ccss_domain; | |
| 10 | + $criticalcss = autoptimize()->criticalcss(); | |
| 19 | 11 | |
| 12 | + $ao_ccss_debug = esc_attr( $criticalcss->get_option( 'debug' ) ); | |
| 13 | + $ao_ccss_finclude = esc_textarea( $criticalcss->get_option( 'finclude' ) ); | |
| 14 | + $ao_ccss_rtimelimit = esc_attr( $criticalcss->get_option( 'rtimelimit' ) ); | |
| 15 | + $ao_ccss_noptimize = esc_attr( $criticalcss->get_option( 'noptimize' ) ); | |
| 16 | + $ao_ccss_loggedin = esc_attr( $criticalcss->get_option( 'loggedin' ) ); | |
| 17 | + $ao_ccss_forcepath = esc_attr( $criticalcss->get_option( 'forcepath' ) ); | |
| 18 | + $ao_ccss_deferjquery = esc_attr( $criticalcss->get_option( 'deferjquery' ) ); | |
| 19 | + $ao_ccss_domain = esc_attr( $criticalcss->get_option( 'domain' ) ); | |
| 20 | + $ao_ccss_unloadccss = esc_attr( $criticalcss->get_option( 'unloadccss' ) ); | |
| 21 | + | |
| 20 | 22 | // In case domain is not set yet (done in cron.php). |
| 21 | 23 | if ( empty( $ao_ccss_domain ) ) { |
| 22 | 24 | $ao_ccss_domain = get_site_url(); |
| 23 | 25 | } |
| @@ -22,13 +24,13 @@ | ||
| 22 | 24 | $ao_ccss_domain = get_site_url(); |
| 23 | 25 | } |
| 24 | 26 | |
| 25 | 27 | // Get viewport size. |
| 26 | - $viewport = autoptimizeCriticalCSSCore::ao_ccss_viewport(); | |
| 27 | -?> | |
| 28 | + $viewport = $criticalcss->viewport(); | |
| 29 | + ?> | |
| 28 | 30 | <ul id="adv-panel"> |
| 29 | 31 | <li class="itemDetail"> |
| 30 | - <h2 class="itemTitle fleft"><?php _e( 'Advanced Settings', 'autoptimize' ); ?></h2> | |
| 32 | + <h2 class="itemTitle fleft"><?php esc_html_e( 'Advanced Settings', 'autoptimize' ); ?></h2> | |
| 31 | 33 | <button type="button" class="toggle-btn"> |
| 32 | 34 | <span class="toggle-indicator dashicons dashicons-arrow-up dashicons-arrow-down"></span> |
| 33 | 35 | </button> |
| 34 | 36 | <div class="collapsible hidden"> |
| @@ -34,13 +36,13 @@ | ||
| 34 | 36 | <div class="collapsible hidden"> |
| 35 | 37 | <table id="key" class="form-table"> |
| 36 | 38 | <tr> |
| 37 | 39 | <th scope="row"> |
| 38 | - <?php _e( 'Viewport Size', 'autoptimize' ); ?> | |
| 40 | + <?php esc_html_e( 'Viewport Size', 'autoptimize' ); ?> | |
| 39 | 41 | </th> |
| 40 | 42 | <td> |
| 41 | - <label for="autoptimize_ccss_vw"><?php _e( 'Width', 'autoptimize' ); ?>:</label> <input type="number" id="autoptimize_ccss_vw" name="autoptimize_ccss_viewport[w]" min="800" max="4096" placeholder="1400" value="<?php echo $viewport['w']; ?>" /> | |
| 42 | - <label for="autoptimize_ccss_vh"><?php _e( 'Height', 'autoptimize' ); ?>:</label> <input type="number" id="autoptimize_ccss_vh" name="autoptimize_ccss_viewport[h]" min="600" max="2160" placeholder="1080" value="<?php echo $viewport['h']; ?>" /> | |
| 43 | + <label for="autoptimize_ccss_vw"><?php esc_html_e( 'Width', 'autoptimize' ); ?>:</label> <input type="number" id="autoptimize_ccss_vw" name="autoptimize_ccss_viewport[w]" min="800" max="4096" placeholder="1400" value="<?php echo esc_attr( $viewport['w'] ); ?>" /> | |
| 44 | + <label for="autoptimize_ccss_vh"><?php esc_html_e( 'Height', 'autoptimize' ); ?>:</label> <input type="number" id="autoptimize_ccss_vh" name="autoptimize_ccss_viewport[h]" min="600" max="2160" placeholder="1080" value="<?php echo esc_attr( $viewport['h'] ); ?>" /> | |
| 43 | 45 | <p class="notes"> |
| 44 | 46 | <?php _e( '<a href="https://criticalcss.com/account/api-keys?aff=1" target="_blank">criticalcss.com</a> default viewport size is 1400x1080 pixels (width x height). You can change this size by typing a desired width and height values above. Allowed value ranges are from 800 to 4096 for width and from 600 to 2160 for height.', 'autoptimize' ); ?> |
| 45 | 47 | </p> |
| 46 | 48 | </td> |
| @@ -46,12 +48,12 @@ | ||
| 46 | 48 | </td> |
| 47 | 49 | </tr> |
| 48 | 50 | <tr> |
| 49 | 51 | <th scope="row"> |
| 50 | - <?php _e( 'Force Include CSS selectors', 'autoptimize' ); ?> | |
| 52 | + <?php esc_html_e( 'Force Include CSS selectors', 'autoptimize' ); ?> | |
| 51 | 53 | </th> |
| 52 | 54 | <td> |
| 53 | - <textarea id="autoptimize_ccss_finclude" name="autoptimize_ccss_finclude" rows='3' maxlenght='500' style="width:100%;" placeholder="<?php _e( '.button-special,//#footer', 'autoptimize' ); ?>"><?php echo trim( $ao_ccss_finclude ); ?></textarea> | |
| 55 | + <textarea id="autoptimize_ccss_finclude" name="autoptimize_ccss_finclude" rows='3' maxlenght='500' style="width:100%;" placeholder="<?php esc_html_e( '.button-special,//#footer', 'autoptimize' ); ?>"><?php echo trim( esc_textarea( $ao_ccss_finclude ) ); ?></textarea> | |
| 54 | 56 | <p class="notes"> |
| 55 | 57 | <?php _e( 'Force include CSS selectors can be used to style dynamic content that is not part of the HTML that is seen during the Critical CSS generation. To use this feature, add comma separated values with both simple strings and/or regular expressions to match the desired selectors. Regular expressions must be preceeded by two forward slashes. For instance: <code>.button-special,//#footer</code>. In this example <code>.button-special</code> will match <code>.button-special</code> selector only, while <code>//#footer</code> will match <code>#footer</code>, <code>#footer-address</code> and <code>#footer-phone</code> selectors in case they exist.<br />Do take into account that changing this setting will only affect new/ updated rules, so you might want to remove old rules and clear your page cache to expedite the forceIncludes becoming used.', 'autoptimize' ); ?> |
| 56 | 58 | </p> |
| 57 | 59 | </td> |
| @@ -57,75 +59,89 @@ | ||
| 57 | 59 | </td> |
| 58 | 60 | </tr> |
| 59 | 61 | <tr> |
| 60 | 62 | <th scope="row"> |
| 61 | - <?php _e( 'Request Limit', 'autoptimize' ); ?> | |
| 63 | + <?php esc_html_e( 'Queue processing time limit', 'autoptimize' ); ?> | |
| 62 | 64 | </th> |
| 63 | 65 | <td> |
| 64 | - <input type="number" id="autoptimize_ccss_rlimit" name="autoptimize_ccss_rlimit" min="1" max="240" placeholder="0" value="<?php echo $ao_ccss_rlimit; ?>" /> | |
| 66 | + <input type="number" id="autoptimize_ccss_rtimelimit" name="autoptimize_ccss_rtimelimit" min="0" max="240" placeholder="0" value="<?php echo $ao_ccss_rtimelimit; ?>" /> | |
| 65 | 67 | <p class="notes"> |
| 66 | - <?php _e( 'Certain hosting services impose hard limitations to background processes on either execution time, requests made from your server to any third party services, or both. This could lead to a faulty operation of the queue background process triggered by WP-Cron. If automated rules are not being created, you may be facing this limitation from your hosting provider. In that case, set the request limit to a reasonable number between 1 and 240. The queue fire a request to <a href="https://criticalcss.com/account/api-keys?aff=1" target="_blank">criticalcss.com</a> on every 15 seconds (due to service limitations). If your hosting provider allows a 60 seconds time span to background processes runtime, set this value to 3 or 4 so the queue can operate within the boundaries. The maximum value of 240 allows enough requests for one hour long. To disable this limit and to let requests be made at will, just delete any values in this setting (a grey 0 will show).', 'autoptimize' ); ?> | |
| 68 | + <?php esc_html_e( 'The cronned queue processing is an asynchronous process triggerd by (WordPress) cron. To avoid this process from running too long and potentially getting killed, you can set the number of seconds here, 0 means no limit.', 'autoptimize' ); ?> | |
| 67 | 69 | </p> |
| 68 | 70 | </td> |
| 69 | 71 | </tr> |
| 70 | 72 | <tr> |
| 71 | 73 | <th scope="row"> |
| 72 | - <?php _e( 'Fetch Original CSS', 'autoptimize' ); ?> | |
| 74 | + <?php esc_html_e( 'Fetch Original CSS', 'autoptimize' ); ?> | |
| 73 | 75 | </th> |
| 74 | 76 | <td> |
| 75 | 77 | <input type="checkbox" id="autoptimize_ccss_noptimize" name="autoptimize_ccss_noptimize" value="1" <?php checked( 1 == $ao_ccss_noptimize ); ?>> |
| 76 | 78 | <p class="notes"> |
| 77 | - <?php _e( 'In some (rare) cases the generation of critical CSS works better with the original CSS instead of the Autoptimized one, this option enables that behavior.', 'autoptimize' ); ?> | |
| 79 | + <?php esc_html_e( 'In some (rare) cases the generation of critical CSS works better with the original CSS instead of the Autoptimized one, this option enables that behavior.', 'autoptimize' ); ?> | |
| 78 | 80 | </p> |
| 79 | 81 | </td> |
| 80 | 82 | </tr> |
| 81 | 83 | <tr> |
| 82 | 84 | <th scope="row"> |
| 83 | - <?php _e( 'Add CCSS for logged in users?', 'autoptimize' ); ?> | |
| 85 | + <?php esc_html_e( 'Add CCSS for logged in users?', 'autoptimize' ); ?> | |
| 84 | 86 | </th> |
| 85 | 87 | <td> |
| 86 | 88 | <input type="checkbox" id="autoptimize_ccss_loggedin" name="autoptimize_ccss_loggedin" value="1" <?php checked( 1 == $ao_ccss_loggedin ); ?>> |
| 87 | 89 | <p class="notes"> |
| 88 | - <?php _e( 'Critical CSS is generated by criticalcss.com from your pages as seen be "anonymous visitor", disable this option if you don\'t want the "visitor" critical CSS to be used for logged on users.', 'autoptimize' ); ?> | |
| 90 | + <?php esc_html_e( 'Critical CSS is generated by criticalcss.com from your pages as seen by an "anonymous visitor". Disable this option if you don\'t want the "visitor" critical CSS to be used for logged in users.', 'autoptimize' ); ?> | |
| 89 | 91 | </p> |
| 90 | 92 | </td> |
| 91 | 93 | </tr> |
| 92 | 94 | <tr> |
| 93 | 95 | <th scope="row"> |
| 94 | - <?php _e( 'Force path-based rules to be generated for pages?', 'autoptimize' ); ?> | |
| 96 | + <?php esc_html_e( 'Force path-based rules to be generated for pages?', 'autoptimize' ); ?> | |
| 95 | 97 | </th> |
| 96 | 98 | <td> |
| 97 | 99 | <input type="checkbox" id="autoptimize_ccss_forcepath" name="autoptimize_ccss_forcepath" value="1" <?php checked( 1 == $ao_ccss_forcepath ); ?>> |
| 98 | 100 | <p class="notes"> |
| 99 | - <?php _e( 'By default for each page a separate rule is generated. If your pages have (semi-)identical above the fold look and feel and you want to keep the rules lean, you can disable that so one rule is created to all pages.', 'autoptimize' ); ?> | |
| 101 | + <?php esc_html_e( 'By default for each page a separate rule is generated. If your pages have (semi-)identical above the fold look and feel and you want to keep the rules lean, you can disable that so one rule is created to all pages.', 'autoptimize' ); ?> | |
| 100 | 102 | </p> |
| 101 | 103 | </td> |
| 102 | 104 | </tr> |
| 105 | + <?php if ( 1 == $ao_ccss_deferjquery ) { ?> | |
| 103 | 106 | <tr> |
| 104 | 107 | <th scope="row"> |
| 105 | - <?php _e( 'Defer jQuery and other non-aggregated JS-files?', 'autoptimize' ); ?> | |
| 108 | + <?php esc_html_e( 'Defer jQuery and other non-aggregated JS-files? (deprecated)', 'autoptimize' ); ?> | |
| 106 | 109 | </th> |
| 107 | 110 | <td> |
| 108 | 111 | <input type="checkbox" id="autoptimize_ccss_deferjquery" name="autoptimize_ccss_deferjquery" value="1" <?php checked( 1 == $ao_ccss_deferjquery ); ?>> |
| 109 | 112 | <p class="notes"> |
| 110 | - <?php _e( 'Defer all non-aggregated JS, including jQuery and inline JS to fix remaining render-blocking issues. Make sure to test your site thoroughly when activating this option!', 'autoptimize' ); ?> | |
| 113 | + <?php esc_html_e( 'Defer all non-aggregated JS, including jQuery and inline JS to fix remaining render-blocking issues. Make sure to test your site thoroughly when activating this option!', 'autoptimize' ); ?> | |
| 114 | + <?php esc_html_e( '<b>This functionality will be removed in a next major version of Autoptimize</b>, being replaced by the combination of the "do not aggregate but defer JS" + "defer inline JS" options on the main settings page.', 'autoptimize' ); ?> | |
| 111 | 115 | </p> |
| 112 | 116 | </td> |
| 113 | 117 | </tr> |
| 118 | + <?php } ?> | |
| 114 | 119 | <tr> |
| 115 | 120 | <th scope="row"> |
| 116 | - <?php _e( 'Bound domain', 'autoptimize' ); ?> | |
| 121 | + <?php esc_html_e( 'Unload critical CSS after page load?', 'autoptimize' ); ?> | |
| 117 | 122 | </th> |
| 118 | 123 | <td> |
| 119 | - <input type="text" id="autoptimize_ccss_domain" name="autoptimize_ccss_domain" style="width:100%;" placeholder="<?php _e( 'Don\'t leave this empty, put e.g. https://example.net/ or simply \'none\' to disable domain binding.', 'autoptimize' ); ?>" value="<?php echo trim( $ao_ccss_domain ); ?>"> | |
| 124 | + <input type="checkbox" id="autoptimize_ccss_unloadccss" name="autoptimize_ccss_unloadccss" value="1" <?php checked( 1 == $ao_ccss_unloadccss ); ?>> | |
| 120 | 125 | <p class="notes"> |
| 121 | - <?php _e( 'Only requests from this domain will be sent for Critical CSS generation (pricing is per domain/ month).', 'autoptimize' ); ?> | |
| 126 | + <?php esc_html_e( 'In rare cases the critical CSS needs to be removed once the full CSS loads, this option makes it so!', 'autoptimize' ); ?> | |
| 122 | 127 | </p> |
| 123 | 128 | </td> |
| 124 | 129 | </tr> |
| 125 | 130 | <tr> |
| 126 | 131 | <th scope="row"> |
| 127 | - <?php _e( 'Debug Mode', 'autoptimize' ); ?> | |
| 132 | + <?php esc_html_e( 'Bound domain', 'autoptimize' ); ?> | |
| 133 | + </th> | |
| 134 | + <td> | |
| 135 | + <input type="text" id="autoptimize_ccss_domain" name="autoptimize_ccss_domain" style="width:100%;" placeholder="<?php esc_html_e( 'Don\'t leave this empty, put e.g. https://example.net/ or simply \'none\' to disable domain binding.', 'autoptimize' ); ?>" value="<?php echo trim( esc_attr( $ao_ccss_domain ) ); ?>"> | |
| 136 | + <p class="notes"> | |
| 137 | + <?php esc_html_e( 'Only requests from this domain will be sent for Critical CSS generation (pricing is per domain/ month).', 'autoptimize' ); ?> | |
| 138 | + </p> | |
| 139 | + </td> | |
| 140 | + </tr> | |
| 141 | + <tr> | |
| 142 | + <th scope="row"> | |
| 143 | + <?php esc_html_e( 'Debug Mode', 'autoptimize' ); ?> | |
| 128 | 144 | </th> |
| 129 | 145 | <td> |
| 130 | 146 | <input type="checkbox" id="autoptimize_ccss_debug" name="autoptimize_ccss_debug" value="1" <?php checked( 1 == $ao_ccss_debug ); ?>> |
| 131 | 147 | <p class="notes"> |
