Changing image of marketing circle button

Support
#1

Hi,

I had changed the image of the marketing circle button last year and all was well untill recent updates. Now again the standard black circle has come back.

How can I change it back to my own images?

Hope to hear soon
Kymia

#2

Hi @kkazemi,

Thanks for writing in. You can use this code below for the JavaScript:

jQuery(function($) {
  $('.my-button-wrap').wrap('<div class="x-btn-circle-wrap x-btn-large custom-button-wrap">');
});

And for the custom CSS, please use this:

.custom-button-wrap:before {
  background-image: url("yourimagelink");
}

.custom-button-wrap:after {
  background-image: url("yourimagelink");
}

Please let us know how it goes. If not working please share us your URL.

Thanks.

#3

No… unfortunatly it has not worked.

url is: www.belicio.nl

#4

Hi again,

I’m not sure how did you change the background image previously, but I can point you in the right direction, to remove the default circular image you can make use of this code:

.x-btn-circle-wrap:before, .x-btn-circle-wrap:after {
  background: none !important;
}

However you can modify the above code to add your own image in there by giving the background image URL in the background property. To display your own background image, use this code:

.x-btn-circle-wrap {
  background-image: url(http://image.png);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

Hope this helps!

#5

Yes! Thankyou! its working now!.. just need to adjust size etc now.

Thanks for your help!

Kymia

#6

Not a problem at all, @kkazemi! Cheers!