Woocommerce - 标题购物车图标自定义

I'm creating a custom Woocommrce theme for a first time. I need help with displaying cart link in header. It looks like this https://imgur.com/AjARqhX and need to be like this https://imgur.com/QvYUPgU

Here is my code

function woocommerce_header_add_to_cart_fragment( $fragments ) {
    global $woocommerce;

    ob_start();

    ?>
    <a class="cart-customlocation" href="<?php echo esc_url(wc_get_cart_url()); ?>" title="<?php _e('View your shopping cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?>
        <img class="immm" src="<?php echo home_url(); ?>/wp-content/uploads/icons/header/cart.png">
        <span><?php _e('Košík',''); ?></span>       
    </a>
    <?php
    $fragments['a.cart-customlocation'] = ob_get_clean();
    return $fragments;
}

Now I need to show product count added in cart in "green bubble" and remove word "item".

And also after click on arrow-down icon, it shows a mini-cart. Can anynoe help with this?

Many thanks.