The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.
 
 
Thread Tools Display Modes
  #1  
Old 10-05-2018, 07:43 PM
HabersMX's Avatar
HabersMX is offline
 
Join Date: Nov 2017
Posts: 39
Default

Could someone Please help me change the Credit Card Logos


Under the payment options.

I already change logo number 1, 3, 4, but for some reason I cannot change the second one ( mercado pago) I don't know what I'm doing wrong here is the code I used to change 1, 3, and 4.

Code:
div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(1) img {
        display: none;
}

div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(1) div.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock {
background-image: url(https://dqzrr9k4bjpzk.cloudfront.net/images/12638290/884937432.jpg);
background-repeat: no-repeat;
margin: 0px 18px; 
height: 50px;
width: 250px;
}

div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(2) img {
        display: none;
}

div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(2) div.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock {
background-image: url(https://dqzrr9k4bjpzk.cloudfront.net/images/12638290/884991248.jpg);
background-repeat: no-repeat;
margin: 0px 18px; 
height: 50px;
width: 250px;
}

div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(3) img {
        display: none;
}

div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(3) div.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock {
background-image: url(https://dqzrr9k4bjpzk.cloudfront.net/images/12638290/884937427.jpg);
background-repeat: no-repeat;
margin: 0px 18px; 
height: 50px;
width: 250px;
}

div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(4) img {
        display: none;
}

div.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(4) div.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock {
background-image: url(https://dqzrr9k4bjpzk.cloudfront.net/images/12638290/884937422.jpg);
background-repeat: no-repeat;
margin: 0px 18px; 
height: 50px;
width: 250px;
}



I need the second payment option has this image
  #2  
Old 10-09-2018, 11:26 AM
Edward M.'s Avatar
Edward M. Edward M. is offline
Ecwid Team
 
Join Date: Dec 2016
Posts: 261
Default

Hi there,

I'm Edward from Ecwid Team.

I've checked your site, and as I see, you successfully managed to change the logos for the Mercado Pago payment method. Screenshot: http://take.ms/ZeSvy

The correct code for that is:

Code:
.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock { 
   display: none; 
} 
.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(2):after { 
  content: "Custom image"; 
  background: url('https://dqzrr9k4bjpzk.cloudfront.net/images/12638290/884991248.jpg') no-repeat; 
  background-size: 210px; 
  font-size: 20px; 
  margin-left: 20px; 
  color: transparent; 
  display: block; 
}
Just note that in this code 'nth-child(2)' defines the payment method number in the list that the code is applied to. So please mind that if you add new payment methods and the position of the payment method you added the code for changes, you need to adjust the code.

If you have any questions, please let me know.
__________________
Ecwid Customer Care Team
More tips and hints on Ecwid use in Ecwid Help Center
The Following User Says Thank You to Edward M. For This Useful Post:
Hewa Bora (12-20-2018)
  #3  
Old 12-20-2018, 02:25 AM
Teo5's Avatar
Teo5 Teo5 is offline
 
Join Date: Sep 2018
Posts: 13
Default

Still can't resolve the issue the code post above is no longer working for the next gen storefront
  #4  
Old 12-20-2018, 02:43 AM
Teo5's Avatar
Teo5 Teo5 is offline
 
Join Date: Sep 2018
Posts: 13
Default



could someone help me change all the payment method logos, for my own custom ones.

I used to have this css code but now it does not work on the next gen store front:
Code:
div.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock { 
   display: none; 
} 
.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(1):after { 
  content: "Custom image"; 
  background: url('https://dqzrr9k4bjpzk.cloudfront.net/images/15231719/951872432.jpg') no-repeat; 
  background-size: 80px; 
  font-size: 20px; 
  margin-left: 20px; 
  color: transparent; 
  display: block; 
}

.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock { 
   display: none; 
} 
.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(2):after { 
  content: "Custom image"; 
  background: url('https://dqzrr9k4bjpzk.cloudfront.net/images/15231719/951872556.jpg') no-repeat; 
  background-size: 178px; 
  font-size: 20px; 
  margin-left: 20px; 
  color: transparent; 
  display: block; 
}
.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock { 
   display: none; 
} 

.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock { 
   display: none; 
} 
.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(3):after { 
  content: "Custom image"; 
  background: url('https://dqzrr9k4bjpzk.cloudfront.net/images/12638290/918270455.jpg') no-repeat; 
  background-size: 80px; 
  font-size: 20px; 
  margin-left: 20px; 
  color: transparent; 
  display: block; 
}

.ecwid-PaymentMethodsBlock-PaymentOption-htmlBlock { 
   display: none; 
} 

.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(4):after { 
  content: "Custom image"; 
  background: url('https://dqzrr9k4bjpzk.cloudfront.net/images/12638290/951840182.jpg') no-repeat; 
  background-size: 80px; 
  font-size: 20px; 
  margin-left: 20px; 
  color: transparent; 
  display: block; 
}

.ecwid-PaymentMethodsBlock-PaymentOption:nth-child(5):after { 
  content: "Custom image"; 
  background: url('https://dqzrr9k4bjpzk.cloudfront.net/images/15231719/951825697.jpg') no-repeat; 
  background-size: 90px; 
  font-size: 20px; 
  margin-left: 20px; 
  color: transparent; 
  display: block;
  #5  
Old 12-20-2018, 11:25 AM
Una Q's Avatar
Una Q Una Q is offline
Ecwid Team
 
Join Date: Nov 2016
Posts: 151
Default

Quote:
Originally Posted by Teo5 View Post
Still can't resolve the issue the code post above is no longer working for the next gen storefront
Hello Teo,

This is Una from Ecwid Customer Care team. Thank you for reaching out to us.

I see that you are discussing the logo changes with our agent via email. The agent is working on your case right now and will get back to you with a solution very soon.

We will also update our article about logo changes for the new checkout in Knowledge Base, so other Ecwid users could easily find it.

Please stay tuned!

Best regards,
Una Q.
Ecwid Support Team
The Following User Says Thank You to Una Q For This Useful Post:
HabersMX (12-20-2018)
  #6  
Old 12-20-2018, 02:27 PM
HabersMX's Avatar
HabersMX HabersMX is offline
 
Join Date: Nov 2017
Posts: 39
Default

thanks Alex Flint Helped me and now it is fixed I will study the code he sent me so I can understand it better and don't have any more problems in the future you guys are awesome

best customer service ever as always.
 
The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 08:31 PM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.