The code below assumes you will either be using icon images for all payment methods or not using icon images for all payment methods, I have not been able to get this working for a both case scenario, as I am not a master with Smarty in any way, shape or form.
[quote name=‘Triplex’]But this code works or not? because you write “as I am not a master with Smarty in any way, shape or form.”???
This code works fine if used as stated above. You either need to use images for all payment methods or not use images for all payment method. You can’t have images for some payment methods and no image for others, as the name of the payment method will not display for ones without images.
Here’s a “HowTo” on how to use the payment option icons
Open template: “/skins/YOUR_TEMPLATE/customer/views/checkout/components/payment_methods.tpl”
[b]Here's how it works[/b]
In Admin->Payment Methods, the "Name" you define for each payment method is key. Keep it simple. The little smarty code we added to the template basically takes your payment method name, converts it to lowercase, replaces any spaces in it with "_" underscores. For example. My two payment method names are "Credit Card" and "PayPal". Credit Card becomes "credit_card" and paypal becomes "paypal".
The code added to the template adds one more table column and inserts an image tag. By default, it will look in CSCartRoot/images folder. The filename it looks for will be based on your Payment Method name.. i.e. "credit_card.jpg" and "paypal.jpg"
Thats it! If you decide to add a new payment method, all you have to do is create the icon for it and put it in your images folder.
*Note* I mentioned keeping your payment method names simple. If you put one as "Credit Card (Visa/Mastercard/Discover), this template code will look for a weird filename that looks like this: "credit_card_(visa/mastercard/discover).jpg" .. Much easier to just call it "Credit Card".
Also, I do not use payment method descriptions for any of mine. it will effect the look of this code if you do
Since I like using the description field and want this to work whether I have an image specified or not, I used Racingsolution’s method to update my methodology so now it will use an image if it has one or the name if it doesn’t: (still need to follow the same rules to naming the image as Racingsolution mentioned above. Use the payment method name all lowercase replacing any spaces with underscore)
[quote name=‘racingsolution’]Photoshop… google “paypal” and I’m sure it’ll pop up… and I think PayPal has it available in your account section[/QUOTE]
I did a google search as racingsolution suggested to find the image. Below is updated code that would replace my code above if you plan on using the Paypal Verfied logo and want it to link to Paypal for verification:
[quote name=‘roban’]Isn’t this a part of the credit card payment dialogue? You upload an image for the credit card or payment type in the Administration/Credit cards. There is an option to upload an icon.[/QUOTE]
When you upload an image to the credit card, it shows up next to the drop down box where you select “Mastercard”, “Visa”, etc… it doesn’t show up next to your payment methods… two separate areas
[quote name=‘racingsolution’]When you upload an image to the credit card, it shows up next to the drop down box where you select “Mastercard”, “Visa”, etc… it doesn’t show up next to your payment methods… two separate areas[/QUOTE]
Correct. You can upload icon’s for payments but they don’t display next to the payment method. Out of the box they are only used to create a block of payment images. This solution will display them in Step 4 of checkout.