将WooCommerce迷你购物车按钮/功能转换为短代码,以使用OceanWP主题移动它

When using a custom header with the theme OceanWP the default mini-cart is removed. You can add oceanWP shortcode to get their cart but it looks bad and lacks the functions (that you can change with customization-settings) that the original cart.

In OceanWP they got inside the assets/include a header-content.php that has a mini-cart code. I just added add_shortcode to it.

Original code:

if ( ! function_exists( 'oceanwp_mobile_cart_icon' ) ) {

    function oceanwp_mobile_cart_icon() {

        // If bag style
        $bag = get_theme_mod( 'ocean_woo_menu_bag_style', 'no' );

        // Classes
        $classes = array( 'oceanwp-mobile-menu-icon', 'clr', 'woo-menu-icon' );

        // Position
        $position = get_theme_mod( 'ocean_mobile_elements_positioning', 'one' );
        if ( 'two' == $position ) {
            $classes[] = 'mobile-left';
        } else if ( 'three' == $position ) {
            $classes[] = 'mobile-right';
        }

        // Turn classes into space seperated string
        $classes = implode( ' ', $classes );

        echo '<div class="'. $classes .'">';
            if ( 'yes' == $bag ) {
                echo '<div class="bag-style">';
            }
            echo oceanwp_wcmenucart_menu_item();
            if ( 'yes' == $bag ) {
                echo '</div>';
            }
        echo '</div>';

    }

}

I added:

add_shortcode( 'MiniCartTest', 'oceanwp_mobile_cart_icon' );

Now when trying that code, It displays nothing. However, there are traces apparently of the code:

<div class="oceanwp-mobile-menu-icon clr woo-menu-icon mobile-right">

            <a href="https://mysite.bla" class="wcmenucart">
                <span class="wcmenucart-count"><i class="fa fa-shopping-bag"></i><span class="wcmenucart-details count">2</span></span>
            </a>
        </div>

But it's completely white, I can't see it. Apparently it's showcasing that I got 2 items in my cart which is true. But I can't make it appear.