| @@ -39,10 +39,8 @@ | ||
| 39 | 39 | $this->options = Fns::get_options( 'modules', 'shopify_checkout' ); // Assign options to the global variable. |
| 40 | 40 | $shopify_checkout_options = $this->options; |
| 41 | 41 | add_filter( 'template_include', [ $this, 'custom_checkout_template' ], 99 ); |
| 42 | 42 | add_action( 'wp_enqueue_scripts', [ $this, 'enqueue_public_scripts' ], 99 ); |
| 43 | - add_action( 'wp_enqueue_scripts', [ $this, 'disable_elementor_assets' ], 100 ); | |
| 44 | - add_action( 'wp_print_scripts', [ $this, 'disable_elementor_assets' ], 100 ); | |
| 45 | 43 | do_action( 'rtsb/loaded/shopify/checkout' ); |
| 46 | 44 | } |
| 47 | 45 | /** |
| 48 | 46 | * @param string $template path. |
| @@ -51,14 +49,15 @@ | ||
| 51 | 49 | public function custom_checkout_template( $template ) { |
| 52 | 50 | if ( defined( 'RTSBPRO_VERSION' ) && version_compare( RTSBPRO_VERSION, '1.8.0', '<' ) ) { |
| 53 | 51 | return $template; |
| 54 | 52 | } |
| 55 | - if ( ! $this->is_shopify_checkout_page() ) { | |
| 53 | + $is_checkout_page = is_checkout() && ! is_order_received_page(); | |
| 54 | + if ( ! $is_checkout_page ) { | |
| 56 | 55 | return $template; |
| 57 | 56 | } |
| 58 | 57 | $shopify_template = 'shopify-checkout/checkout'; |
| 59 | 58 | $custom_template = Fns::locate_template( $shopify_template ); |
| 60 | - if ( file_exists( $custom_template ) ) { | |
| 59 | + if ( is_checkout() && file_exists( $custom_template ) ) { | |
| 61 | 60 | return $custom_template; |
| 62 | 61 | } |
| 63 | 62 | return $template; |
| 64 | 63 | } |
| @@ -63,90 +62,11 @@ | ||
| 63 | 62 | return $template; |
| 64 | 63 | } |
| 65 | 64 | |
| 66 | 65 | /** |
| 67 | - * Determine if the current request will render the Shopify-style checkout template. | |
| 68 | - * | |
| 69 | - * @return bool True when on the WooCommerce checkout page (not order-received, not pay page). | |
| 70 | - */ | |
| 71 | - public function is_shopify_checkout_page() { | |
| 72 | - if ( ! function_exists( 'is_checkout' ) ) { | |
| 73 | - return false; | |
| 74 | - } | |
| 75 | - return is_checkout() && ! is_order_received_page() && ! is_checkout_pay_page(); | |
| 76 | - } | |
| 77 | - | |
| 78 | - /** | |
| 79 | - * Dequeue/deregister Elementor frontend scripts on the Shopify checkout page. | |
| 80 | - * | |
| 81 | - * The Shopify-style checkout overrides the page template, so Elementor does | |
| 82 | - * not localize `elementorFrontendConfig`. Any Elementor frontend script that | |
| 83 | - * still loads (via theme header/footer or other plugins) throws | |
| 84 | - * "elementorFrontendConfig is not defined". Strip those handles here so the | |
| 85 | - * Shopify checkout stays fully independent of Elementor JS. | |
| 86 | - * | |
| 87 | - * Filterable via `rtsb/shopify_checkout/disable_elementor` (bool) and | |
| 88 | - * `rtsb/shopify_checkout/dequeue_handles` (array of script handles). | |
| 89 | - * | |
| 90 | 66 | * @return void |
| 91 | 67 | */ |
| 92 | - public function disable_elementor_assets() { | |
| 93 | - if ( ! $this->is_shopify_checkout_page() ) { | |
| 94 | - return; | |
| 95 | - } | |
| 96 | - if ( ! apply_filters( 'rtsb/shopify_checkout/disable_elementor', true ) ) { | |
| 97 | - return; | |
| 98 | - } | |
| 99 | - $handles = apply_filters( | |
| 100 | - 'rtsb/shopify_checkout/dequeue_handles', | |
| 101 | - [ | |
| 102 | - 'elementor-frontend', | |
| 103 | - 'elementor-frontend-modules', | |
| 104 | - 'elementor-pro-frontend', | |
| 105 | - 'elementor-sticky', | |
| 106 | - 'elementor-waypoints', | |
| 107 | - ] | |
| 108 | - ); | |
| 109 | - foreach ( $handles as $handle ) { | |
| 110 | - wp_dequeue_script( $handle ); | |
| 111 | - wp_deregister_script( $handle ); | |
| 112 | - } | |
| 113 | - } | |
| 114 | - | |
| 115 | - /** | |
| 116 | - * @return void | |
| 117 | - */ | |
| 118 | 68 | public function enqueue_public_scripts() { |
| 119 | - // Enqueue assets. | |
| 120 | - Fns::enqueue_module_assets( | |
| 121 | - Fns::optimized_handle( 'rtsb-shopify-checkout' ), | |
| 122 | - 'shopify-checkout', | |
| 123 | - [ | |
| 124 | - 'type' => 'css', | |
| 125 | - ] | |
| 126 | - ); | |
| 127 | - | |
| 128 | - // The Shopify-style checkout template always renders `.rtsb-sticky-element`, | |
| 129 | - // which the frontend bundle initialises via `theiaStickySidebar()`. Ensure | |
| 130 | - // the vendor handle is enqueued whenever it is registered (Pro is active), | |
| 131 | - // regardless of multi-step mode, so `$().theiaStickySidebar is not a function` | |
| 132 | - // can never occur on the Shopify checkout page. | |
| 133 | - if ( $this->is_shopify_checkout_page() && wp_script_is( 'rtsb-sticky-sidebar', 'registered' ) ) { | |
| 134 | - wp_enqueue_script( 'rtsb-sticky-sidebar' ); | |
| 135 | - } | |
| 136 | - | |
| 137 | - // Flag for frontend JS modules to skip Elementor-dependent code paths. | |
| 138 | - $is_shopify_checkout = $this->is_shopify_checkout_page(); | |
| 139 | - $disable_elementor = $is_shopify_checkout && apply_filters( 'rtsb/shopify_checkout/disable_elementor', true ); | |
| 140 | - wp_localize_script( | |
| 141 | - Fns::optimized_handle( 'rtsb-public' ), | |
| 142 | - 'rtsbShopifyCheckoutMeta', | |
| 143 | - [ | |
| 144 | - 'isShopifyCheckout' => $is_shopify_checkout, | |
| 145 | - 'disableElementor' => $disable_elementor, | |
| 146 | - ] | |
| 147 | - ); | |
| 148 | - | |
| 149 | 69 | $cache_key = 'shopify_style_cache'; |
| 150 | 70 | |
| 151 | 71 | // Selector variables. |
| 152 | 72 | $step_menu_selector = '.shopify-multistep-menu ul li a'; |
| @@ -160,78 +80,79 @@ | ||
| 160 | 80 | $login_button_selector = '.rtsb-checkout-page-form .woocommerce-form-login__submit'; |
| 161 | 81 | $footer_text = '.rtsb-checkout-page-footer'; |
| 162 | 82 | $cart_icon = '.rtsb-checkout-page-container .rtsb-checkout-page-header .header-right-side a'; |
| 163 | 83 | |
| 164 | - // phpcs:disable | |
| 165 | - // Disabled phpcs for one-liner display. | |
| 166 | - $css_properties = [ | |
| 167 | - 'header_cart_icon_color' => [ 'selector' => $cart_icon, 'property' => 'color' ], | |
| 168 | - 'header_cart_icon_hover_color' => [ 'selector' => "$cart_icon:hover", 'property' => 'color' ], | |
| 169 | - 'header_cart_icon_font_size' => [ 'selector' => $cart_icon, 'property' => 'font-size', 'unit' => 'px' ], | |
| 170 | - 'shopify_cart_icon_height' => [ 'selector' => "$cart_icon :is(svg, img)", 'property' => 'height', 'unit' => 'px' ], | |
| 171 | - 'cart_button_height' => [ 'selector' => $cart_icon, 'property' => 'height', 'unit' => 'px' ], | |
| 172 | - 'cart_button_width' => [ 'selector' => $cart_icon, 'property' => 'width', 'unit' => 'px' ], | |
| 173 | - 'cart_button_padding' => [ 'selector' => $cart_icon, 'property' => 'padding', 'unit' => 'px' ], | |
| 174 | - 'cart_button_border_style' => [ 'selector' => $cart_icon, 'property' => 'border-style' ], | |
| 175 | - 'cart_button_border_width' => [ 'selector' => $cart_icon, 'property' => 'border-width', 'unit' => 'px' ], | |
| 176 | - 'cart_button_border_color' => [ 'selector' => $cart_icon, 'property' => 'border-color' ], | |
| 177 | - 'cart_button_border_radius' => [ 'selector' => $cart_icon, 'property' => 'border-radius', 'unit' => 'px' ], | |
| 178 | - 'cart_button_bg_color' => [ 'selector' => $cart_icon, 'property' => 'background-color' ], | |
| 179 | - 'cart_button_hover_bg_color' => [ 'selector' => "$cart_icon:hover", 'property' => 'background-color' ], | |
| 180 | - 'step_menu_color' => [ 'selector' => $step_menu_selector, 'property' => 'color' ], | |
| 181 | - 'step_menu_hover_color' => [ 'selector' => "$step_menu_selector:hover, $step_menu_active_selector", 'property' => 'color' ], | |
| 182 | - 'step_menu_font_size' => [ 'selector' => $step_menu_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 183 | - 'next_button_height' => [ 'selector' => $next_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 184 | - 'next_button_width' => [ 'selector' => $next_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 185 | - 'next_button_font_size' => [ 'selector' => $next_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 186 | - 'next_button_color' => [ 'selector' => $next_button_selector, 'property' => 'color' ], | |
| 187 | - 'next_button_hover_color' => [ 'selector' => "$next_button_selector:hover", 'property' => 'color' ], | |
| 188 | - 'next_button_bg_color' => [ 'selector' => $next_button_selector, 'property' => 'background-color' ], | |
| 189 | - 'next_button_hover_bg_color' => [ 'selector' => "$next_button_selector:hover", 'property' => 'background-color' ], | |
| 190 | - 'next_button_border_color' => [ 'selector' => $next_button_selector, 'property' => 'border-color' ], | |
| 191 | - 'next_button_hover_border_color' => [ 'selector' => "$next_button_selector:hover", 'property' => 'border-color' ], | |
| 192 | - 'prev_button_height' => [ 'selector' => $prev_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 193 | - 'prev_button_width' => [ 'selector' => $prev_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 194 | - 'prev_button_font_size' => [ 'selector' => $prev_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 195 | - 'prev_button_bg_color' => [ 'selector' => $prev_button_selector, 'property' => 'background-color' ], | |
| 196 | - 'prev_button_hover_bg_color' => [ 'selector' => "$prev_button_selector:hover", 'property' => 'background-color' ], | |
| 197 | - 'prev_button_color' => [ 'selector' => $prev_button_selector, 'property' => 'color' ], | |
| 198 | - 'prev_button_hover_color' => [ 'selector' => "$prev_button_selector:hover", 'property' => 'color' ], | |
| 199 | - 'prev_button_border_color' => [ 'selector' => $prev_button_selector, 'property' => 'border-color' ], | |
| 200 | - 'prev_button_hover_border_color' => [ 'selector' => "$prev_button_selector:hover", 'property' => 'border-color' ], | |
| 201 | - 'coupon_height' => [ 'selector' => $coupon_input_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 202 | - 'coupon_button_font_size' => [ 'selector' => $coupon_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 203 | - 'coupon_button_bg_color' => [ 'selector' => $coupon_button_selector, 'property' => 'background-color' ], | |
| 204 | - 'coupon_button_hover_bg_color' => [ 'selector' => "$coupon_button_selector:hover", 'property' => 'background-color' ], | |
| 205 | - 'coupon_button_color' => [ 'selector' => $coupon_button_selector, 'property' => 'color' ], | |
| 206 | - 'coupon_button_hover_color' => [ 'selector' => "$coupon_button_selector:hover", 'property' => 'color' ], | |
| 207 | - 'coupon_button_border_color' => [ 'selector' => $coupon_button_selector, 'property' => 'border-color' ], | |
| 208 | - 'coupon_button_hover_border_color' => [ 'selector' => "$coupon_button_selector:hover", 'property' => 'border-color' ], | |
| 209 | - 'place_order_button_height' => [ 'selector' => $place_order_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 210 | - 'place_order_button_width' => [ 'selector' => $place_order_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 211 | - 'place_order_button_font_size' => [ 'selector' => $place_order_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 212 | - 'place_order_button_bg_color' => [ 'selector' => $place_order_button_selector, 'property' => 'background-color' ], | |
| 213 | - 'place_order_button_hover_bg_color' => [ 'selector' => "$place_order_button_selector:hover", 'property' => 'background-color' ], | |
| 214 | - 'place_order_button_color' => [ 'selector' => $place_order_button_selector, 'property' => 'color' ], | |
| 215 | - 'place_order_button_hover_color' => [ 'selector' => "$place_order_button_selector:hover", 'property' => 'color' ], | |
| 216 | - 'place_order_button_border_color' => [ 'selector' => $place_order_button_selector, 'property' => 'border-color' ], | |
| 84 | + // phpcs:disable | |
| 85 | + // Disabled phpcs for one-liner display. | |
| 86 | + $css_properties = [ | |
| 87 | + | |
| 88 | + 'header_cart_icon_color' => [ 'selector' => $cart_icon, 'property' => 'color' ], | |
| 89 | + 'header_cart_icon_hover_color' => [ 'selector' => "$cart_icon:hover", 'property' => 'color' ], | |
| 90 | + 'header_cart_icon_font_size' => [ 'selector' => $cart_icon, 'property' => 'font-size', 'unit' => 'px' ], | |
| 91 | + 'shopify_cart_icon_height' => [ 'selector' => "$cart_icon :is(svg, img)", 'property' => 'height', 'unit' => 'px' ], | |
| 92 | + | |
| 93 | + 'step_menu_color' => [ 'selector' => $step_menu_selector, 'property' => 'color' ], | |
| 94 | + 'step_menu_hover_color' => [ 'selector' => "$step_menu_selector:hover, $step_menu_active_selector", 'property' => 'color' ], | |
| 95 | + 'step_menu_font_size' => [ 'selector' => $step_menu_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 96 | + | |
| 97 | + 'next_button_height' => [ 'selector' => $next_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 98 | + 'next_button_width' => [ 'selector' => $next_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 99 | + 'next_button_font_size' => [ 'selector' => $next_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 100 | + 'next_button_color' => [ 'selector' => $next_button_selector, 'property' => 'color' ], | |
| 101 | + 'next_button_hover_color' => [ 'selector' => "$next_button_selector:hover", 'property' => 'color' ], | |
| 102 | + 'next_button_bg_color' => [ 'selector' => $next_button_selector, 'property' => 'background-color' ], | |
| 103 | + 'next_button_hover_bg_color' => [ 'selector' => "$next_button_selector:hover", 'property' => 'background-color' ], | |
| 104 | + 'next_button_border_color' => [ 'selector' => $next_button_selector, 'property' => 'border-color' ], | |
| 105 | + 'next_button_hover_border_color' => [ 'selector' => "$next_button_selector:hover", 'property' => 'border-color' ], | |
| 106 | + | |
| 107 | + 'prev_button_height' => [ 'selector' => $prev_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 108 | + 'prev_button_width' => [ 'selector' => $prev_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 109 | + 'prev_button_font_size' => [ 'selector' => $prev_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 110 | + 'prev_button_bg_color' => [ 'selector' => $prev_button_selector, 'property' => 'background-color' ], | |
| 111 | + 'prev_button_hover_bg_color' => [ 'selector' => "$prev_button_selector:hover", 'property' => 'background-color' ], | |
| 112 | + 'prev_button_color' => [ 'selector' => $prev_button_selector, 'property' => 'color' ], | |
| 113 | + 'prev_button_hover_color' => [ 'selector' => "$prev_button_selector:hover", 'property' => 'color' ], | |
| 114 | + 'prev_button_border_color' => [ 'selector' => $prev_button_selector, 'property' => 'border-color' ], | |
| 115 | + 'prev_button_hover_border_color' => [ 'selector' => "$prev_button_selector:hover", 'property' => 'border-color' ], | |
| 116 | + | |
| 117 | + 'coupon_height' => [ 'selector' => $coupon_input_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 118 | + 'coupon_button_font_size' => [ 'selector' => $coupon_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 119 | + 'coupon_button_bg_color' => [ 'selector' => $coupon_button_selector, 'property' => 'background-color' ], | |
| 120 | + 'coupon_button_hover_bg_color' => [ 'selector' => "$coupon_button_selector:hover", 'property' => 'background-color' ], | |
| 121 | + 'coupon_button_color' => [ 'selector' => $coupon_button_selector, 'property' => 'color' ], | |
| 122 | + 'coupon_button_hover_color' => [ 'selector' => "$coupon_button_selector:hover", 'property' => 'color' ], | |
| 123 | + 'coupon_button_border_color' => [ 'selector' => $coupon_button_selector, 'property' => 'border-color' ], | |
| 124 | + 'coupon_button_hover_border_color' => [ 'selector' => "$coupon_button_selector:hover", 'property' => 'border-color' ], | |
| 125 | + | |
| 126 | + 'place_order_button_height' => [ 'selector' => $place_order_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 127 | + 'place_order_button_width' => [ 'selector' => $place_order_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 128 | + 'place_order_button_font_size' => [ 'selector' => $place_order_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 129 | + 'place_order_button_bg_color' => [ 'selector' => $place_order_button_selector, 'property' => 'background-color' ], | |
| 130 | + 'place_order_button_hover_bg_color' => [ 'selector' => "$place_order_button_selector:hover", 'property' => 'background-color' ], | |
| 131 | + 'place_order_button_color' => [ 'selector' => $place_order_button_selector, 'property' => 'color' ], | |
| 132 | + 'place_order_button_hover_color' => [ 'selector' => "$place_order_button_selector:hover", 'property' => 'color' ], | |
| 133 | + 'place_order_button_border_color' => [ 'selector' => $place_order_button_selector, 'property' => 'border-color' ], | |
| 217 | 134 | 'place_order_button_hover_border_color' => [ 'selector' => "$place_order_button_selector:hover", 'property' => 'border-color' ], |
| 218 | - 'login_button_height' => [ 'selector' => $login_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 219 | - 'login_button_width' => [ 'selector' => $login_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 220 | - 'login_button_font_size' => [ 'selector' => $login_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 221 | - 'login_button_bg_color' => [ 'selector' => $login_button_selector, 'property' => 'background-color' ], | |
| 222 | - 'login_button_hover_bg_color' => [ 'selector' => "$login_button_selector:hover", 'property' => 'background-color' ], | |
| 223 | - 'login_button_color' => [ 'selector' => $login_button_selector, 'property' => 'color' ], | |
| 224 | - 'login_button_hover_color' => [ 'selector' => "$login_button_selector:hover", 'property' => 'color' ], | |
| 225 | - 'login_button_border_color' => [ 'selector' => $login_button_selector, 'property' => 'border-color' ], | |
| 226 | - 'login_button_hover_border_color' => [ 'selector' => "$login_button_selector:hover", 'property' => 'border-color' ], | |
| 227 | - 'footer_menu_color' => [ 'selector' => $footer_menu_selector, 'property' => 'color' ], | |
| 228 | - 'footer_menu_hover_color' => [ 'selector' => "$footer_menu_selector:hover", 'property' => 'color' ], | |
| 229 | - 'footer_menu_font_size' => [ 'selector' => $footer_menu_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 230 | - 'footer_text_size' => [ 'selector' => $footer_text, 'property' => 'font-size', 'unit' => 'px' ], | |
| 231 | - 'footer_text_color' => [ 'selector' => $footer_text, 'property' => 'color' ], | |
| 232 | - ]; | |
| 233 | - // phpcs:enable | |
| 135 | + | |
| 136 | + 'login_button_height' => [ 'selector' => $login_button_selector, 'property' => 'height', 'unit' => 'px' ], | |
| 137 | + 'login_button_width' => [ 'selector' => $login_button_selector, 'property' => 'min-width', 'unit' => 'px' ], | |
| 138 | + 'login_button_font_size' => [ 'selector' => $login_button_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 139 | + 'login_button_bg_color' => [ 'selector' => $login_button_selector, 'property' => 'background-color' ], | |
| 140 | + 'login_button_hover_bg_color' => [ 'selector' => "$login_button_selector:hover", 'property' => 'background-color' ], | |
| 141 | + 'login_button_color' => [ 'selector' => $login_button_selector, 'property' => 'color' ], | |
| 142 | + 'login_button_hover_color' => [ 'selector' => "$login_button_selector:hover", 'property' => 'color' ], | |
| 143 | + 'login_button_border_color' => [ 'selector' => $login_button_selector, 'property' => 'border-color' ], | |
| 144 | + 'login_button_hover_border_color' => [ 'selector' => "$login_button_selector:hover", 'property' => 'border-color' ], | |
| 145 | + | |
| 146 | + 'footer_menu_color' => [ 'selector' => $footer_menu_selector, 'property' => 'color' ], | |
| 147 | + 'footer_menu_hover_color' => [ 'selector' => "$footer_menu_selector:hover", 'property' => 'color' ], | |
| 148 | + 'footer_menu_font_size' => [ 'selector' => $footer_menu_selector, 'property' => 'font-size', 'unit' => 'px' ], | |
| 149 | + 'footer_text_size' => [ 'selector' => $footer_text, 'property' => 'font-size', 'unit' => 'px' ], | |
| 150 | + 'footer_text_color' => [ 'selector' => $footer_text, 'property' => 'color' ], | |
| 151 | + | |
| 152 | + | |
| 153 | + ]; | |
| 154 | + // phpcs:enable | |
| 234 | 155 | // Generate dynamic CSS. |
| 235 | 156 | Fns::dynamic_styles( $this->options, $cache_key, $css_properties ); |
| 236 | 157 | } |
| 237 | 158 | } |
