Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.

Okay
  Public Ticket #4529506
Mobile header icons (Cart / Login / Wishlist) not rendering in WooCommerce – workaround applied, need proper fix
Open

Comments

  • Wawe_Com started the conversation

    Hello TheGem Support Team,

    We need your help with a mobile header limitation we have confirmed in TheGem when using WooCommerce + Elementor.

    Current status (important)

    At the moment, the site is usable only thanks to a temporary workaround, but this is not the desired UX.

    • We enabled WooCommerce redirect to cart after add-to-cart so users can see their cart on mobile.

    • This workaround was applied because TheGem does not render cart/login/wishlist icons in the mobile header.

    • We explicitly want to avoid this redirect flow and restore a normal mini-cart / header icon UX, consistent with desktop.

    Environment
    • Theme: TheGem (latest version)

    • Builder: Elementor

    • Ecommerce: WooCommerce

    • Multilingual: WPML (already verified NOT related)

    Issue description

    On desktop, everything works correctly:

    • Cart icon

    • Cart counter

    • Login / account icon

    • Wishlist icon

    On mobile:

    • The header only shows the hamburger icon.

    • Cart / login / wishlist icons are completely hidden, even when:

      • Cart icon is enabled in Theme Options

      • Cart position is set to “In Header”

      • Responsive visibility is forced ON

    • Mini-cart / off-canvas cart does not appear on mobile.

    • There is no Theme Option to enable header icons in mobile.

    Key confirmations
    • WooCommerce is working correctly (items are added, notices appear).

    • AJAX is working (no JS errors).

    • WPML is not involved (already isolated and tested).

    • This is not a cache or optimization issue.

    • The limitation appears to be TheGem mobile header layout.

    What we need

    We need a proper, theme-level solution to:

    1. Show Cart icon + counter in the mobile header

    2. Show Login / Account icon in the mobile header (wishlist optional)

    3. Allow mini-cart or off-canvas cart behavior on mobile, without redirecting to the cart page

    Please let us know:

    • If this is a known limitation

    • If there is an official way (option, hook, template override) to enable these icons in the mobile header

    • Or if this feature is not supported, so we can plan accordingly

    At the moment, the redirect-to-cart flow is only a temporary measure and not acceptable as a final UX.

    Thank you in advance for your help.

    Best regards,

  •  7,253
    Oliver replied

    Hi, thank you for your request. 

    By reviewing the settings of your header template I can see, that the mentioned elements are hidden for the mobile devices. Please check this screenshot: 

    https://prnt.sc/Sjfa9j90sw67

    Kindly recheck the settings of your header elements while editing the header template in Elementor and switching to the mobile device view.  

     

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver