| @@ -31,13 +31,14 @@ | ||
| 31 | 31 | type="checkbox" |
| 32 | 32 | id="enable_unused_css" |
| 33 | 33 | value="1" |
| 34 | 34 | <?php checked($wpo_minify_options['enable_unused_css']); ?> |
| 35 | - <?php disabled($show_unused_css_advertise); ?> | |
| 35 | + <?php disabled($show_unused_css_advertise || !$is_page_cache_enabled); ?> | |
| 36 | 36 | > |
| 37 | 37 | <?php esc_html_e('Enable removal of unused rules from CSS files (Experimental)', 'wp-optimize'); ?> |
| 38 | + <em class="<?php if ($is_page_cache_enabled || $show_unused_css_advertise) echo esc_attr('wpo_hidden'); ?>"><?php esc_html_e('This option is available only when page cache is enabled.', 'wp-optimize'); ?></em> | |
| 38 | 39 | </label> |
| 39 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('If some of the design is breaking on the frontend, disabling removal of unused CSS rules might fix the issues.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 40 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e('If some of the design is breaking on the frontend, disabling removal of unused CSS rules might fix the issues.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 40 | 41 | <?php if ($show_unused_css_advertise) : ?> |
| 41 | 42 | <div class="wpo-inline-advertise"> |
| 42 | 43 | <a class="" href="https://teamupdraft.com/wp-optimize/pricing/?utm_source=wpo-plugin&utm_medium=referral&utm_campaign=paac&utm_creative_format=overlay&utm_content=remove-unused-css" target="_blank"><?php esc_html_e('Upgrade to WP-Optimize Premium to unlock this feature.', 'wp-optimize'); ?></a> |
| 43 | 44 | </div> |
| @@ -53,9 +54,9 @@ | ||
| 53 | 54 | <?php echo checked($wpo_minify_options['enable_merging_of_css']); ?> |
| 54 | 55 | > |
| 55 | 56 | <?php esc_html_e('Enable merging of CSS files', 'wp-optimize'); ?> |
| 56 | 57 | </label> |
| 57 | - <span tabindex="0" data-tooltip="<?php echo esc_attr($tooltip); ?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 58 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php echo esc_attr($tooltip); ?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 58 | 59 | </div> |
| 59 | 60 | <div class="wpo-fieldgroup__subgroup"> |
| 60 | 61 | <label for="inline_css" class="label-with-tooltip"> |
| 61 | 62 | <input |
| @@ -66,9 +67,9 @@ | ||
| 66 | 67 | <?php echo checked($wpo_minify_options['inline_css']); ?> |
| 67 | 68 | > |
| 68 | 69 | <?php esc_html_e('Inline CSS', 'wp-optimize'); ?> - <?php esc_html_e('Recommended if the CSS files are small enough.', 'wp-optimize'); ?> |
| 69 | 70 | </label> |
| 70 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('When enabled, small CSS files will be inlined.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 71 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e('When enabled, small CSS files will be inlined.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 71 | 72 | </div> |
| 72 | 73 | <div class="wpo-fieldgroup__subgroup"> |
| 73 | 74 | <label for="remove_print_mediatypes" class="label-with-tooltip"> |
| 74 | 75 | <input |
| @@ -79,9 +80,9 @@ | ||
| 79 | 80 | <?php echo checked($wpo_minify_options['remove_print_mediatypes']); ?> |
| 80 | 81 | > |
| 81 | 82 | <?php esc_html_e('Strip the "print" related stylesheets', 'wp-optimize'); ?> |
| 82 | 83 | </label> |
| 83 | - <span tabindex="0" data-tooltip='<?php esc_attr_e('When selected, any CSS files with the media type "print" will be removed.', 'wp-optimize');?> <?php esc_html_e('Enable if your site does not need specific print styles.', 'wp-optimize');?>'><span class="dashicons dashicons-editor-help"></span> </span> | |
| 84 | + <span tabindex="0" class="wpo-tooltip" data-tooltip='<?php esc_attr_e('When selected, any CSS files with the media type "print" will be removed.', 'wp-optimize');?> <?php esc_html_e('Enable if your site does not need specific print styles.', 'wp-optimize');?>'><span class="dashicons dashicons-editor-help"></span> </span> | |
| 84 | 85 | </div> |
| 85 | 86 | <?php if (WP_OPTIMIZE_SHOW_MINIFY_ADVANCED) : ?> |
| 86 | 87 | <div class="wpo-fieldgroup__subgroup"> |
| 87 | 88 | <label for="remove_css"> |
| @@ -93,9 +94,9 @@ | ||
| 93 | 94 | <?php echo checked($wpo_minify_options['remove_css']); ?> |
| 94 | 95 | > |
| 95 | 96 | <?php esc_html_e('Dequeue all CSS files', 'wp-optimize'); ?> |
| 96 | 97 | </label> |
| 97 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('This is useful if you want to test your critical path CSS', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 98 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e('This is useful if you want to test your critical path CSS', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 98 | 99 | </div> |
| 99 | 100 | <?php endif; ?> |
| 100 | 101 | </fieldset> |
| 101 | 102 | </div> |
| @@ -102,22 +103,24 @@ | ||
| 102 | 103 | |
| 103 | 104 | <h3><?php esc_html_e('Exclude the following CSS files from processing', 'wp-optimize'); ?></h3> |
| 104 | 105 | <div class="wpo-fieldgroup"> |
| 105 | 106 | <fieldset> |
| 106 | - <label class="wpo-label__bold" for="exclude_css"> | |
| 107 | - <?php esc_html_e('Any CSS files that match the paths below will be completely ignored.', 'wp-optimize'); ?> | |
| 108 | - <br><?php esc_html_e('Use this if you are having issues with a specific CSS file', 'wp-optimize'); ?> | |
| 109 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('Any file present here will be loaded normally by WordPress', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span> | |
| 110 | - </label> | |
| 111 | - <textarea | |
| 112 | - name="exclude_css" | |
| 113 | - rows="7" cols="50" | |
| 114 | - id="exclude_css" | |
| 115 | - class="large-text code" | |
| 116 | - placeholder="<?php esc_attr_e('e.g.: /bootstrap.css', 'wp-optimize'); ?>" | |
| 117 | - ><?php echo esc_textarea($wpo_minify_options['exclude_css']);?></textarea> | |
| 118 | - <br> | |
| 119 | - <?php esc_html_e('Some files known for causing issues when combined / minified are excluded by default.', 'wp-optimize'); ?> <?php esc_html_e('You can see / edit them in the Advanced tab.', 'wp-optimize'); ?> | |
| 107 | + <div class="wpo-fieldgroup__subgroup"> | |
| 108 | + <label class="wpo-label__bold" for="exclude_css"> | |
| 109 | + <?php esc_html_e('Any CSS files that match the paths below will be completely ignored.', 'wp-optimize'); ?> | |
| 110 | + <br><?php esc_html_e('Use this if you are having issues with a specific CSS file', 'wp-optimize'); ?> | |
| 111 | + </label> | |
| 112 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e('Any file present here will be loaded normally by WordPress', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span> | |
| 113 | + <textarea | |
| 114 | + name="exclude_css" | |
| 115 | + rows="7" cols="50" | |
| 116 | + id="exclude_css" | |
| 117 | + class="large-text code" | |
| 118 | + placeholder="<?php esc_attr_e('e.g.: /bootstrap.css', 'wp-optimize'); ?>" | |
| 119 | + ><?php echo esc_textarea($wpo_minify_options['exclude_css']);?></textarea> | |
| 120 | + <br> | |
| 121 | + <?php esc_html_e('Some files known for causing issues when combined / minified are excluded by default.', 'wp-optimize'); ?> <?php esc_html_e('You can see / edit them in the Advanced tab.', 'wp-optimize'); ?> | |
| 122 | + </div> | |
| 120 | 123 | </fieldset> |
| 121 | 124 | </div> |
| 122 | 125 | |
| 123 | 126 | <h3><?php esc_html_e('Load the following CSS files asynchronously', 'wp-optimize'); ?></h3> |
| @@ -122,22 +125,24 @@ | ||
| 122 | 125 | |
| 123 | 126 | <h3><?php esc_html_e('Load the following CSS files asynchronously', 'wp-optimize'); ?></h3> |
| 124 | 127 | <div class="wpo-fieldgroup"> |
| 125 | 128 | <fieldset> |
| 126 | - <label class="wpo-label__bold" for="async_css"> | |
| 127 | - <?php esc_html_e('Any CSS files that match the paths below will be loaded asynchronously.', 'wp-optimize'); ?><br> | |
| 128 | - <?php esc_html_e('Use this if you have a completely independent stylesheet', 'wp-optimize'); ?> | |
| 129 | - <span tabindex="0" data-tooltip="<?php esc_attr_e("e.g. You may want to exclude 'fontawesome' or other libraries from the initial load", 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span> | |
| 130 | - </label> | |
| 131 | - <textarea | |
| 132 | - name="async_css" | |
| 133 | - rows="7" | |
| 134 | - cols="50" | |
| 135 | - id="async_css" | |
| 136 | - class="large-text code" | |
| 137 | - placeholder="<?php esc_attr_e('e.g.: /wp-content/themes/my-theme/css/custom-font.css', 'wp-optimize'); ?>" | |
| 138 | - ><?php echo esc_textarea($wpo_minify_options['async_css']); ?></textarea> | |
| 139 | 129 | <div class="wpo-fieldgroup__subgroup"> |
| 130 | + <label class="wpo-label__bold" for="async_css"> | |
| 131 | + <?php esc_html_e('Any CSS files that match the paths below will be loaded asynchronously.', 'wp-optimize'); ?><br> | |
| 132 | + <?php esc_html_e('Use this if you have a completely independent stylesheet', 'wp-optimize'); ?> | |
| 133 | + </label> | |
| 134 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e("e.g. You may want to exclude 'fontawesome' or other libraries from the initial load", 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span> | |
| 135 | + <textarea | |
| 136 | + name="async_css" | |
| 137 | + rows="7" | |
| 138 | + cols="50" | |
| 139 | + id="async_css" | |
| 140 | + class="large-text code" | |
| 141 | + placeholder="<?php esc_attr_e('e.g.: /wp-content/themes/my-theme/css/custom-font.css', 'wp-optimize'); ?>" | |
| 142 | + ><?php echo esc_textarea($wpo_minify_options['async_css']); ?></textarea> | |
| 143 | + </div> | |
| 144 | + <div class="wpo-fieldgroup__subgroup"> | |
| 140 | 145 | <label for="exclude_css_from_page_speed_tools"> |
| 141 | 146 | <input |
| 142 | 147 | name="exclude_css_from_page_speed_tools" |
| 143 | 148 | type="checkbox" |
| @@ -146,9 +151,9 @@ | ||
| 146 | 151 | <?php echo checked($wpo_minify_options['exclude_css_from_page_speed_tools']); ?> |
| 147 | 152 | > |
| 148 | 153 | <?php esc_html_e('Exclude stylesheets from page speed tests (PageSpeed Insights, GTMetrix...)', 'wp-optimize'); ?> |
| 149 | 154 | </label> |
| 150 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('Use this only for testing purpose to find out which stylesheets are slowing down your site.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span> | |
| 155 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e('Use this only for testing purpose to find out which stylesheets are slowing down your site.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span> | |
| 151 | 156 | </div> |
| 152 | 157 | </fieldset> |
| 153 | 158 | </div> |
| 154 | 159 | |
| @@ -155,22 +160,24 @@ | ||
| 155 | 160 | <?php if (WP_OPTIMIZE_SHOW_MINIFY_ADVANCED) : ?> |
| 156 | 161 | <h3><?php esc_html_e('Enable asynchronous CSS', 'wp-optimize'); ?></h3> |
| 157 | 162 | <div class="wpo-fieldgroup"> |
| 158 | 163 | <fieldset> |
| 159 | - <label for="loadcss"> | |
| 160 | - <input | |
| 161 | - name="loadcss" | |
| 162 | - type="checkbox" | |
| 163 | - id="loadcss" | |
| 164 | - value="1" | |
| 165 | - <?php echo checked($wpo_minify_options['loadcss']); ?> | |
| 166 | - > | |
| 167 | - <?php esc_html_e('Load all CSS files asynchronously', 'wp-optimize'); ?> | |
| 168 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('Note that inline CSS won\'t work if this is active', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 169 | - </label> | |
| 170 | - <p> | |
| 171 | - <?php esc_html_e('If you have multiple css files per media type, they may load out of order and break your design when loaded asynchronously.', 'wp-optimize'); ?> | |
| 172 | - </p> | |
| 164 | + <div class="wpo-fieldgroup__subgroup"> | |
| 165 | + <label for="loadcss"> | |
| 166 | + <input | |
| 167 | + name="loadcss" | |
| 168 | + type="checkbox" | |
| 169 | + id="loadcss" | |
| 170 | + value="1" | |
| 171 | + <?php echo checked($wpo_minify_options['loadcss']); ?> | |
| 172 | + > | |
| 173 | + <?php esc_html_e('Load all CSS files asynchronously', 'wp-optimize'); ?> | |
| 174 | + </label> | |
| 175 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e('Note that inline CSS won\'t work if this is active', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 176 | + <p> | |
| 177 | + <?php esc_html_e('If you have multiple css files per media type, they may load out of order and break your design when loaded asynchronously.', 'wp-optimize'); ?> | |
| 178 | + </p> | |
| 179 | + </div> | |
| 173 | 180 | </fieldset> |
| 174 | 181 | </div> |
| 175 | 182 | <?php endif; ?> |
| 176 | 183 | |
| @@ -190,28 +197,27 @@ | ||
| 190 | 197 | ><?php echo esc_textarea($wpo_minify_options['critical_path_css']); ?></textarea> |
| 191 | 198 | </fieldset> |
| 192 | 199 | |
| 193 | 200 | <fieldset> |
| 194 | - <label class="wpo-label__bold" for="critical_path_css_is_front_page"><?php esc_html_e('is_front_page (conditional)', 'wp-optimize'); ?> <span tabindex="0" data-tooltip="<?php esc_attr_e('This will be inlined after the above if your page matches the WP conditional is_front_page()', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span></label> | |
| 195 | - <textarea | |
| 196 | - name="critical_path_css_is_front_page" | |
| 197 | - rows="7" | |
| 198 | - cols="50" | |
| 199 | - id="critical_path_css_is_front_page" | |
| 200 | - class="large-text code" | |
| 201 | - placeholder=".css-code { display: block; }" | |
| 202 | - ><?php echo esc_textarea($wpo_minify_options['critical_path_css_is_front_page']); ?></textarea> | |
| 201 | + <div class="wpo-fieldgroup__subgroup"> | |
| 202 | + <label class="wpo-label__bold" for="critical_path_css_is_front_page"><?php esc_html_e('is_front_page (conditional)', 'wp-optimize'); ?></label> | |
| 203 | + <span tabindex="0" class="wpo-tooltip" data-tooltip="<?php esc_attr_e('This will be inlined after the above if your page matches the WP conditional is_front_page()', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span> | |
| 204 | + <textarea | |
| 205 | + name="critical_path_css_is_front_page" | |
| 206 | + rows="7" | |
| 207 | + cols="50" | |
| 208 | + id="critical_path_css_is_front_page" | |
| 209 | + class="large-text code" | |
| 210 | + placeholder=".css-code { display: block; }" | |
| 211 | + ><?php echo esc_textarea($wpo_minify_options['critical_path_css_is_front_page']); ?></textarea> | |
| 212 | + </div> | |
| 203 | 213 | </fieldset> |
| 204 | 214 | </div> |
| 205 | 215 | <?php endif; ?> |
| 206 | - | |
| 207 | - <p class="submit"> | |
| 208 | - <input | |
| 209 | - class="wp-optimize-save-minify-settings button button-primary" | |
| 210 | - type="submit" | |
| 211 | - value="<?php esc_attr_e('Save settings', 'wp-optimize'); ?>" | |
| 212 | - > | |
| 216 | + | |
| 217 | + <div class="wpo-save-btn-container"> | |
| 218 | + <input class="wp-optimize-save-minify-settings button button-primary" type="submit" value="<?php esc_attr_e('Save settings', 'wp-optimize'); ?>"> | |
| 213 | 219 | <img class="wpo_spinner" src="<?php echo esc_url(admin_url('images/spinner-2x.gif')); // phpcs:ignore PluginCheck.CodeAnalysis.ImageFunctions.NonEnqueuedImage -- N/A ?>" alt="..."> |
| 214 | 220 | <span class="save-done dashicons dashicons-yes display-none"></span> |
| 215 | - </p> | |
| 221 | + </div> | |
| 216 | 222 | </form> |
| 217 | 223 | </div> |
