← All changes | media-optimization/views/settings-tab.php +26 -7 2.6.17 → 2.7.1 View file →

		@@ -39,11 +39,24 @@
39	39	<option value="webp" <?php selected($settings['conversion_format'], 'webp'); ?>
40	40	<?php disabled(!$capabilities['webp_support']); ?>>
41	41	WebP <?php echo !$capabilities['webp_support'] ? esc_html__('(not supported)', 'metasync') : ''; ?>
42	42	</option>
	43	+ <?php
	44	+ // Distinguish "this server can't encode AVIF" from "this PHP
	45	+ // version can't measure it", so the reason is actionable.
	46	+ $avif_needs_newer_php = PHP_VERSION_ID < Metasync_Media_Settings::AVIF_MIN_PHP_VERSION_ID;
	47	+ ?>
43	48	<option value="avif" <?php selected($settings['conversion_format'], 'avif'); ?>
44	49	<?php disabled(!$capabilities['avif_support']); ?>>
45		- AVIF <?php echo !$capabilities['avif_support'] ? esc_html__('(not supported)', 'metasync') : ''; ?>
	50	+ AVIF <?php
	51	+ if ($capabilities['avif_support']) {
	52	+ echo '';
	53	+ } elseif ($avif_needs_newer_php) {
	54	+ echo esc_html__('(requires PHP 8.2 or later)', 'metasync');
	55	+ } else {
	56	+ echo esc_html__('(not supported)', 'metasync');
	57	+ }
	58	+ ?>
46	59	</option>
47	60	</select>
48	61	</div>
49	62	<p class="metasync-field-description"><?php esc_html_e('WebP has broader browser support. AVIF offers better compression but requires newer browsers.', 'metasync'); ?></p>
		@@ -93,9 +106,9 @@
93	106	</div>
94	107
95	108	<div class="metasync-field-row">
96	109	<div class="metasync-field metasync-field--card">
97		- <label for="max_image_dimensions"><?php esc_html_e('Max Image Dimensions', 'metasync'); ?></label>
	110	+ <label for="max_image_dimensions"><?php esc_html_e('Max Image Dimensions', 'metasync'); ?><?php Metasync::render_tooltip_icon('media_max_image_dimensions', 'Automatically shrinks any uploaded image wider or taller than this, to save space and speed up your site. This permanently resizes the file according to your Conversion Strategy setting.'); ?></label>
98	111	<div class="metasync-number-group">
99	112	<input type="number" name="metasync_media[max_image_dimensions]" id="max_image_dimensions"
100	113	value="<?php echo esc_attr((int) ($settings['max_image_dimensions'] ?? 2560)); ?>"
101	114	min="0" max="10000" step="1">
		@@ -110,9 +123,9 @@
110	123	<!-- Section: Smart Lazy Loading -->
111	124	<div class="metasync-card">
112	125	<div class="metasync-card-header">
113	126	<div class="metasync-card-title-group">
114		- <h2><?php esc_html_e('Smart Lazy Loading', 'metasync'); ?></h2>
	127	+ <h2><?php esc_html_e('Smart Lazy Loading', 'metasync'); ?><?php Metasync::render_tooltip_icon('media_enable_lazy_loading', 'Delays loading images until a visitor scrolls near them, speeding up initial page load. Safe to leave on for most sites.'); ?></h2>
115	128	<span class="metasync-card-subtitle"><?php esc_html_e('Defer off-screen images and iframes for faster page loads', 'metasync'); ?></span>
116	129	</div>
117	130	<label class="metasync-toggle">
118	131	<input type="checkbox" name="metasync_media[enable_lazy_loading]" value="1" <?php checked(!empty($settings['enable_lazy_loading'])); ?>>
		@@ -122,9 +135,9 @@
122	135
123	136	<div class="metasync-card-body metasync-toggle-section" data-toggle="enable_lazy_loading" <?php echo empty($settings['enable_lazy_loading']) ? 'style="display:none;"' : ''; ?>>
124	137	<div class="metasync-field-row">
125	138	<div class="metasync-field metasync-field--card">
126		- <label for="lcp_skip_count"><?php esc_html_e('LCP Protection - Skip Count', 'metasync'); ?></label>
	139	+ <label for="lcp_skip_count"><?php esc_html_e('LCP Protection - Skip Count', 'metasync'); ?><?php Metasync::render_tooltip_icon('media_lcp_skip_count', "How many of the first images on a page are loaded immediately instead of lazily — these are usually the ones visible without scrolling. 'LCP' stands for Largest Contentful Paint, a page-speed metric; leave at the default unless a speed test flags your hero image."); ?></label>
127	140	<div class="metasync-number-group">
128	141	<input type="number" name="metasync_media[lcp_skip_count]" id="lcp_skip_count"
129	142	value="<?php echo esc_attr((int) $settings['lcp_skip_count']); ?>"
130	143	min="0" max="10" step="1">
		@@ -183,9 +196,9 @@
183	196
184	197	<div class="metasync-card-body">
185	198	<div class="metasync-field-row">
186	199	<div class="metasync-field">
187		- <label for="exclude_classes"><?php esc_html_e('Exclude by CSS Class', 'metasync'); ?></label>
	200	+ <label for="exclude_classes"><?php esc_html_e('Exclude by CSS Class', 'metasync'); ?><?php Metasync::render_tooltip_icon('media_exclude_classes', 'Skip lazy-loading and optimization for images matching this class or URL — use for logos or above-the-fold images you want to load instantly.'); ?></label>
188	201	<input type="text" name="metasync_media[exclude_classes]" id="exclude_classes"
189	202	value="<?php echo esc_attr($settings['exclude_classes']); ?>"
190	203	placeholder="no-lazy, skip-convert, custom-class"
191	204	class="metasync-text-input">
		@@ -192,9 +205,9 @@
192	205	<p class="metasync-field-description"><?php esc_html_e('Comma-separated CSS class names. Images with these classes will be excluded from conversion, lazy loading, and dimension injection.', 'metasync'); ?></p>
193	206	</div>
194	207
195	208	<div class="metasync-field">
196		- <label for="exclude_urls"><?php esc_html_e('Exclude by URL Pattern', 'metasync'); ?></label>
	209	+ <label for="exclude_urls"><?php esc_html_e('Exclude by URL Pattern', 'metasync'); ?><?php Metasync::render_tooltip_icon('media_exclude_urls', 'Skip lazy-loading and optimization for images matching this class or URL — use for logos or above-the-fold images you want to load instantly.'); ?></label>
197	210	<input type="text" name="metasync_media[exclude_urls]" id="exclude_urls"
198	211	value="<?php echo esc_attr($settings['exclude_urls']); ?>"
199	212	placeholder="/logo, /brand, external-cdn.com"
200	213	class="metasync-text-input">
		@@ -269,9 +282,14 @@
269	282	<span class="dashicons dashicons-yes-alt"></span> <?php esc_html_e('Supported', 'metasync'); ?>
270	283	</span>
271	284	<?php else: ?>
272	285	<span class="metasync-capability-badge metasync-badge-warning">
273		- <span class="dashicons dashicons-warning"></span> <?php esc_html_e('Not Supported', 'metasync'); ?>
	286	+ <span class="dashicons dashicons-warning"></span>
	287	+ <?php
	288	+ echo PHP_VERSION_ID < Metasync_Media_Settings::AVIF_MIN_PHP_VERSION_ID
	289	+ ? esc_html__('Requires PHP 8.2+', 'metasync')
	290	+ : esc_html__('Not Supported', 'metasync');
	291	+ ?>
274	292	</span>
275	293	<?php endif; ?>
276	294	</div>
277	295	</div>
		@@ -290,8 +308,9 @@
290	308	</div>
291	309	<div class="metasync-feature-status-item">
292	310	<span class="metasync-feature-dot <?php echo !empty($settings['enable_lazy_loading']) ? 'active' : 'inactive'; ?>"></span>
293	311	<span><?php esc_html_e('Lazy Loading', 'metasync'); ?></span>
	312	+ <?php /* translators: %d: number of leading images to skip. */ ?>
294	313	<span class="metasync-feature-format"><?php echo !empty($settings['enable_lazy_loading']) ? sprintf(esc_html__('Skip %d', 'metasync'), (int) $settings['lcp_skip_count']) : ''; ?></span>
295	314	</div>
296	315	<div class="metasync-feature-status-item">
297	316	<span class="metasync-feature-dot <?php echo !empty($settings['enable_dimension_injection']) ? 'active' : 'inactive'; ?>"></span>