| |
| <?php
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| add_action( 'wp_head', 'gp_phase4_styles' );
|
|
|
| function gp_phase4_styles() {
|
| if ( ! is_checkout() && ! is_wc_endpoint_url( 'order-pay' ) ) {
|
| return;
|
| }
|
| ?>
|
| <style id="gp-phase4-styles">
|
|
|
|
|
| text-transform: none !important;
|
| }
|
|
|
| padding: 16px 20px;
|
| margin: 0;
|
| }
|
|
|
| font-size: 15px;
|
| font-weight: 600;
|
| margin: 0 0 10px 0;
|
| padding: 0;
|
| color: inherit;
|
| line-height: 1.4;
|
| }
|
|
|
| border-bottom: 1px solid
|
| }
|
|
|
| border-bottom: none;
|
| }
|
|
|
| display: flex;
|
| align-items: center;
|
| justify-content: space-between;
|
| width: 100%;
|
| padding: 10px 0;
|
| margin: 0;
|
| background: none;
|
| border: none;
|
| cursor: pointer;
|
| font-size: 13px;
|
| font-weight: 600;
|
| color:
|
| line-height: 1.4;
|
| text-align: left;
|
| font-family: inherit;
|
| gap: 12px;
|
| }
|
|
|
| color:
|
| }
|
|
|
| outline: none;
|
| }
|
|
|
| flex-shrink: 0;
|
| width: 16px;
|
| height: 16px;
|
| transition: transform 0.2s ease;
|
| stroke:
|
| }
|
|
|
| transform: rotate(180deg);
|
| }
|
|
|
| max-height: 0;
|
| overflow: hidden;
|
| transition: max-height 0.25s ease, padding 0.25s ease;
|
| padding: 0 0 0 0;
|
| }
|
|
|
| max-height: 200px;
|
| padding: 0 0 10px 0;
|
| }
|
|
|
| font-size: 13px;
|
| color:
|
| line-height: 1.6;
|
| margin: 0;
|
| padding: 0;
|
| }
|
| @media (max-width: 480px) {
|
|
|
| padding: 12px 14px;
|
| }
|
| }
|
| </style>
|
| <?php
|
| }
|
|
|
| add_action( 'wp_footer', 'gp_phase4_inject_faq' );
|
|
|
| function gp_phase4_inject_faq() {
|
| if ( ! is_checkout() && ! is_wc_endpoint_url( 'order-pay' ) ) {
|
| return;
|
| }
|
| ?>
|
| <script id="gp-phase4-inject">
|
| (function() {
|
| 'use strict';
|
|
|
| var FAQ_ID = 'gp-checkout-faq';
|
|
|
| var chevronSVG = '<svg class="gp-faq-chevron" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>';
|
|
|
| var faqs = [
|
| {
|
| q: 'Why am I being redirected to a different page?',
|
| a: 'Your order is being enrolled in GuardedPay Pro, our coverage partner. You will be returned to our site automatically after enrollment completes.'
|
| },
|
| {
|
| q: 'What is the 4% coverage fee?',
|
| a: 'A small coverage fee is included in your total. This provides warranty protection on your purchase at no additional action required from you. The fee breakdown is shown in your order summary.'
|
| },
|
| {
|
| q: 'Do I need to do anything with the warranty code?',
|
| a: 'No. After enrollment, you receive a warranty reference code automatically. Your order confirms instantly — just click "Return to merchant" or close the tab. Either way, your order is complete.'
|
| },
|
| {
|
| q: 'Is my payment secure?',
|
| a: 'Yes. All transactions are processed through a Tier 1 payment gateway with full card verification (AVS + CVV). Your card details are never stored on our servers.'
|
| }
|
| ];
|
|
|
| function buildHTML() {
|
| var html = '<div id="' + FAQ_ID + '">';
|
| html += '<div class="gp-faq-title">Frequently Asked Questions</div>';
|
|
|
| for (var i = 0; i < faqs.length; i++) {
|
| html += '<div class="gp-faq-item">';
|
| html += '<button class="gp-faq-q" data-gp-faq="' + i + '">';
|
| html += '<span>' + faqs[i].q + '</span>';
|
| html += chevronSVG;
|
| html += '</button>';
|
| html += '<div class="gp-faq-a"><p>' + faqs[i].a + '</p></div>';
|
| html += '</div>';
|
| }
|
|
|
| html += '</div>';
|
| return html;
|
| }
|
|
|
| function bindAccordion() {
|
| var faqEl = document.getElementById(FAQ_ID);
|
| if (!faqEl) return;
|
|
|
| var buttons = faqEl.querySelectorAll('.gp-faq-q');
|
| for (var i = 0; i < buttons.length; i++) {
|
| buttons[i].addEventListener('click', function(e) {
|
| e.preventDefault();
|
| var item = this.closest('.gp-faq-item');
|
| if (!item) return;
|
|
|
|
|
| var siblings = item.parentElement.querySelectorAll('.gp-faq-item.open');
|
| for (var j = 0; j < siblings.length; j++) {
|
| if (siblings[j] !== item) {
|
| siblings[j].classList.remove('open');
|
| }
|
| }
|
|
|
|
|
| item.classList.toggle('open');
|
| });
|
| }
|
| }
|
|
|
| function inject() {
|
| if (document.getElementById(FAQ_ID)) return true;
|
|
|
| var box = document.querySelector('.payment_box.payment_method_guardedpay_pro');
|
| if (!box) return false;
|
|
|
|
|
| box.insertAdjacentHTML('beforeend', buildHTML());
|
| bindAccordion();
|
| return true;
|
| }
|
|
|
| if (!inject()) {
|
| document.addEventListener('DOMContentLoaded', function() {
|
| if (!inject()) {
|
| setTimeout(inject, 500);
|
| setTimeout(inject, 1500);
|
| }
|
| });
|
| }
|
|
|
| var observer = new MutationObserver(function() {
|
| inject();
|
| });
|
|
|
| function startObserving() {
|
| var payment = document.getElementById('payment');
|
| if (payment) {
|
| observer.observe(payment, { childList: true, subtree: true });
|
| }
|
| }
|
|
|
| if (document.readyState === 'loading') {
|
| document.addEventListener('DOMContentLoaded', startObserving);
|
| } else {
|
| startObserving();
|
| }
|
|
|
| if (typeof jQuery !== 'undefined') {
|
| jQuery(document.body).on('updated_checkout', function() {
|
| setTimeout(inject, 100);
|
| });
|
| }
|
| })();
|
| </script>
|
| <?php
|
| }
|
| |
| |
Comments