← All changes | includes/controls/groups/background.php +71 -77 3.8.1 → 3.9.0 View file →

		@@ -91,21 +91,21 @@
91	91	*/
92	92	private static function get_default_background_types() {
93	93	return [
94	94	'classic' => [
95		- 'title' => _x( 'Classic', 'Background Control', 'elementor' ),
	95	+ 'title' => esc_html_x( 'Classic', 'Background Control', 'elementor' ),
96	96	'icon' => 'eicon-paint-brush',
97	97	],
98	98	'gradient' => [
99		- 'title' => _x( 'Gradient', 'Background Control', 'elementor' ),
	99	+ 'title' => esc_html_x( 'Gradient', 'Background Control', 'elementor' ),
100	100	'icon' => 'eicon-barcode',
101	101	],
102	102	'video' => [
103		- 'title' => _x( 'Video', 'Background Control', 'elementor' ),
	103	+ 'title' => esc_html_x( 'Video', 'Background Control', 'elementor' ),
104	104	'icon' => 'eicon-video-camera',
105	105	],
106	106	'slideshow' => [
107		- 'title' => _x( 'Slideshow', 'Background Control', 'elementor' ),
	107	+ 'title' => esc_html_x( 'Slideshow', 'Background Control', 'elementor' ),
108	108	'icon' => 'eicon-slideshow',
109	109	],
110	110	];
111	111	}
		@@ -123,28 +123,28 @@
123	123	public function init_fields() {
124	124	$fields = [];
125	125
126	126	$fields['background'] = [
127		- 'label' => _x( 'Background Type', 'Background Control', 'elementor' ),
	127	+ 'label' => esc_html_x( 'Background Type', 'Background Control', 'elementor' ),
128	128	'type' => Controls_Manager::CHOOSE,
129	129	'render_type' => 'ui',
130	130	];
131	131
132	132	$fields['color'] = [
133		- 'label' => _x( 'Color', 'Background Control', 'elementor' ),
	133	+ 'label' => esc_html_x( 'Color', 'Background Control', 'elementor' ),
134	134	'type' => Controls_Manager::COLOR,
135	135	'default' => '',
136		- 'title' => _x( 'Background Color', 'Background Control', 'elementor' ),
	136	+ 'title' => esc_html_x( 'Background Color', 'Background Control', 'elementor' ),
137	137	'selectors' => [
138	138	'{{SELECTOR}}' => 'background-color: {{VALUE}};',
139	139	],
140	140	'condition' => [
141		- 'background' => [ 'classic', 'gradient' ],
	141	+ 'background' => [ 'classic', 'gradient', 'video' ],
142	142	],
143	143	];
144	144
145	145	$fields['color_stop'] = [
146		- 'label' => _x( 'Location', 'Background Control', 'elementor' ),
	146	+ 'label' => esc_html_x( 'Location', 'Background Control', 'elementor' ),
147	147	'type' => Controls_Manager::SLIDER,
148	148	'size_units' => [ '%' ],
149	149	'default' => [
150	150	'unit' => '%',
		@@ -157,9 +157,9 @@
157	157	'of_type' => 'gradient',
158	158	];
159	159
160	160	$fields['color_b'] = [
161		- 'label' => _x( 'Second Color', 'Background Control', 'elementor' ),
	161	+ 'label' => esc_html_x( 'Second Color', 'Background Control', 'elementor' ),
162	162	'type' => Controls_Manager::COLOR,
163	163	'default' => '#f2295b',
164	164	'render_type' => 'ui',
165	165	'condition' => [
		@@ -168,9 +168,9 @@
168	168	'of_type' => 'gradient',
169	169	];
170	170
171	171	$fields['color_b_stop'] = [
172		- 'label' => _x( 'Location', 'Background Control', 'elementor' ),
	172	+ 'label' => esc_html_x( 'Location', 'Background Control', 'elementor' ),
173	173	'type' => Controls_Manager::SLIDER,
174	174	'size_units' => [ '%' ],
175	175	'default' => [
176	176	'unit' => '%',
		@@ -183,13 +183,13 @@
183	183	'of_type' => 'gradient',
184	184	];
185	185
186	186	$fields['gradient_type'] = [
187		- 'label' => _x( 'Type', 'Background Control', 'elementor' ),
	187	+ 'label' => esc_html_x( 'Type', 'Background Control', 'elementor' ),
188	188	'type' => Controls_Manager::SELECT,
189	189	'options' => [
190		- 'linear' => _x( 'Linear', 'Background Control', 'elementor' ),
191		- 'radial' => _x( 'Radial', 'Background Control', 'elementor' ),
	190	+ 'linear' => esc_html_x( 'Linear', 'Background Control', 'elementor' ),
	191	+ 'radial' => esc_html_x( 'Radial', 'Background Control', 'elementor' ),
192	192	],
193	193	'default' => 'linear',
194	194	'render_type' => 'ui',
195	195	'condition' => [
		@@ -198,20 +198,15 @@
198	198	'of_type' => 'gradient',
199	199	];
200	200
201	201	$fields['gradient_angle'] = [
202		- 'label' => _x( 'Angle', 'Background Control', 'elementor' ),
	202	+ 'label' => esc_html_x( 'Angle', 'Background Control', 'elementor' ),
203	203	'type' => Controls_Manager::SLIDER,
204		- 'size_units' => [ 'deg' ],
	204	+ 'size_units' => [ 'deg', 'grad', 'rad', 'turn' ],
205	205	'default' => [
206	206	'unit' => 'deg',
207	207	'size' => 180,
208	208	],
209		- 'range' => [
210		- 'deg' => [
211		- 'step' => 10,
212		- ],
213		- ],
214	209	'selectors' => [
215	210	'{{SELECTOR}}' => 'background-color: transparent; background-image: linear-gradient({{SIZE}}{{UNIT}}, {{color.VALUE}} {{color_stop.SIZE}}{{color_stop.UNIT}}, {{color_b.VALUE}} {{color_b_stop.SIZE}}{{color_b_stop.UNIT}})',
216	211	],
217	212	'condition' => [
		@@ -221,20 +216,20 @@
221	216	'of_type' => 'gradient',
222	217	];
223	218
224	219	$fields['gradient_position'] = [
225		- 'label' => _x( 'Position', 'Background Control', 'elementor' ),
	220	+ 'label' => esc_html_x( 'Position', 'Background Control', 'elementor' ),
226	221	'type' => Controls_Manager::SELECT,
227	222	'options' => [
228		- 'center center' => _x( 'Center Center', 'Background Control', 'elementor' ),
229		- 'center left' => _x( 'Center Left', 'Background Control', 'elementor' ),
230		- 'center right' => _x( 'Center Right', 'Background Control', 'elementor' ),
231		- 'top center' => _x( 'Top Center', 'Background Control', 'elementor' ),
232		- 'top left' => _x( 'Top Left', 'Background Control', 'elementor' ),
233		- 'top right' => _x( 'Top Right', 'Background Control', 'elementor' ),
234		- 'bottom center' => _x( 'Bottom Center', 'Background Control', 'elementor' ),
235		- 'bottom left' => _x( 'Bottom Left', 'Background Control', 'elementor' ),
236		- 'bottom right' => _x( 'Bottom Right', 'Background Control', 'elementor' ),
	223	+ 'center center' => esc_html_x( 'Center Center', 'Background Control', 'elementor' ),
	224	+ 'center left' => esc_html_x( 'Center Left', 'Background Control', 'elementor' ),
	225	+ 'center right' => esc_html_x( 'Center Right', 'Background Control', 'elementor' ),
	226	+ 'top center' => esc_html_x( 'Top Center', 'Background Control', 'elementor' ),
	227	+ 'top left' => esc_html_x( 'Top Left', 'Background Control', 'elementor' ),
	228	+ 'top right' => esc_html_x( 'Top Right', 'Background Control', 'elementor' ),
	229	+ 'bottom center' => esc_html_x( 'Bottom Center', 'Background Control', 'elementor' ),
	230	+ 'bottom left' => esc_html_x( 'Bottom Left', 'Background Control', 'elementor' ),
	231	+ 'bottom right' => esc_html_x( 'Bottom Right', 'Background Control', 'elementor' ),
237	232	],
238	233	'default' => 'center center',
239	234	'selectors' => [
240	235	'{{SELECTOR}}' => 'background-color: transparent; background-image: radial-gradient(at {{VALUE}}, {{color.VALUE}} {{color_stop.SIZE}}{{color_stop.UNIT}}, {{color_b.VALUE}} {{color_b_stop.SIZE}}{{color_b_stop.UNIT}})',
		@@ -246,15 +241,15 @@
246	241	'of_type' => 'gradient',
247	242	];
248	243
249	244	$fields['image'] = [
250		- 'label' => _x( 'Image', 'Background Control', 'elementor' ),
	245	+ 'label' => esc_html_x( 'Image', 'Background Control', 'elementor' ),
251	246	'type' => Controls_Manager::MEDIA,
252	247	'dynamic' => [
253	248	'active' => true,
254	249	],
255	250	'responsive' => true,
256		- 'title' => _x( 'Background Image', 'Background Control', 'elementor' ),
	251	+ 'title' => esc_html_x( 'Background Image', 'Background Control', 'elementor' ),
257	252	'selectors' => [
258	253	'{{SELECTOR}}' => 'background-image: url("{{URL}}");',
259	254	],
260	255	'render_type' => 'template',
		@@ -263,24 +258,24 @@
263	258	],
264	259	];
265	260
266	261	$fields['position'] = [
267		- 'label' => _x( 'Position', 'Background Control', 'elementor' ),
	262	+ 'label' => esc_html_x( 'Position', 'Background Control', 'elementor' ),
268	263	'type' => Controls_Manager::SELECT,
269	264	'default' => '',
270	265	'responsive' => true,
271	266	'options' => [
272		- '' => _x( 'Default', 'Background Control', 'elementor' ),
273		- 'center center' => _x( 'Center Center', 'Background Control', 'elementor' ),
274		- 'center left' => _x( 'Center Left', 'Background Control', 'elementor' ),
275		- 'center right' => _x( 'Center Right', 'Background Control', 'elementor' ),
276		- 'top center' => _x( 'Top Center', 'Background Control', 'elementor' ),
277		- 'top left' => _x( 'Top Left', 'Background Control', 'elementor' ),
278		- 'top right' => _x( 'Top Right', 'Background Control', 'elementor' ),
279		- 'bottom center' => _x( 'Bottom Center', 'Background Control', 'elementor' ),
280		- 'bottom left' => _x( 'Bottom Left', 'Background Control', 'elementor' ),
281		- 'bottom right' => _x( 'Bottom Right', 'Background Control', 'elementor' ),
282		- 'initial' => _x( 'Custom', 'Background Control', 'elementor' ),
	267	+ '' => esc_html_x( 'Default', 'Background Control', 'elementor' ),
	268	+ 'center center' => esc_html_x( 'Center Center', 'Background Control', 'elementor' ),
	269	+ 'center left' => esc_html_x( 'Center Left', 'Background Control', 'elementor' ),
	270	+ 'center right' => esc_html_x( 'Center Right', 'Background Control', 'elementor' ),
	271	+ 'top center' => esc_html_x( 'Top Center', 'Background Control', 'elementor' ),
	272	+ 'top left' => esc_html_x( 'Top Left', 'Background Control', 'elementor' ),
	273	+ 'top right' => esc_html_x( 'Top Right', 'Background Control', 'elementor' ),
	274	+ 'bottom center' => esc_html_x( 'Bottom Center', 'Background Control', 'elementor' ),
	275	+ 'bottom left' => esc_html_x( 'Bottom Left', 'Background Control', 'elementor' ),
	276	+ 'bottom right' => esc_html_x( 'Bottom Right', 'Background Control', 'elementor' ),
	277	+ 'initial' => esc_html_x( 'Custom', 'Background Control', 'elementor' ),
283	278
284	279	],
285	280	'selectors' => [
286	281	'{{SELECTOR}}' => 'background-position: {{VALUE}};',
		@@ -291,9 +286,9 @@
291	286	],
292	287	];
293	288
294	289	$fields['xpos'] = [
295		- 'label' => _x( 'X Position', 'Background Control', 'elementor' ),
	290	+ 'label' => esc_html_x( 'X Position', 'Background Control', 'elementor' ),
296	291	'type' => Controls_Manager::SLIDER,
297	292	'responsive' => true,
298	293	'size_units' => [ 'px', 'em', '%', 'vw' ],
299	294	'default' => [
		@@ -337,9 +332,9 @@
337	332	'required' => true,
338	333	];
339	334
340	335	$fields['ypos'] = [
341		- 'label' => _x( 'Y Position', 'Background Control', 'elementor' ),
	336	+ 'label' => esc_html_x( 'Y Position', 'Background Control', 'elementor' ),
342	337	'type' => Controls_Manager::SLIDER,
343	338	'responsive' => true,
344	339	'size_units' => [ 'px', 'em', '%', 'vh' ],
345	340	'default' => [
		@@ -383,15 +378,15 @@
383	378	'required' => true,
384	379	];
385	380
386	381	$fields['attachment'] = [
387		- 'label' => _x( 'Attachment', 'Background Control', 'elementor' ),
	382	+ 'label' => esc_html_x( 'Attachment', 'Background Control', 'elementor' ),
388	383	'type' => Controls_Manager::SELECT,
389	384	'default' => '',
390	385	'options' => [
391		- '' => _x( 'Default', 'Background Control', 'elementor' ),
392		- 'scroll' => _x( 'Scroll', 'Background Control', 'elementor' ),
393		- 'fixed' => _x( 'Fixed', 'Background Control', 'elementor' ),
	386	+ '' => esc_html_x( 'Default', 'Background Control', 'elementor' ),
	387	+ 'scroll' => esc_html_x( 'Scroll', 'Background Control', 'elementor' ),
	388	+ 'fixed' => esc_html_x( 'Fixed', 'Background Control', 'elementor' ),
394	389	],
395	390	'selectors' => [
396	391	'(desktop+){{SELECTOR}}' => 'background-attachment: {{VALUE}};',
397	392	],
		@@ -413,18 +408,18 @@
413	408	],
414	409	];
415	410
416	411	$fields['repeat'] = [
417		- 'label' => _x( 'Repeat', 'Background Control', 'elementor' ),
	412	+ 'label' => esc_html_x( 'Repeat', 'Background Control', 'elementor' ),
418	413	'type' => Controls_Manager::SELECT,
419	414	'default' => '',
420	415	'responsive' => true,
421	416	'options' => [
422		- '' => _x( 'Default', 'Background Control', 'elementor' ),
423		- 'no-repeat' => _x( 'No-repeat', 'Background Control', 'elementor' ),
424		- 'repeat' => _x( 'Repeat', 'Background Control', 'elementor' ),
425		- 'repeat-x' => _x( 'Repeat-x', 'Background Control', 'elementor' ),
426		- 'repeat-y' => _x( 'Repeat-y', 'Background Control', 'elementor' ),
	417	+ '' => esc_html_x( 'Default', 'Background Control', 'elementor' ),
	418	+ 'no-repeat' => esc_html_x( 'No-repeat', 'Background Control', 'elementor' ),
	419	+ 'repeat' => esc_html_x( 'Repeat', 'Background Control', 'elementor' ),
	420	+ 'repeat-x' => esc_html_x( 'Repeat-x', 'Background Control', 'elementor' ),
	421	+ 'repeat-y' => esc_html_x( 'Repeat-y', 'Background Control', 'elementor' ),
427	422	],
428	423	'selectors' => [
429	424	'{{SELECTOR}}' => 'background-repeat: {{VALUE}};',
430	425	],
		@@ -434,18 +429,18 @@
434	429	],
435	430	];
436	431
437	432	$fields['size'] = [
438		- 'label' => _x( 'Size', 'Background Control', 'elementor' ),
	433	+ 'label' => esc_html_x( 'Size', 'Background Control', 'elementor' ),
439	434	'type' => Controls_Manager::SELECT,
440	435	'responsive' => true,
441	436	'default' => '',
442	437	'options' => [
443		- '' => _x( 'Default', 'Background Control', 'elementor' ),
444		- 'auto' => _x( 'Auto', 'Background Control', 'elementor' ),
445		- 'cover' => _x( 'Cover', 'Background Control', 'elementor' ),
446		- 'contain' => _x( 'Contain', 'Background Control', 'elementor' ),
447		- 'initial' => _x( 'Custom', 'Background Control', 'elementor' ),
	438	+ '' => esc_html_x( 'Default', 'Background Control', 'elementor' ),
	439	+ 'auto' => esc_html_x( 'Auto', 'Background Control', 'elementor' ),
	440	+ 'cover' => esc_html_x( 'Cover', 'Background Control', 'elementor' ),
	441	+ 'contain' => esc_html_x( 'Contain', 'Background Control', 'elementor' ),
	442	+ 'initial' => esc_html_x( 'Custom', 'Background Control', 'elementor' ),
448	443	],
449	444	'selectors' => [
450	445	'{{SELECTOR}}' => 'background-size: {{VALUE}};',
451	446	],
		@@ -455,9 +450,9 @@
455	450	],
456	451	];
457	452
458	453	$fields['bg_width'] = [
459		- 'label' => _x( 'Width', 'Background Control', 'elementor' ),
	454	+ 'label' => esc_html_x( 'Width', 'Background Control', 'elementor' ),
460	455	'type' => Controls_Manager::SLIDER,
461	456	'responsive' => true,
462	457	'size_units' => [ 'px', 'em', '%', 'vw' ],
463	458	'range' => [
		@@ -490,9 +485,9 @@
490	485	],
491	486	];
492	487
493	488	$fields['video_link'] = [
494		- 'label' => _x( 'Video Link', 'Background Control', 'elementor' ),
	489	+ 'label' => esc_html_x( 'Video Link', 'Background Control', 'elementor' ),
495	490	'type' => Controls_Manager::TEXT,
496	491	'placeholder' => 'https://www.youtube.com/watch?v=XHOmBV4js_E',
497	492	'description' => esc_html__( 'YouTube/Vimeo link, or link to video file (mp4 is recommended).', 'elementor' ),
498	493	'label_block' => true,
		@@ -561,9 +556,8 @@
561	556	// youtube.com or youtube-nocookie.com, depending on whether the user wants privacy mode on or not).
562	557	$fields['privacy_mode'] = [
563	558	'label' => esc_html__( 'Privacy Mode', 'elementor' ),
564	559	'type' => Controls_Manager::SWITCHER,
565		- 'description' => esc_html__( 'Only works for YouTube videos.', 'elementor' ),
566	560	'condition' => [
567	561	'background' => [ 'video' ],
568	562	],
569	563	'of_type' => 'video',
		@@ -570,9 +564,9 @@
570	564	'frontend_available' => true,
571	565	];
572	566
573	567	$fields['video_fallback'] = [
574		- 'label' => _x( 'Background Fallback', 'Background Control', 'elementor' ),
	568	+ 'label' => esc_html_x( 'Background Fallback', 'Background Control', 'elementor' ),
575	569	'description' => esc_html__( 'This cover image will replace the background video in case that the video could not be loaded.', 'elementor' ),
576	570	'type' => Controls_Manager::MEDIA,
577	571	'dynamic' => [
578	572	'active' => true,
		@@ -586,9 +580,9 @@
586	580	'of_type' => 'video',
587	581	];
588	582
589	583	$fields['slideshow_gallery'] = [
590		- 'label' => _x( 'Images', 'Background Control', 'elementor' ),
	584	+ 'label' => esc_html_x( 'Images', 'Background Control', 'elementor' ),
591	585	'type' => Controls_Manager::GALLERY,
592	586	'condition' => [
593	587	'background' => [ 'slideshow' ],
594	588	],
		@@ -671,17 +665,17 @@
671	665	'default' => '',
672	666	'responsive' => true,
673	667	'options' => [
674	668	'' => esc_html__( 'Default', 'elementor' ),
675		- 'center center' => _x( 'Center Center', 'Background Control', 'elementor' ),
676		- 'center left' => _x( 'Center Left', 'Background Control', 'elementor' ),
677		- 'center right' => _x( 'Center Right', 'Background Control', 'elementor' ),
678		- 'top center' => _x( 'Top Center', 'Background Control', 'elementor' ),
679		- 'top left' => _x( 'Top Left', 'Background Control', 'elementor' ),
680		- 'top right' => _x( 'Top Right', 'Background Control', 'elementor' ),
681		- 'bottom center' => _x( 'Bottom Center', 'Background Control', 'elementor' ),
682		- 'bottom left' => _x( 'Bottom Left', 'Background Control', 'elementor' ),
683		- 'bottom right' => _x( 'Bottom Right', 'Background Control', 'elementor' ),
	669	+ 'center center' => esc_html_x( 'Center Center', 'Background Control', 'elementor' ),
	670	+ 'center left' => esc_html_x( 'Center Left', 'Background Control', 'elementor' ),
	671	+ 'center right' => esc_html_x( 'Center Right', 'Background Control', 'elementor' ),
	672	+ 'top center' => esc_html_x( 'Top Center', 'Background Control', 'elementor' ),
	673	+ 'top left' => esc_html_x( 'Top Left', 'Background Control', 'elementor' ),
	674	+ 'top right' => esc_html_x( 'Top Right', 'Background Control', 'elementor' ),
	675	+ 'bottom center' => esc_html_x( 'Bottom Center', 'Background Control', 'elementor' ),
	676	+ 'bottom left' => esc_html_x( 'Bottom Left', 'Background Control', 'elementor' ),
	677	+ 'bottom right' => esc_html_x( 'Bottom Right', 'Background Control', 'elementor' ),
684	678	],
685	679	'selectors' => [
686	680	'{{WRAPPER}} .elementor-background-slideshow__slide__image' => 'background-position: {{VALUE}};',
687	681	],