Support » Plugin: WooCommerce Menu Cart » Image above cart?

  • Resolved HLBOriginals


    I have just installed the Woocommerce and now have the plugin for menu-cart. I would like an image of a basket to sit above the “items – £xx.xx” there is enough space in the nav for this, but im unsure if this would be a case of having a background image for the plugin/cart, of if i should try and add the image to my nav via the style.css within the template im using (im not using a Woocommerce template).

    Im very new to this coding and web organisation, so can any replies please bare in mind that im a numpty 😉 Thanks in advance


Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Ewout


    Hello Hay,
    Assuming you don’t want to display the icon at the same time, you could re-use this element in your style.css (do enable the icon though):

    .wpmenucart-contents i {
    	display: block; /* puts it on it's own line */
    	background-image: url('your image url');
    	width: 40px; /* set your own values for the size */
    	height: 40px;
    	background-size: 40px;
    	text-indent: 100%; /* hide the regular font icon */
    	white-space: nowrap;
    	overflow: hidden;

    Hi, thanks for this, im assuming this goes in the template style.css or is it another one? Sorry for the dim question, but i want to make sure.

    H x

    Plugin Author Ewout


    Any stylesheet that is loaded with your theme or the plugin (or, for that matter, another plugin). Possibly you will need to add !important tags in your CSS styles to make sure it overrides any other styles.

    Hi, well, something happened because it throw the nav bar out, but after tweaking its fine, sadly my image if failing to show. Now i have used firebug, and i cant get it to generate. So i guess i will have to play around some more. If there are any tips for this, then great, if not.. Thank you for the coding, it is much appreciated.

    Just wanted to say that i got it to work, thanks to your help. Although i did have to put the code within the display as follows

    .wcmenucart-display-right {
    	float: right;
            display: block; /* puts it on it's own line */
    	background-image: url('image');
    	width: 150px; /* set your own values for the size */
    	height: 20px;
    	background-size: 130px;
    	white-space: nowrap;
    	overflow: hidden;
            background-attachment: scroll;

    I also had to upload the image via WP, and not use my FTP to upload, which was bizarre, but its working, so many thanks, im well chuffed 😀
    Hay xx

    Plugin Author Ewout


    Good to hear that worked for you! I guess the difference in FTP upload & WP upload could be user rights, but functionally there’s no problem with using images uploaded via WP. Let us know if you have any other questions or issues!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Image above cart?’ is closed to new replies.