← All changes | admin/class-wpfnl-banner.php +173 -87 3.12.4 → 3.13.3 View file →

		@@ -53,9 +53,9 @@
53	53	$this->btn_link = $btn_link;
54	54	$this->start_date = strtotime($start_date);
55	55	$this->end_date = strtotime($end_date);
56	56
57		- if ('yes' === get_option('_is_show_ugcify_banner', 'yes')) {
	57	+ if ('yes' === get_option('_is_show_us_banner', 'yes')) {
58	58	// Hook into the admin_notices action to display the banner
59	59	add_action('admin_notices', [$this, 'display_banner']);
60	60	add_action('admin_head', array($this, 'add_styles'));
61	61	}
		@@ -67,9 +67,9 @@
67	67	* @return array Time remaining in days, hours, and minutes
68	68	*/
69	69	public function wpf_get_promotion_banner_countdown()
70	70	{
71		- $end_date = strtotime('2026-01-07 23:59:59');
	71	+ $end_date = strtotime('2026-07-07 23:59:59');
72	72	$now = current_time('timestamp');
73	73	$diff = $end_date - $now;
74	74
75	75	return array(
		@@ -93,9 +93,9 @@
93	93	return;
94	94	}
95	95
96	96	if ($current_date_time < $this->start_date || $current_date_time > $this->end_date) {
97		- //return;
	97	+ return;
98	98	}
99	99
100	100	// Calculate the time remaining in seconds
101	101	$time_remaining = $this->end_date - $current_date_time;
		@@ -104,27 +104,46 @@
104	104	?>
105	105	<div class="gwpf-promotional-notice <?php echo esc_attr($this->occasion); ?>-banner notice">
106	106	<div class="gwpf-tb__notification">
107	107	<div class="banner-overflow">
108		- <section class="gwpf-promotional-banner" aria-labelledby="UGCify-offer">
	108	+ <section class="gwpf-promotional-banner" aria-labelledby="US independence day offer">
109	109	<div class="gwpf-container">
110	110	<div class="promotional-banner">
111	111	<div class="banner-content">
112	112	<div class="banner-logo-area">
113		- <span class="new-tool-text"><?php echo __('New Tool Coming:', 'wpfunnels'); ?></span>
114		- <svg xmlns="http://www.w3.org/2000/svg" width="23" height="20" viewBox="0 0 23 20" fill="none"><path d="M1.06618 12.1359C8.90142 22.3152 17.4084 17.0302 21.0104 12.1256C21.0976 12.0069 21.286 12.1052 21.2364 12.2439C17.5346 22.5755 4.52336 22.5942 0.84551 12.2448C0.797424 12.1095 0.97859 12.0221 1.06618 12.1359Z" fill="#201cfe"/><path d="M3.38441 14.7801C7.55671 19.3578 14.4767 19.3577 18.6683 14.7962L19.2305 18.0621C19.4048 19.0746 18.6283 20 17.6009 20H4.4095C3.37407 20 2.59495 19.0608 2.78274 18.0425L3.38441 14.7801ZM18.4936 13.7809C14.7261 17.1915 8.66183 18.7568 3.58106 13.7132L5.28946 4.4507H16.8876L18.4936 13.7809ZM11.4455 8.30703C11.1791 7.76715 10.7417 7.76715 10.4726 8.30703L9.97917 9.30214C9.91189 9.44065 9.73246 9.57354 9.58387 9.59899L8.68947 9.74872C8.11753 9.84484 7.98578 10.2633 8.39511 10.676L9.09037 11.377C9.20812 11.4957 9.27268 11.7247 9.23624 11.8887L9.0371 12.7566C8.88013 13.4406 9.24466 13.7091 9.84463 13.3502L10.6829 12.8498C10.8371 12.7594 11.0866 12.7593 11.238 12.8498L12.0763 13.3502C12.679 13.7091 13.0407 13.4435 12.8837 12.7566L12.6847 11.8887C12.6482 11.7247 12.7127 11.4957 12.8304 11.377L13.5258 10.676C13.9379 10.2633 13.8032 9.84483 13.2313 9.74872L12.337 9.59899C12.1856 9.57355 12.0062 9.44065 11.9389 9.30214L11.4455 8.30703Z" fill="#201cfe"/><path d="M2.13955 12.1528C1.65099 12.0253 0.571895 12.1146 0.164049 13.491C-0.473269 12.5989 0.864968 10.942 2.13955 12.1528Z" fill="#201cfe"/><path d="M21.652 13.492C21.5932 12.9905 21.118 12.0176 19.6874 12.1378C20.287 11.2198 22.3169 11.8646 21.652 13.492Z" fill="#201cfe"/><path d="M14.02 3.50497C14.02 2.57539 13.6977 1.68389 13.1241 1.02658C12.5504 0.369272 11.7724 7.01809e-08 10.9611 0C10.1499 -7.01809e-08 9.37184 0.369272 8.7982 1.02658C8.22455 1.68389 7.90228 2.57539 7.90228 3.50496H8.7852C8.7852 2.84371 9.01445 2.20953 9.42252 1.74195C9.83058 1.27437 10.384 1.01169 10.9611 1.01169C11.5382 1.01169 12.0917 1.27437 12.4997 1.74195C12.9078 2.20953 13.1371 2.84371 13.1371 3.50497H14.02Z" fill="#201cfe"/></svg>
115		- <span class="tool-name">UGCify</span>
	113	+ <span class="us-flag">
	114	+ <img src="<?php echo WPFNL_DIR_URL . 'admin/assets/images/us-flag.webp'; ?>" alt="us-flag" width="117" height="70">
	115	+ </span>
	116	+ <span class="discount-text">
	117	+ <small><?php echo __('Happy 4th Of July!', 'wpfunnels'); ?></small>
	118	+ <?php echo __('Get 30% Off', 'wpfunnels'); ?>
	119	+ </span>
116	120	</div>
117	121
118		- <div class="banner-text">
119		- <?php echo __('Build trust and increase conversions with UGC for WooCommerce!', 'wpfunnels'); ?>
	122	+ <div class="countdown-timer" id="wpf-promo-countdown">
	123	+ <div class="countdown-item">
	124	+ <span id="wpf-promo-days"><?php echo esc_html(str_pad($countdown['days'], 2, '0', STR_PAD_LEFT)); ?></span>
	125	+ <small><?php echo __('DAY', 'wpfunnels'); ?></small>
	126	+ </div>
	127	+ <div class="countdown-item">
	128	+ <span id="wpf-promo-hours"><?php echo esc_html(str_pad($countdown['hours'], 2, '0', STR_PAD_LEFT)); ?></span>
	129	+ <small><?php echo __('HR', 'wpfunnels'); ?></small>
	130	+ </div>
	131	+ <div class="countdown-item">
	132	+ <span id="wpf-promo-mins"><?php echo esc_html(str_pad($countdown['mins'], 2, '0', STR_PAD_LEFT)); ?></span>
	133	+ <small><?php echo __('MIN', 'wpfunnels'); ?></small>
	134	+ </div>
	135	+ <div class="countdown-item">
	136	+ <span id="wpf-promo-secs"><?php echo esc_html(str_pad($countdown['secs'], 2, '0', STR_PAD_LEFT)); ?></span>
	137	+ <small><?php echo __('SEC', 'wpfunnels'); ?></small>
	138	+ </div>
120	139	</div>
121	140
122		- <a href="<?php echo esc_url($this->btn_link); ?>" class="cta-button" role="button" aria-label="get special discount " target="_blank">
	141	+ <a href="<?php echo esc_url($this->btn_link); ?>" class="cta-button" role="button" aria-label="claim your deal" target="_blank">
123	142	<?php
124		- echo __('Request Early Access', 'wpfunnels');
	143	+ echo __('Claim Your Deal', 'wpfunnels');
125	144	?>
126		- <svg xmlns="http://www.w3.org/2000/svg" width="8" height="9" viewBox="0 0 8 9" fill="none"><path d="M8 0.703124V8.29686C8 8.48334 7.93415 8.66218 7.81694 8.79405C7.69973 8.92591 7.54076 8.99999 7.375 8.99999C7.20924 8.99999 7.05027 8.92591 6.93306 8.79405C6.81585 8.66218 6.75 8.48334 6.75 8.29686V2.40061L1.06695 8.79406C0.949738 8.92592 0.790765 9 0.625004 9C0.459243 9 0.30027 8.92592 0.183059 8.79406C0.0658485 8.6622 0 8.48335 0 8.29687C0 8.11039 0.0658485 7.93155 0.183059 7.79968L5.86613 1.40625H0.625012C0.459252 1.40625 0.300281 1.33217 0.183071 1.20031C0.0658608 1.06845 1.28672e-05 0.889604 1.28672e-05 0.703124C1.28672e-05 0.516644 0.0658608 0.337802 0.183071 0.20594C0.300281 0.0740789 0.459252 0 0.625012 0L7.375 0C7.54076 0 7.69973 0.0740789 7.81694 0.20594C7.93415 0.337802 8 0.516644 8 0.703124Z" fill="#201cfe"/></svg>
	145	+ <svg xmlns="http://www.w3.org/2000/svg" width="8" height="9" viewBox="0 0 8 9" fill="none"><path d="M8 0.703124V8.29686C8 8.48334 7.93415 8.66218 7.81694 8.79405C7.69973 8.92591 7.54076 8.99999 7.375 8.99999C7.20924 8.99999 7.05027 8.92591 6.93306 8.79405C6.81585 8.66218 6.75 8.48334 6.75 8.29686V2.40061L1.06695 8.79406C0.949738 8.92592 0.790765 9 0.625004 9C0.459243 9 0.30027 8.92592 0.183059 8.79406C0.0658485 8.6622 0 8.48335 0 8.29687C0 8.11039 0.0658485 7.93155 0.183059 7.79968L5.86613 1.40625H0.625012C0.459252 1.40625 0.300281 1.33217 0.183071 1.20031C0.0658608 1.06845 1.28672e-05 0.889604 1.28672e-05 0.703124C1.28672e-05 0.516644 0.0658608 0.337802 0.183071 0.20594C0.300281 0.0740789 0.459252 0 0.625012 0L7.375 0C7.54076 0 7.69973 0.0740789 7.81694 0.20594C7.93415 0.337802 8 0.516644 8 0.703124Z" fill="#fff"/></svg>
127	146	</a>
128	147	</div>
129	148	</div>
130	149	</div>
		@@ -131,9 +150,9 @@
131	150	</section>
132	151	</div>
133	152
134	153	<button class="close-promotional-banner" type="button" aria-label="close banner">
135		- <svg width="12" height="13" fill="none" viewBox="0 0 12 13" xmlns="http://www.w3.org/2000/svg"><path stroke="#7A8B9A" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 1.97L1 11.96m0-9.99l10 9.99"/></svg>
	154	+ <svg width="12" height="13" fill="none" viewBox="0 0 12 13" xmlns="http://www.w3.org/2000/svg"><path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 1.97L1 11.96m0-9.99l10 9.99"/></svg>
136	155	</button>
137	156	</div>
138	157	</div>
139	158	<!-- .gwpf-tb-notification end -->
		@@ -138,43 +157,62 @@
138	157	</div>
139	158	<!-- .gwpf-tb-notification end -->
140	159
141	160	<script>
142		- function updateCountdown() {
143		- var endDate = new Date("2026-01-07 23:59:59").getTime();
144		- var now = new Date().getTime();
145		- var timeLeft = endDate - now;
	161	+ (function() {
	162	+ var countdownInterval;
146	163
147		- var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
148		- var hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
149		- var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
150		- var seconds = Math.floor((timeLeft % (1000 * 60)) / 1000);
	164	+ function pad(num) {
	165	+ return String(num).padStart(2, '0');
	166	+ }
151	167
152		- var daysElement = document.getElementById('wpf-halloween-days');
153		- var hoursElement = document.getElementById('wpf-halloween-hours');
154		- var minsElement = document.getElementById('wpf-halloween-mins');
155		- var secsElement = document.getElementById('wpf-halloween-secs');
	168	+ function updateCountdown() {
	169	+ var endDate = new Date("2026-07-07 23:59:59").getTime();
	170	+ var now = new Date().getTime();
	171	+ var timeLeft = endDate - now;
156	172
157		- if (daysElement) {
158		- daysElement.innerHTML = days;
159		- }
	173	+ if (timeLeft <= 0) {
	174	+ clearInterval(countdownInterval);
160	175
161		- if (hoursElement) {
162		- hoursElement.innerHTML = hours;
163		- }
	176	+ var banner = document.querySelector('.gwpf-promotional-notice');
	177	+ if (banner) {
	178	+ banner.style.display = 'none';
	179	+ }
164	180
165		- if (minsElement) {
166		- minsElement.innerHTML = minutes;
	181	+ return;
	182	+ }
	183	+
	184	+ var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
	185	+ var hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
	186	+ var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
	187	+ var seconds = Math.floor((timeLeft % (1000 * 60)) / 1000);
	188	+
	189	+ var daysElement = document.getElementById('wpf-promo-days');
	190	+ var hoursElement = document.getElementById('wpf-promo-hours');
	191	+ var minsElement = document.getElementById('wpf-promo-mins');
	192	+ var secsElement = document.getElementById('wpf-promo-secs');
	193	+
	194	+ if (daysElement) {
	195	+ daysElement.innerHTML = pad(days);
	196	+ }
	197	+
	198	+ if (hoursElement) {
	199	+ hoursElement.innerHTML = pad(hours);
	200	+ }
	201	+
	202	+ if (minsElement) {
	203	+ minsElement.innerHTML = pad(minutes);
	204	+ }
	205	+ if (secsElement) {
	206	+ secsElement.innerHTML = pad(seconds);
	207	+ }
167	208	}
168		- if (secsElement) {
169		- secsElement.innerHTML = seconds;
170		- }
171		- }
172	209
173		- document.addEventListener('DOMContentLoaded', function() {
174		- updateCountdown();
175		- setInterval(updateCountdown, 1000); // Update every minute
176		- });
	210	+ document.addEventListener('DOMContentLoaded', function() {
	211	+ updateCountdown();
	212	+ countdownInterval = setInterval(updateCountdown, 1000);
	213	+ });
	214	+ })();
177	215	</script>
178	216	<?php
179	217	}
180	218
		@@ -225,21 +263,21 @@
225	263	/* ---banner style start--- */
226	264	.gwpf-promotional-banner {
227	265	position: relative;
228	266	z-index: 1111;
229		- padding: 6px 0;
230		- border-radius: 10px;
231		- background: #FFF;
	267	+ padding: 0;
	268	+ /* padding: 6px 0; */
	269	+ background: #7D4CEF;
232	270	box-shadow: 0 1px 1px 0 rgba(32, 28, 254, 0.10);
233	271	}
234	272	.gwpf-promotional-banner .promotional-banner {
235		- color: white;
236		- padding: 3px 20px 0;
237	273	/* padding: 12px 20px; */
238		- text-align: center;
239		- font-size: 14px;
240		- line-height: 1.4;
241		- position: relative;
	274	+ padding-top: 1px;
	275	+ text-align: center;
	276	+ font-size: 14px;
	277	+ line-height: 1.4;
	278	+ position: relative;
	279	+ height: 70px;
242	280	}
243	281	.gwpf-promotional-banner .banner-content {
244	282	max-width: 1200px;
245	283	margin: 0 auto;
		@@ -246,9 +284,9 @@
246	284	display: inline-flex;
247	285	align-items: center;
248	286	justify-content: center;
249	287	flex-wrap: wrap;
250		- gap: 30px;
	288	+ gap: 70px;
251	289	row-gap: 8px;
252	290	position: relative;
253	291	}
254	292	.gwpf-promotional-banner .banner-logo-area {
		@@ -253,23 +291,38 @@
253	291	}
254	292	.gwpf-promotional-banner .banner-logo-area {
255	293	display: flex;
256	294	align-items: center;
257		- gap: 5px;
	295	+ gap: 17px;
258	296	}
259		- .gwpf-promotional-banner .new-tool-text {
260		- color: #666;
261		- font-size: 12px;
262		- font-weight: 500;
263		- line-height: 1;
	297	+
	298	+ .gwpf-promotional-banner .banner-logo-area img {
264	299	display: block;
	300	+ position: relative;
	301	+ top: -1px;
265	302	}
266		- .gwpf-promotional-banner .tool-name {
267		- color: #090939;
268		- font-size: 14px;
269		- font-weight: 600;
	303	+
	304	+ .gwpf-promotional-banner .discount-text {
	305	+ color: #FFF;
	306	+ font-family: 'Inter', sans-serif;
	307	+ font-size: 24px;
	308	+ font-weight: 700;
	309	+ line-height: 1.2;
	310	+ letter-spacing: -0.084px;
	311	+ display: flex;
	312	+ flex-flow: column;
	313	+ align-items: flex-start;
	314	+ gap: 7px;
	315	+
	316	+ }
	317	+
	318	+ .gwpf-promotional-banner .discount-text small {
	319	+ color: #FFF;
	320	+ font-family: 'Inter', sans-serif;
	321	+ font-size: 16px;
	322	+ font-weight: 500;
270	323	line-height: 1;
271		- display: block;
	324	+ letter-spacing: -0.32px;
272	325	}
273	326	.gwpf-promotional-banner .banner-text {
274	327	display: flex;
275	328	align-items: center;
		@@ -290,33 +343,69 @@
290	343	.gwpf-promotional-banner .banner-text .highlighted-text {
291	344	color: #ee8134;
292	345	font-weight: 700;
293	346	}
294		- .gwpf-promotional-banner .halloween-bird-left {
295		- position: absolute;
296		- left: -47px;
297		- bottom: -7px;
	347	+
	348	+ .gwpf-promotional-banner .countdown-timer {
	349	+ display: flex;
	350	+ align-items: center;
	351	+ gap: 2px;
298	352	}
299		- .gwpf-promotional-banner .halloween-bird-right {
300		- position: absolute;
301		- right: -50px;
302		- top: -5px;
	353	+ .gwpf-promotional-banner .countdown-item {
	354	+ display: flex;
	355	+ flex-direction: column;
	356	+ align-items: center;
	357	+ justify-content: center;
	358	+ gap: 4px;
	359	+ min-width: 50px;
	360	+ height: 50px;
	361	+ padding: 4px 6px;
	362	+ color: #fff;
	363	+ line-height: 1.2;
	364	+ border: 1px solid #8555f5;
	365	+ background: rgba(54, 30, 107, 0.40);
	366	+
303	367	}
	368	+
	369	+ .gwpf-promotional-banner .countdown-item:first-child {
	370	+ border-radius: 4px 0 0 4px;
	371	+ }
	372	+
	373	+ .gwpf-promotional-banner .countdown-item:last-child {
	374	+ border-radius: 0 4px 4px 0;
	375	+ }
	376	+
	377	+ .gwpf-promotional-banner .countdown-item span {
	378	+ font-size: 20px;
	379	+ font-weight: 600;
	380	+ line-height: 1;
	381	+ font-family: 'Inter', sans-serif;
	382	+ }
	383	+ .gwpf-promotional-banner .countdown-item small {
	384	+ text-transform: uppercase;
	385	+ color: rgba(255, 255, 255, 0.80);
	386	+ text-align: center;
	387	+ font-family: Inter;
	388	+ font-size: 12px;
	389	+ font-weight: 400;
	390	+ line-height: 1;
	391	+ letter-spacing: 0.24px;
	392	+ }
304	393	.gwpf-promotional-banner .cta-button {
305		- color: #201CFE;
	394	+ color: #fff;
306	395	font-size: 15px;
307	396	font-style: normal;
308		- font-weight: 500;
	397	+ font-weight: 600;
309	398	line-height: 1;
310		- text-decoration: underline;
311		- text-decoration-thickness: 1px;
312		- text-underline-offset: 5px;
313		- display: inline-flex;
314		- align-items: center;
315		- gap: 5px;
316		- transition: all 0.2s ease;
317		- background: #fff;
318		- padding: 9px 14px;
	399	+ text-decoration: none;
	400	+ display: inline-flex;
	401	+ align-items: center;
	402	+ gap: 5px;
	403	+ transition: all 0.2s ease;
	404	+ background: #F7941D;
	405	+ border-radius: 6px;
	406	+ padding: 12px 15px;
	407	+ font-family: 'Inter', sans-serif;
319	408	}
320	409	.gwpf-promotional-banner .cta-button svg {
321	410	transition: transform 0.3s ease;
322	411	}
		@@ -334,8 +423,9 @@
334	423	} */
335	424
336	425	.gwpf-promotional-banner .cta-button:hover {
337	426	text-decoration: none;
	427	+ color: #fff;
338	428	}
339	429	.gwpf-promotional-banner .cta-button:hover svg {
340	430	transform: translateX(3px);
341	431	}
		@@ -345,9 +435,9 @@
345	435	position: absolute;
346	436	top: 50%;
347	437	right: 10px;
348	438	transform: translateY(-50%);
349		- background: #fff;
	439	+ background: transparent;
350	440	border: none;
351	441	padding: 0;
352	442	border-radius:0;
353	443	cursor: pointer;
		@@ -366,14 +456,10 @@
366	456	}
367	457
368	458	@media only screen and (max-width: 1199px) {
369	459	.gwpf-promotional-banner .banner-content {
370		- gap: 20px;
	460	+ gap: 40px;
371	461	row-gap: 8px;
372		- }
373		-
374		- .gwpf-promotional-banner .cta-button {
375		- padding-top: 0;
376	462	}
377	463	}
378	464
379	465	@media only screen and (max-width: 991px) {