newsletter-form.php
95 lines
| 1 | <?php |
| 2 | /** |
| 3 | * @var bool $show_shipping_analytics_banner |
| 4 | * @var string $email |
| 5 | */ |
| 6 | ?> |
| 7 | <div id="fs-info-newsletter" class="fs-info-metabox fs-info-newsletter<?php echo esc_attr( $show_shipping_analytics_banner ? ' fs-shipping-analytics-banner' : '' ); ?>" style="display: none;"> |
| 8 | <?php if ( $show_shipping_analytics_banner ) : ?> |
| 9 | <div class="fs-shipping-analytics-banner__content"> |
| 10 | <h3> |
| 11 | <span aria-hidden="true">🚀</span> |
| 12 | <?php esc_html_e( 'Ready to optimize your WooCommerce shipping setup?', 'flexible-shipping' ); ?> |
| 13 | </h3> |
| 14 | <p> |
| 15 | <?php esc_html_e( 'Get actionable recommendations based on real checkout issues, missing rates, abandoned carts, and shipping configuration gaps. Be the first to access Shipping Analytics PRO.', 'flexible-shipping' ); ?> |
| 16 | </p> |
| 17 | </div> |
| 18 | <p class="fs-shipping-analytics-banner__action"> |
| 19 | <a class="oct-btn fs-shipping-analytics-banner__button" href="https://shipping-optimization.octolize.com/" target="_blank" rel="noopener noreferrer"> |
| 20 | <?php esc_html_e( 'Get FREE early access', 'flexible-shipping' ); ?> |
| 21 | <span aria-hidden="true">→</span> |
| 22 | </a> |
| 23 | </p> |
| 24 | <?php else : ?> |
| 25 | <h3><?php esc_html_e( 'Sign up for our newsletter', 'flexible-shipping' ); ?></h3> |
| 26 | <p> |
| 27 | <label for="fs-newsletter-email"><?php esc_html_e( 'Email:', 'flexible-shipping' ); ?></label> |
| 28 | <input id="fs-newsletter-email" type="text" value="<?php echo esc_attr( $email ); ?>"/> |
| 29 | </p> |
| 30 | <p> |
| 31 | <input id="fs-newsletter-checkbox" type="checkbox"> |
| 32 | <label for="fs-newsletter-checkbox"> |
| 33 | <?php echo wp_kses_post( |
| 34 | sprintf( |
| 35 | // Translators: link |
| 36 | __( 'I’d like to receive exclusive tips, updates, and special offers from Octolize by email. I can unsubscribe at any time. %1$sPrivacy Policy%2$s', 'flexible-shipping' ), |
| 37 | '<a href="https://octolize.com/terms-of-service/privacy-policy/" target="_blank">', |
| 38 | '</a>' |
| 39 | ) |
| 40 | );?> |
| 41 | </label> |
| 42 | </p> |
| 43 | <p><button id="fs-newsletter-submit" class="oct-btn" disabled="disabled">Submit</button> <span id="fs-newsletter-status"></span></p> |
| 44 | <?php endif; ?> |
| 45 | </div> |
| 46 | <script type="text/javascript"> |
| 47 | jQuery(document).ready(function() { |
| 48 | const $newsletter_element = jQuery('#fs-info-newsletter'); |
| 49 | const $newsletter_submit = jQuery('#fs-newsletter-submit'); |
| 50 | const $newsletter_status = jQuery('#fs-newsletter-status'); |
| 51 | |
| 52 | function clearStatus() { |
| 53 | $newsletter_status.html(''); |
| 54 | $newsletter_status.removeClass('success'); |
| 55 | $newsletter_status.removeClass('error'); |
| 56 | } |
| 57 | |
| 58 | jQuery('div.fs-info-wrapper').append($newsletter_element); |
| 59 | $newsletter_element.show(); |
| 60 | |
| 61 | jQuery('#fs-newsletter-checkbox').on('change', function() { |
| 62 | $newsletter_submit.prop( 'disabled', !jQuery(this).is(':checked') ); |
| 63 | }) |
| 64 | |
| 65 | $newsletter_submit.on('click', function(e) { |
| 66 | e.preventDefault(); |
| 67 | |
| 68 | $newsletter_submit.prop( 'disabled', true ); |
| 69 | clearStatus(); |
| 70 | |
| 71 | let data = { |
| 72 | email: jQuery('#fs-newsletter-email').val() |
| 73 | }; |
| 74 | |
| 75 | jQuery.ajax({ |
| 76 | url: "https://fsnewsletter.octolize.com/webhook/fs-newsleter-submit", |
| 77 | type: "GET", |
| 78 | data: data, |
| 79 | success: function(response) { |
| 80 | $newsletter_status.html(response); |
| 81 | $newsletter_status.addClass('success'); |
| 82 | }, |
| 83 | error: function(xhr) { |
| 84 | $newsletter_status.html(xhr.responseText); |
| 85 | $newsletter_status.addClass('error'); |
| 86 | console.log("Error:", xhr.responseText); |
| 87 | }, |
| 88 | complete: function() { |
| 89 | $newsletter_submit.prop( 'disabled', false ); |
| 90 | } |
| 91 | }); |
| 92 | }) |
| 93 | }) |
| 94 | </script> |
| 95 |