wp-optimize / templates / minify / js-settings-tab.php

js-settings-tab.php in WP-Optimize – Cache, Compress images, Minify & Clean database to boost page speed & performance 3.4.2, at templates/minify/js-settings-tab.php

190 lines 8.7 KB

Raw Download Zip

1	<?php if (!defined('WPO_VERSION')) die('No direct access allowed'); ?>
2	<div id='wpo_section_js' class="wpo_section wpo_group">
3	<div id="wpo_settings_warnings"></div>
4	<form>
5	<h3><?php esc_html_e('JavaScript options', 'wp-optimize'); ?></h3>
6	<div class="wpo-fieldgroup">
7	<fieldset>
8	<label for="enable_js_minification">
9	<input
10	name="enable_js_minification"
11	type="checkbox"
12	id="enable_js_minification"
13	value="1"
14	<?php echo checked($wpo_minify_options['enable_js_minification']); ?>
15	>
16	<?php esc_html_e('Enable minification of JavaScript files', 'wp-optimize'); ?>
17	</label>
18	<label for="enable_merging_of_js">
19	<input
20	name="enable_merging_of_js"
21	type="checkbox"
22	id="enable_merging_of_js"
23	value="1"
24	<?php echo checked($wpo_minify_options['enable_merging_of_js']); ?>
25	>
26	<?php esc_html_e('Enable merging of JavaScript files', 'wp-optimize'); ?>
27	<span tabindex="0" data-tooltip="<?php esc_attr_e('If some functionality is breaking on the frontend, disabling merging of JavaScript might fix the issues.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span> </span>
28	</label>
29	<label for="enable_js_trycatch">
30	<input
31	name="enable_js_trycatch"
32	type="checkbox"
33	id="enable_js_trycatch"
34	value="1"
35	<?php echo checked($wpo_minify_options['enable_js_trycatch']); ?>
36	>
37	<?php esc_html_e('Contain each included file in its own block', 'wp-optimize'); ?>
38	<em><?php esc_html_e('(enable if trying to isolate a JavaScript error introduced by minifying or merging)', 'wp-optimize'); ?></em>
39	<?php
40	$message = __('When enabled, the content of each JavaScript file that is combined will be wrapped in its own "try / catch" statement.', 'wp-optimize');
41	$message .= ' ';
42	$message .= __('This means that if one file has an error, it should not impede execution of other, independent files.', 'wp-optimize');
43	?>
44	<span tabindex="0" data-tooltip="<?php echo esc_attr($message); ?>"><span class="dashicons dashicons-editor-help"></span> </span>
45	</label>
46	</fieldset>
47	</div>
48	<h3><?php esc_html_e('Exclude JavaScript from processing', 'wp-optimize'); ?></h3>
49	<div class="wpo-fieldgroup">
50	<fieldset>
51	<label for="exclude_js">
52	<?php esc_html_e('Any JavaScript files that match the paths below will be completely ignored', 'wp-optimize'); ?>
53	<span tabindex="0" data-tooltip="<?php esc_attr_e('Use this if you are having issues with a certain JavaScript file.', 'wp-optimize'); ?> <?php esc_attr_e('Any file present here will be loaded normally by WordPress', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span>
54	</label>
55	<textarea
56	name="exclude_js"
57	rows="7" cols="50"
58	id="exclude_js"
59	class="large-text code"
60	placeholder="<?php esc_attr_e('e.g.: /wp-includes/js/jquery/jquery.js', 'wp-optimize'); ?>"
61	><?php echo esc_textarea($wpo_minify_options['exclude_js']);?></textarea>
62	<br>
63	<?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'); ?>
64	</fieldset>
65	</div>
66
67	<h3><?php esc_html_e('Defer JavaScript', 'wp-optimize'); ?></h3>
68	<div class="wpo-fieldgroup">
69	<fieldset class="async-js-manual-list">
70	<h4><label>
71	<input
72	name="enable_defer_js"
73	type="radio"
74	value="individual"
75	<?php echo checked($wpo_minify_options['enable_defer_js'], 'individual'); ?>
76	>
77	<?php esc_html_e('Asynchronously load selected JavaScript files', 'wp-optimize'); ?>
78	<span tabindex="0" data-tooltip="<?php esc_attr_e('The files in the list will be loaded asynchronously, and will not be minified or merged.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span>
79	</label>
80	</h4>
81	<div class="defer-js-settings">
82	<label for="async_js">
83	<?php esc_html_e('Any JavaScript files that match the paths below will be loaded asynchronously.', 'wp-optimize'); ?>
84	<br>
85	<?php esc_html_e('Use this if you have a completely independent script', 'wp-optimize'); ?>
86	<?php
87	$message = __('Independent scripts are for example \'analytics\' or \'pixel\' scripts.', 'wp-optimize');
88	$message .= ' ';
89	$message .= __('They are not required for the website to work', 'wp-optimize');
90	?>
91	<span tabindex="0" data-tooltip="<?php echo esc_attr($message);?>"><span class="dashicons dashicons-editor-help"></span></span>
92	</label>
93	<textarea
94	name="async_js"
95	rows="7"
96	cols="50"
97	id="async_js"
98	class="large-text code"
99	placeholder="<?php esc_attr_e('e.g.: /js/main.js', 'wp-optimize'); ?>"
100	><?php echo esc_textarea($wpo_minify_options['async_js']); ?></textarea>
101	<label for="exclude_js_from_page_speed_tools">
102	<input
103	name="exclude_js_from_page_speed_tools"
104	type="checkbox"
105	id="exclude_js_from_page_speed_tools"
106	value="1"
107	<?php echo checked($wpo_minify_options['exclude_js_from_page_speed_tools']); ?>
108	>
109	<?php esc_html_e('Exclude scripts from page speed tests (PageSpeed Insights, GTMetrix...)', 'wp-optimize'); ?>
110	<span tabindex="0" data-tooltip="<?php esc_attr_e('Use this only for testing purpose to find out which scripts are slowing down your site.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span>
111	</label>
112	</div>
113	</fieldset>
114
115	<fieldset>
116	<h4>
117	<label>
118	<input
119	name="enable_defer_js"
120	type="radio"
121	value="all"
122	<?php echo checked($wpo_minify_options['enable_defer_js'], 'all'); ?>
123	>
124	<?php esc_html_e('Defer all the JavaScript files', 'wp-optimize'); ?>
125	<span tabindex="0" data-tooltip="<?php esc_attr_e('All files - including the ones processed by WP-Optimize - will be deferred, except the ones in the exclusion list above.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span>
126	</label>
127	</h4>
128	<div class="defer-js-settings">
129	<div class="notice notice-warning below-h2">
130	<p class="wpo_min-bold-green wpo_min-rowintro">
131	<?php esc_html_e('Some themes and plugins need render blocking scripts to work.', 'wp-optimize'); ?> <?php esc_html_e('Please check the browser console for any eventual JavaScript errors caused by deferring the scripts.', 'wp-optimize'); ?>
132	</p>
133	</div>
134	<h4><?php esc_html_e('Defer method:', 'wp-optimize'); ?></h4>
135	<label>
136	<input
137	name="defer_js_type"
138	type="radio"
139	value="defer"
140	<?php echo checked($wpo_minify_options['defer_js_type'], 'defer'); ?>
141	>
142	<?php esc_html_e('Use the "defer" html attribute', 'wp-optimize'); ?>
143	<span tabindex="0" data-tooltip="<?php esc_attr_e('Supported by all modern browsers.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span>
144	</label>
145	<label>
146	<input
147	name="defer_js_type"
148	type="radio"
149	value="async_using_js"
150	<?php echo checked($wpo_minify_options['defer_js_type'], 'async_using_js'); ?>
151	>
152	<?php esc_html_e('Defer using JavaScript', 'wp-optimize'); ?>
153	<em>
154	<?php
155	$message = '(';
156	$message .= esc_html__('Asynchronous loading.', 'wp-optimize');
157	$message .= ' ';
158	$message .= sprintf(esc_html__('Use this method if you require support for %solder browsers%s.', 'wp-optimize'), '<a href="https://www.w3schools.com/tags/att_script_defer.asp" target="_blank">', '</a>');
159	$message .= ')';
160	echo strip_tags($message, '<a>');
161	?>
162	</em>
163	</label>
164	<label for="defer_jquery">
165	<input
166	name="defer_jquery"
167	type="checkbox"
168	id="defer_jquery"
169	value="1"
170	<?php echo checked($wpo_minify_options['defer_jquery']); ?>
171	>
172	<?php esc_html_e('Defer jQuery', 'wp-optimize'); ?> <em><?php esc_html_e('(Note that as jQuery is a common dependency, it probably needs to be loaded synchronously).', 'wp-optimize'); ?></em>
173	<span tabindex="0" data-tooltip="<?php esc_attr_e('Disable this setting if you have an error \'jQuery undefined\'.', 'wp-optimize');?>"><span class="dashicons dashicons-editor-help"></span></span>
174	</label>
175	</div>
176	</fieldset>
177	</div>
178
179	<p class="submit">
180	<input
181	class="wp-optimize-save-minify-settings button button-primary"
182	type="submit"
183	value="<?php esc_attr_e('Save settings', 'wp-optimize'); ?>"
184	>
185	<img class="wpo_spinner" src="<?php echo esc_url(admin_url('images/spinner-2x.gif')); ?>" alt="...">
186	<span class="save-done dashicons dashicons-yes display-none"></span>
187	</p>
188	</form>
189	</div>
190