Home Forums WoodMart support forum Custom Wishlist Icon from Heart To Diamond

Custom Wishlist Icon from Heart To Diamond

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #313582

    Astrotech
    Participant

    Hello Team,

    Could you please help me to change the wishlist default heart icon to a diamond icon as my website belongs to diamond and gemstone only. So I want you to please help me out with the same.

    Please do not change anything else.

    Thanks,

    #313703

    Hello,

    Please provide me with the icon image you want to set for the Wishlist, and specify the place: in the Wishlist and in the header?

    Best Regards,

    #313745

    Astrotech
    Participant

    Please change the heart image to a diamond image everywhere, wherever it’s used. This means we need to replace the Wishlist icon everywhere on the website.

    Attachments:
    You must be logged in to view attached files.
    #313927

    Hello,

    Please upload the image into Media library and insert the image URL instead the URL in the styles:

    body .wd-header-wishlist .wd-tools-icon:before {
        content: "";
    }
    .wd-header-wishlist .wd-tools-icon{
    		width:20px; 
    	  height: 20px;
    	  display:inlie-block;
    	  background-image:url(http://yourweb.net/wp-content/uploads/2018/06/glass-shopping-bag.svg)!important;
    	  background-repeat:no-repeat;
    	 background-size:contain;
    }
    body .wd-wishlist-icon>a:before {
        content: "";
    }
    body .wd-wishlist-icon>a{
    	  max-width:20px; 
    	  max-height: 20px;
    	  display:inlie-block;
    	  background-image:url(http://yourweb.net/wp-content/uploads/2018/06/glass-shopping-bag.svg)!important;
    	  background-repeat:no-repeat;
    	  background-position:center center;
    	  margin:2px auto;
    }
    body.single-product .wd-wishlist-icon>a{ 
    	  min-height: 20px;
    	  min-width:200px;
    	  display:inline-block;
    	  padding:5px 0 0 25px;
    	  background-image:url(http://yourweb.net/wp-content/uploads/2018/06/glass-shopping-bag.svg)!important;
    	  background-repeat:no-repeat;
    	  background-position:left center;
    }
    body .summary-inner .wd-action-btn.wd-wishlist-btn {
        display: inline-block;
        min-width:200px;
    }
    body .wd-action-btn.wd-wishlist-btn>a:after,
    body .wd-action-btn.wd-wishlist-btn>a:before {
        display: none;
    }
    body.page-id-267 .wd-empty-wishlist:before {
        content:"";
    }
    body.page-id-267 .wd-empty-wishlist {
        max-width:340px; 
    	  max-height:340px;
    	  display:block;
    	  padding-top:400px;
    	  background-image:url(http://yourweb.net/wp-content/uploads/revslider/main-slider-rtl/slider-main-demo-2-11-600x600.jpg)!important;
    	  background-repeat:no-repeat;
    	  background-position:top center;
    	  margin:2px auto;
    }
    body.page-id-267 .wd-empty-page-text{
    padding-top:150px;
    }

    When you insert your image, the styles may be a bit broken due to image size, let me know the problem occur I will correct CSS considering the image size.

    Best Regards

Viewing 4 posts - 1 through 4 (of 4 total)