PluginProbe
Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF / 1.9.8
Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF v1.9.8
2.3.4 2.3.3 2.3.2 2.3.1 2.3.0 2.2.9 2.2.8 trunk 1.10 1.3.3 1.3.4 1.3.5 1.3.5.1 1.3.5.2 1.3.6 1.3.6.1 1.4 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.6 1.4.7 1.5 All 103 releases
imagify / views / modal-payment.php

modal-payment.php in Imagify Image Optimization: Optimize Images | Compress & Convert to WebP/AVIF 1.9.8, at views/modal-payment.php

434 lines 19.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 defined( 'ABSPATH' ) || die( 'Cheatin’ uh?' );
3 ?>
4 <div id="imagify-pricing-modal" class="imagify-modal imagify-payment-modal hide-if-no-js" aria-hidden="false" role="dialog">
5 <div class="imagify-modal-content">
6 <div class="imagify-modal-main">
7
8 <?php
9 /**
10 * FIRST MODAL VIEW.
11 */
12 ?>
13
14 <div class="imagify-modal-views imagify-pre-checkout-view" id="imagify-pre-checkout-view" aria-hidden="false">
15
16 <div class="imagify-modal-section section-gray imagify-estimation-block imagify-analyzing">
17 <p class="imagify-modal-title">
18 <span class="imagify-numbers-calc"><?php esc_html_e( 'We analyzed your images', 'imagify' ); ?></span>
19 <span class="imagify-numbers-notcalc"><?php esc_html_e( 'We are analyzing your images', 'imagify' ); ?></span>
20 </p>
21
22 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>loader-balls.svg" width="77" height="48" alt="<?php esc_attr_e( 'Analyzing', 'imagify' ); ?>" class="imagify-loader">
23
24 <div class="imagify-modal-cols">
25 <div class="imagify-col">
26 <p>
27 <span class="imagify-border-styled">
28 <?php
29 $attachments_number = imagify_count_attachments() + Imagify_Files_Stats::count_all_files();
30
31 printf(
32 /* translators: %s is a formatted number (don't use %d). */
33 _n( 'You have %s original image', 'You have %s original images', $attachments_number, 'imagify' ),
34 '</span><span class="imagify-big-number">' . number_format_i18n( $attachments_number ) . '</span><span class="imagify-border-styled">'
35 );
36 ?>
37 </span>
38 </p>
39 </div>
40 <div class="imagify-col">
41 <p class="imagify-iconed">
42 <i class="dashicons dashicons-images-alt2" aria-hidden="true"></i>
43 <?php
44 printf(
45 /* translators: %s is a formatted file size. */
46 esc_html__( 'You currently have %s of images in your library and folders.', 'imagify' ),
47 '<strong class="imagify-dark total-library-size">0</strong>'
48 );
49 ?>
50 </p>
51 <p class="imagify-iconed">
52 <i class="dashicons dashicons-cloud" aria-hidden="true"></i>
53 <?php
54 printf(
55 /* translators: %s is a formatted file size. */
56 esc_html__( 'You upload around %s of images per month.', 'imagify' ),
57 '<strong class="imagify-dark average-month-size">0</strong>'
58 );
59 ?>
60 </p>
61 </div>
62 </div>
63 </div><!-- .imagify-modal-section -->
64
65 <?php $this->print_template( 'part-discount-banner' ); ?>
66
67 <div class="imagify-modal-section imagify-pre-checkout-offers">
68 <p class="imagify-modal-title">
69 <span class="imagify-not-enough-title"><?php esc_html_e( 'Our recommendation for you', 'imagify' ); ?></span>
70 <span class="imagify-enough-title"><?php esc_html_e( 'The free plan is enough to optimize your images', 'imagify' ); ?></span>
71 <br/><span class="imagify-inner-sub-title"><?php esc_html_e( 'Based on your recent upload usage.', 'imagify' ); ?></span>
72 </p>
73
74 <div class="imagify-offer-line imagify-offer-monthly imagify-offer-selected imagify-month-selected" data-offer='{"lite":{"id":3,"name":"Lite","data":1073741824,"dataf":"1 GB","imgs":5000,"prices":{"monthly":4.99,"yearly":4.16,"add":4}}}'>
75 <div class="imagify-offer-header">
76 <p class="imagify-offer-title imagify-switch-my">
77 <span aria-hidden="false" class="imagify-monthly"><?php esc_html_e( 'Subscribe to a monthly plan', 'imagify' ); ?></span>
78 <span aria-hidden="true" class="imagify-yearly"><?php esc_html_e( 'Subscribe to a yearly plan', 'imagify' ); ?></span>
79 </p>
80 <div class="imagify-inline-options imagify-radio-line">
81 <input id="imagify-subscription-monthly" type="radio" value="monthly" name="plan-subscription" checked="checked">
82 <label for="imagify-subscription-monthly"><?php esc_html_e( 'Monthly', 'imagify' ); ?></label>
83
84 <input id="imagify-subscription-yearly" type="radio" value="yearly" name="plan-subscription">
85 <label for="imagify-subscription-yearly"><?php esc_html_e( 'Yearly', 'imagify' ); ?><span class="imagify-2-free"><?php esc_html_e( '2 months free', 'imagify' ); ?></span></label>
86 </div><!-- .imagify-radio-line -->
87 </div><!-- .imagify-offer-header -->
88
89 <div class="imagify-offer-content imagify-flex-table">
90
91 <div class="imagify-col-checkbox">
92 <input type="checkbox" name="imagify-offer" id="imagify-offer-1gb" value="1Gb" checked="checked" class="imagify-checkbox medium">
93 <label for="imagify-offer-1gb">
94 <span class="imagify-the-offer">
95 <span class="imagify-offer-size">1 GB</span>
96 <span class="imagify-offer-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
97 </span>
98 <span class="imagify-approx">
99 <?php
100 printf(
101 /* translators: %s is a formatted number (don't use %d). */
102 esc_html__( 'approx: %s images', 'imagify' ),
103 '<span class="imagify-approx-nb">' . number_format_i18n( 5000 ) . '</span>'
104 );
105 ?>
106 </span>
107 </label>
108 </div>
109 <div class="imagify-col-price imagify-flex-table">
110 <span class="imagify-price-block">
111 <span class="imagify-dollars">$</span>
112 <span class="imagify-number-block">
113 <span class="imagify-switch-my">
114 <span class="imagify-monthly" aria-hidden="false">
115 <span class="imagify-price-big">3</span>
116 <span class="imagify-price-mini">.99</span>
117 </span>
118 <span class="imagify-yearly" aria-hidden="true">
119 <span class="imagify-price-big">3</span>
120 <span class="imagify-price-mini">.16</span>
121 </span>
122 </span>
123 <span class="imagify-price-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
124 </span>
125 </span>
126
127 <p class="imagify-price-complement">
128 <?php
129 printf(
130 /* translators: %s is a formatted price. */
131 __( '%s per<br>additional Gb', 'imagify' ),
132 '<span class="imagify-price-add-data"></span>'
133 );
134 ?>
135 </p>
136
137 </div>
138 <div class="imagify-col-other-actions">
139 <a href="#imagify-plans-selection-view" class="imagify-choose-another-plan" data-imagify-choose="plan"><?php esc_html_e( 'Choose another plan', 'imagify' ); ?></a>
140 </div>
141
142 </div><!-- .imagify-offer-content -->
143
144 </div><!-- .imagify-offer-line -->
145
146 <div class="imagify-offer-line imagify-offer-onetime" data-offer='{"recommended":{"id":999,"name":"Customized","data":3000001337,"dataf":"3 GB","imgs":54634,"price":28.98}}'>
147 <div class="imagify-offer-header">
148 <p class="imagify-offer-title">
149 <?php esc_html_e( 'Optimize the images you already have with a One Time plan', 'imagify' ); ?>
150 </p>
151 </div><!-- .imagify-offer-header -->
152
153 <div class="imagify-offer-content imagify-flex-table">
154
155 <div class="imagify-col-checkbox">
156 <input type="checkbox" name="imagify-offer" id="imagify-offer-custom" value="1Gb" checked="checked" class="imagify-checkbox medium">
157 <label for="imagify-offer-custom">
158 <span class="imagify-the-offer">
159 <span class="imagify-offer-size">3 GB</span>
160 </span>
161 <span class="imagify-approx">
162 <?php
163 printf(
164 /* translators: %s is a formatted number (don't use %d). */
165 esc_html__( 'approx: %s images', 'imagify' ),
166 '<span class="imagify-approx-nb">' . number_format_i18n( 54000 ) . '</span>'
167 );
168 ?>
169 </span>
170 </label>
171 </div>
172 <div class="imagify-col-price imagify-flex-table">
173 <span class="imagify-price-block">
174 <span class="imagify-dollars">$</span>
175 <span class="imagify-number-block">
176 <span class="imagify-price-big"></span>
177 <span class="imagify-price-mini"></span>
178 </span>
179 </span>
180 </div>
181 <div class="imagify-col-other-actions">
182 <a href="#imagify-plans-selection-view" class="imagify-choose-another-plan" data-imagify-choose="onetime"><?php esc_html_e( 'Choose another plan', 'imagify' ); ?></a>
183 </div>
184
185 </div><!-- .imagify-offer-content -->
186
187 </div><!-- .imagify-offer-line -->
188
189
190 <div class="imagify-submit-line">
191 <div class="imagify-coupon-section">
192 <p class="imagify-coupon-text">
193
194 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>loader-balls.svg" width="60" height="36" alt="<?php esc_attr_e( 'Checking Coupon', 'imagify' ); ?>" class="imagify-coupon-loader">
195
196 <label for="imagify-coupon-code"><?php _e( 'If you have a <strong>coupon code</strong><br> use it here:', 'imagify' ); ?></label>
197 </p>
198 <p class="imagify-coupon-input">
199 <input type="text" class="imagify-coupon-code" name="imagify-coupon-code" id="imagify-coupon-code" value="" placeholder="<?php _e( 'Coupon Code', 'imagify' ); ?>" autocomplete="off">
200 <button type="button" class="button button-secondary imagify-button-secondary" id="imagify-coupon-validate"><?php _e( 'OK' ); ?></button>
201 </p>
202 </div>
203 <div class="imagify-submit-section">
204 <button type="button" class="button button-secondary imagify-button-secondary" id="imagify-modal-checkout-btn">
205 <i class="dashicons dashicons-cart" aria-hidden="true"></i>
206 <?php _e( 'Checkout', 'imagify' ); ?>
207 </button>
208 </div>
209 </div>
210
211 <p class="imagify-footer-lines"><?php esc_html_e( 'Monthly plans come with credits which are renewed every month. The billing happens automatically each month or year, depending on which billing period you choose.', 'imagify' ); ?></p>
212 </div>
213 </div><!-- .imagify-pre-checkout-view -->
214
215 <?php
216 /**
217 * SECOND MODAL VIEW.
218 */
219 ?>
220
221 <div class="imagify-modal-views imagify-plans-selection-view" id="imagify-plans-selection-view" aria-hidden="true">
222 <p class="imagify-modal-title"><?php _e( 'Choose a plan', 'imagify' ); ?></p>
223 <ul class="imagify-tabs" role="tablist">
224 <li class="imagify-tab imagify-current">
225 <a href="#imagify-pricing-tab-monthly" role="tab" aria-controls="imagify-pricing-tab-monthly" aria-selected="true">
226 <?php esc_html_e( 'Monthly Plans', 'imagify' ); ?>
227 </a>
228 </li>
229 <li class="imagify-tab">
230 <a href="#imagify-pricing-tab-onetime" role="tab" aria-controls="imagify-pricing-tab-onetime" aria-selected="false">
231 <?php esc_html_e( 'One Time Plans', 'imagify' ); ?>
232 </a>
233 </li>
234 </ul><!-- .imagify-tabs -->
235
236 <div class="imagify-tabs-contents">
237
238 <div class="imagify-tab-content imagify-current" id="imagify-pricing-tab-monthly" role="tabpanel">
239
240 <div class="imagify-modal-section section-gray">
241 <p><?php esc_html_e( 'Monthly plans come with credits which is renewed every months. The billing happens automatically each month or year depending the billing period you choose.', 'imagify' ); ?></p>
242 </div>
243
244 <?php $this->print_template( 'part-settings-discount-banner' ); ?>
245
246 <div class="imagify-inline-options imagify-small-options imagify-radio-line">
247 <input id="imagify-pricing-montly" type="radio" value="monthly" name="plan-pricing" checked="checked">
248 <label for="imagify-pricing-montly"><?php esc_html_e( 'Monthly', 'imagify' ); ?></label>
249
250 <input id="imagify-pricing-yearly" type="radio" value="yearly" name="plan-pricing">
251 <label for="imagify-pricing-yearly"><?php esc_html_e( 'Yearly', 'imagify' ); ?><span class="imagify-2-free imagify-b-right"><?php esc_html_e( '2 months free', 'imagify' ); ?></span></label>
252 </div><!-- .imagify-radio-line -->
253
254
255 <div class="imagify-pricing-table imagify-month-selected">
256
257 <script type="text/html" id="imagify-offer-monthly-template"><div class="imagify-offer-line imagify-offer-monthlies imagify-flex-table">
258 <div class="imagify-col-details">
259 <p class="imagify-label">
260 <span class="imagify-the-offer">
261 <span class="imagify-offer-size"></span>
262 <span class="imagify-offer-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
263 </span>
264 <span class="imagify-approx">
265 <?php
266 printf(
267 /* translators: %s is a formatted number (don't use %d). */
268 __( 'approx: %s images', 'imagify' ),
269 '<span class="imagify-approx-nb"></span>'
270 );
271 ?>
272 </span>
273 </p>
274 </div>
275 <div class="imagify-col-price imagify-flex-table">
276 <span class="imagify-price-block">
277 <span class="imagify-dollars">$</span>
278 <span class="imagify-number-block">
279 <span class="imagify-switch-my"></span>
280 <span class="imagify-price-by"><?php esc_html_e( '/month', 'imagify' ); ?></span>
281 </span>
282 </span>
283
284 <span class="imagify-recommend" aria-hidden="true"><?php esc_html_e( 'we recommend for you', 'imagify' ); ?></span>
285
286 <p class="imagify-price-complement">
287 <?php
288 printf(
289 /* translators: %s is a formatted price. */
290 __( '%s per<br>additionnal Gb', 'imagify' ),
291 '<span class="imagify-price-add-data"></span>'
292 );
293 ?>
294 </p>
295
296 </div><!-- .imagify-col-price -->
297
298 <div class="imagify-col-other-actions">
299 <button type="button" class="button imagify-button-secondary mini imagify-payment-btn-select-plan"><?php esc_html_e( 'Choose plan', 'imagify' ); ?></button>
300 </div>
301 </div><!-- .imagify-offer-line --></script>
302 </div><!-- .imagify-pricing-table -->
303
304 <div class="imagify-cols">
305 <div class="imagify-col imagify-txt-start">
306 <p class="imagify-special-needs">
307 <strong><?php esc_html_e( 'Need more?', 'imagify' ); ?></strong>
308 <span><?php esc_html_e( 'for special needs', 'imagify' ); ?></span>
309 </p>
310 </div>
311 <div class="imagify-col imagify-txt-end">
312 <p><a class="button imagify-button-ghost imagify-button-medium imagify-mt1 imagify-mb1 imagify-mr1" href="<?php echo esc_html( imagify_get_external_url( 'contact' ) ); ?>" target="_blank"><i class="dashicons dashicons-email" aria-hidden="true"></i>&nbsp;<?php esc_html_e( 'Contact Us', 'imagify' ); ?></a></p>
313 </div>
314 </div>
315
316 </div><!-- .imagify-tab-content -->
317 <div class="imagify-tab-content" id="imagify-pricing-tab-onetime" role="tabpanel">
318 <div class="imagify-modal-section section-gray">
319 <p><?php esc_html_e( 'One Time plans are useful if you have a lots of existing images which need to be optimized. You can use it for bulk optimizing all your past images. You will pay only once.', 'imagify' ); ?></p>
320 </div>
321
322 <div class="imagify-pricing-table imagify-month-selected">
323 <script type="text/html" id="imagify-offer-onetime-template"><div class="imagify-offer-line imagify-flex-table imagify-offer-onetimes">
324 <div class="imagify-col-details">
325 <p class="imagify-label">
326 <span class="imagify-the-offer">
327 <span class="imagify-offer-size"></span>
328 </span>
329 <span class="imagify-approx">
330 <?php
331 printf(
332 /* translators: %s is a formatted number (don't use %d). */
333 __( 'approx: %s images', 'imagify' ),
334 '<span class="imagify-approx-nb"></span>'
335 );
336 ?>
337 </span>
338 </p>
339 </div>
340 <div class="imagify-col-price">
341 <span class="imagify-price-block">
342 <span class="imagify-dollars">$</span>
343 <span class="imagify-number-block"></span>
344 </span>
345 <span class="imagify-recommend"><?php esc_html_e( 'we recommend for you', 'imagify' ); ?></span>
346 </div><!-- .imagify-col-price -->
347
348 <div class="imagify-col-other-actions">
349 <button type="button" class="button imagify-button-secondary mini imagify-payment-btn-select-plan"><?php esc_html_e( 'Choose plan', 'imagify' ); ?></button>
350 </div>
351 </div><!-- .imagify-offer-line --></script>
352 </div><!-- .imagify-pricing-table -->
353
354 </div><!-- .imagify-tab-content -->
355
356 </div><!-- .imagify-tabs-contents -->
357 </div><!-- .imagify-plans-selection-view -->
358
359
360 <?php
361 /**
362 * THIRD MODAL VIEW.
363 */
364 ?>
365
366 <div class="imagify-modal-views imagify-payment-process-view" id="imagify-payment-process-view" aria-hidden="true">
367
368 <iframe data-imagify-api="<?php echo esc_attr( get_imagify_option( 'api_key' ) ); ?>" id="imagify-payment-iframe" data-src="<?php echo esc_url( imagify_get_external_url( 'payment' ) ); ?>" name="imagify-payment-iframe"></iframe>
369
370 </div><!-- .imagify-modal-views -->
371
372 <?php
373 /**
374 * SUCCESS VIEW.
375 */
376 ?>
377
378 <div class="imagify-modal-views imagify-success-view" id="imagify-success-view" aria-hidden="true">
379 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>big-blue-check.png" width="113" height="109" alt="">
380 <p><?php esc_html_e( 'Thank you for being awesome!', 'imagify' ); ?></p>
381 </div><!-- .imagify-modal-views -->
382
383 <button class="close-btn" type="button">
384 <i aria-hidden="true" class="dashicons dashicons-no-alt"></i>
385 <span class="screen-reader-text"><?php esc_html_e( 'Close', 'imagify' ); ?></span>
386 </button>
387
388 </div><!-- .imagify-modal-main -->
389
390 <div class="imagify-modal-sidebar">
391 <div class="imagify-modal-sidebar-content imagify-txt-start">
392 <p class="imagify-modal-sidebar-title"><?php esc_html_e( 'What do our users think about Imagify', 'imagify' ); ?></p>
393
394 <div class="imagify-modal-testimony">
395 <div class="imagify-modal-testimony-person">
396 <span class="imagify-modal-avatar">
397 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>pic-srhdesign.jpg" alt="">
398 </span>
399 <p class="imagify-modal-identity">
400 <a href="https://twitter.com/SRHDesign/status/686486119249260544" target="_blank">@SRHDesign</a>
401 </p>
402 </div>
403 <div class="imagify-modal-testimony-content">
404 <p>@imagify is an awesome tool that is powerful &amp; easy to use. It's fast, rivals and surpasses other established plugins/software. Awesome!</p>
405 </div>
406 </div>
407
408 <div class="imagify-modal-testimony">
409 <div class="imagify-modal-testimony-person">
410 <span class="imagify-modal-avatar">
411 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>pic-ericwaltr.jpg" alt="">
412 </span>
413 <p class="imagify-modal-identity">
414 <a href="https://twitter.com/EricWaltR/status/679053496382038016" target="_blank">@EricWaltr</a>
415 </p>
416 </div>
417 <div class="imagify-modal-testimony-content">
418 <p>Clearly @imagify is the most awesome tool to compress images on your website! A must try</p>
419 </div>
420 </div>
421
422 <div class="imagify-modal-sidebar-trust imagify-txt-center">
423 <p class="imagify-secondary">
424 <img src="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>icon-lock.png" srcset="<?php echo IMAGIFY_ASSETS_IMG_URL; ?>icon-lock.svg 2x" width="16" height="19" alt="">&nbsp;<?php esc_html_e( 'Secure Credit Card Payment', 'imagify' ); ?></p>
425 <p><?php esc_html_e( 'This is secure 128-bits SSL encrypted payment', 'imagify' ); ?></p>
426 </div>
427 </div>
428 </div><!-- .imagify-modal-sidebar -->
429
430 <div class="imagify-modal-loader"></div>
431 </div><!-- .imagify-modal-content-->
432 </div><!-- .imagify-payment-modal -->
433 <?php
434