Support » Theme: Vogue » Woocommerce Checkout Spinner off screen

  • Hi,

    Using Vogue we are finding that the BlockUI spinner which appears after you press the ‘Pay/Checkout’ button on the Woocommerce checkout page is appearing at the very top of the page, which is off the screen. The overlay which is appearing is also very faint so the user (who has scrolled down to the bottom of the screen to press the ‘Pay/Checkout’ button doesn’t realise their checkout is processing.

    This seems to be specific to Vogue as the loading spinner appears inside the visible area when using other themes. Does anyone know how to make the BlockUI spinner appear in the part of the page that is visible to the user?
    I haven’t been able to style this using CSS because the styles are injected.


Viewing 1 replies (of 1 total)
  • I’ve figured out some more about this now. The form element which the blockUI is attached to is having position: relative set on it (injected inline) when clicking the ‘Pay/Checkout’ button. This is causing it to have 0 height so the blockUI and associated spinner appears at the top.
    If I quickly remove the position: relative rule from the form element while the checkout is still processing the entire page is covered up by the blockUI and spinner moves to the middle of the page (as expected).

    Any ideas as to how this position: relative declaration is being injected?


Viewing 1 replies (of 1 total)
  • The topic ‘Woocommerce Checkout Spinner off screen’ is closed to new replies.