| @@ -1,32 +1,43 @@ | ||
| 1 | -<?php if (!defined('WPO_VERSION')) die('No direct access.'); ?> | |
| 2 | -<div class='wpo_smush_single_image compression_level' style="<?php echo esc_attr($smush_display); ?>"> | |
| 3 | - <label for="enable_lossy_compression"> | |
| 4 | - <input type="radio" id="enable_lossy_compression" name="compression_level" class="smush-options compression_level" <?php checked($smush_options['image_quality'], 60); ?>> | |
| 5 | - <?php esc_html_e('Prioritize maximum compression', 'wp-optimize');?> | |
| 6 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('Potentially uses lossy compression to ensure maximum savings per image, the resulting images are of a slightly lower quality', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 7 | - </label> | |
| 8 | - <label for="enable_lossless_compression"> | |
| 9 | - <input type="radio" id="enable_lossless_compression" name="compression_level" class="smush-options compression_level" <?php checked($smush_options['image_quality'], 92); ?>> | |
| 10 | - <?php esc_html_e('Prioritize retention of detail', 'wp-optimize');?> | |
| 11 | - <span tabindex="0" data-tooltip="<?php esc_attr_e('Uses lossless compression, which results in much better image quality but lower filesize savings per image', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 12 | - </label> | |
| 13 | - <label for="enable_custom_compression"> | |
| 14 | - <input id="enable_custom_compression" type="radio" name="compression_level" class="smush-options compression_level" <?php checked($custom); ?>> | |
| 15 | - <?php esc_html_e('Custom', 'wp-optimize');?> | |
| 16 | - </label> | |
| 17 | - <div class="smush-options custom_compression" <?php if (!$custom) echo 'style="display:none;"';?>> | |
| 18 | - <span class="alignleft"><?php esc_html_e('Maximum compression', 'wp-optimize');?></span> | |
| 19 | - <input id="custom_compression_slider" class="compression_level" data-max="<?php esc_attr_e('Maximum Compression', 'wp-optimize'); ?>" type="range" step="5" value="<?php echo intval($smush_options['image_quality']); ?>" min="65" max="90" list="number" /> | |
| 20 | - <datalist id="number"> | |
| 21 | - <option value="65"/> | |
| 22 | - <option value="70"/> | |
| 23 | - <option value="75"/> | |
| 24 | - <option value="80"/> | |
| 25 | - <option value="85"/> | |
| 26 | - <option value="90"/> | |
| 27 | - </datalist> | |
| 28 | - <span class="alignright"><?php esc_html_e('Best image quality', 'wp-optimize');?></span> | |
| 1 | +<?php if (!defined('ABSPATH')) die('No direct access allowed'); ?> | |
| 2 | +<div class='wpo_smush_single_image compression_level wpo-fieldgroup' style="<?php echo esc_attr($smush_display); ?>"> | |
| 3 | + <div class="wpo-fieldgroup__subgroup"> | |
| 4 | + <label for="enable_lossy_compression"> | |
| 5 | + <input type="radio" id="enable_lossy_compression" name="compression_level" class="smush-options compression_level" <?php checked($smush_options['image_quality'], 60); ?>> | |
| 6 | + <?php esc_html_e('Prioritize maximum compression', 'wp-optimize');?> | |
| 7 | + </label> | |
| 8 | + <?php | |
| 9 | + $message = __('Uses lossy compression to ensure maximum savings per image.', 'wp-optimize'); | |
| 10 | + $message .= ' '; | |
| 11 | + $message .= __('The resulting images are of a slightly lower quality', 'wp-optimize'); | |
| 12 | + ?> | |
| 13 | + <span tabindex="0" title="<?php echo esc_attr($message); ?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 14 | + </div> | |
| 15 | + <div class="wpo-fieldgroup__subgroup"> | |
| 16 | + <label for="enable_lossless_compression"> | |
| 17 | + <input type="radio" id="enable_lossless_compression" name="compression_level" class="smush-options compression_level" <?php checked($smush_options['image_quality'], 92); ?>> | |
| 18 | + <?php esc_html_e('Prioritize retention of detail', 'wp-optimize');?> | |
| 19 | + </label> | |
| 20 | + <span tabindex="0" title="<?php esc_attr_e('Uses lossless compression, which results in much better image quality but lower file size savings per image', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span> | |
| 21 | + </div> | |
| 22 | + <div class="wpo-fieldgroup__subgroup"> | |
| 23 | + <label for="enable_custom_compression"> | |
| 24 | + <input id="enable_custom_compression" type="radio" name="compression_level" class="smush-options compression_level" <?php checked($custom); ?>> | |
| 25 | + <?php esc_html_e('Custom', 'wp-optimize');?> | |
| 26 | + </label> | |
| 27 | + <div class="smush-options custom_compression" <?php if (!$custom) echo 'style="display:none;"';?>> | |
| 28 | + <span class="alignleft"><?php esc_html_e('Maximum compression', 'wp-optimize');?></span> | |
| 29 | + <input id="custom_compression_slider" class="compression_level" data-max="<?php esc_attr_e('Maximum Compression', 'wp-optimize'); ?>" type="range" step="5" value="<?php echo intval($smush_options['image_quality']); ?>" min="65" max="90" list="number" /> | |
| 30 | + <datalist id="number"> | |
| 31 | + <option value="65"/> | |
| 32 | + <option value="70"/> | |
| 33 | + <option value="75"/> | |
| 34 | + <option value="80"/> | |
| 35 | + <option value="85"/> | |
| 36 | + <option value="90"/> | |
| 37 | + </datalist> | |
| 38 | + <span class="alignright"><?php esc_html_e('Best image quality', 'wp-optimize');?></span> | |
| 39 | + </div> | |
| 29 | 40 | </div> |
| 30 | 41 | </div> |
| 31 | 42 | <a href="#" class="wpo-toggle-advanced-options wpo_smush_single_image" style="<?php echo esc_attr($smush_display); ?>"><?php esc_html_e('Show advanced options', 'wp-optimize');?></a> |
| 32 | 43 | <div class='smush-advanced wpo-advanced-options'> |