Adding Images to the Invoice
How would I go about adding images to the email invoice and the online Invoice?
|
Re: Adding Images to the Invoice
You should edit the notification template according to:
http://kb.x-cart.com/display/XDD/Basic+guide+to+theme+creation#Basicguidetothemecre ation-UsingCustomSkinmodule As for pulling product image, you can do this like this in template: {product.getImage()} |
Re: Adding Images to the Invoice
So how do I determine which tpl to look for...There are hundreds of them. I'd like the picture to show up everywhere it shows information about the order, on the admin, the front end, and in the email notification. How do I figure all that out without spending hours poking through tpls?
|
Re: Adding Images to the Invoice
You can use Webmaster Kit module on the Order invoice page in admin area.
If you find that you need to put your image into, let's say, admin/en/order/invoice/body.tpl template, it means that you need to actually insert an image into skins/mail/en/order/invoice/body.tpl template in order to add image to an email notification. Anyway, if you tell me where exactly you want to show an image in the notification, I will be able to tell you a specific template. |
Re: Adding Images to the Invoice
I want to insert a Column next to Item in the Order Details in the Admin area and the end user view. It's also import that when the emails get generate that go to the user and various departments that the Column with the image be there as well.
http://i21.photobucket.com/albums/b298/fasterthanyours/Invoiceinemail.jpg |
Re: Adding Images to the Invoice
Does it mean that your product image should be displayed in an area marked by red on my snapshot?
http://awesomescreenshot.com/0453z4fac3 |
Re: Adding Images to the Invoice
No on the left of the Item Column in a new Column.
|
Re: Adding Images to the Invoice
OK, in this case you mod will work as follows:
0) The product's table is rendered according to the skins/admin/en/order/invoice/parts/items/items.tpl template. Of course, I am talking about admin area right now, but let's solve the problem for invoice in admin area first, so you could get an idea of approach and then you will be able to simply re-apply change to mail notifications. 1) You need to insert a template that will define a new column of the table into the "invoice.items.head" view list. The process is described here: http://kb.x-cart.com/display/XDD/Step+2+-+applying+design+changes#Step2-applyingdesignchanges-Addingnewtemplatesandwidgets The code of such template will be something really easy like: Code:
{* vim: set ts=2 sw=2 sts=2 et: *} 2) Then, you need to insert a template into "invoice.item" view list. This template code will be simple as well: Code:
{* vim: set ts=2 sw=2 sts=2 et: *} Please, let me know if it makes sense to you. |
Re: Adding Images to the Invoice
It makes sense, but I'm still lost. I used the webmaster tools, but I don't understand how to figure out which tpl the columns are in. I'ts not clear to me whether or not this is a Module or if I'm modding the files on the server.
|
Re: Adding Images to the Invoice
Hi Michael!
Let us add a product image for product table for order invoice that displayed in admin area first. It will be an example of you, so you could grasp an idea. I assume, you create a mod with developer ID DevId and module ID ModuleId 1) Create the skins/admin/en/modules/DevId/ModuleId/head.tpl template with the content: Code:
{* vim: set ts=2 sw=2 sts=2 et: *} 2) Create the skins/admin/en/modules/DevId/ModuleId/image.tpl template with the content: Code:
{* vim: set ts=2 sw=2 sts=2 et: *} After you do this, your order invoices in admin area will start displaying product images. Try this and let me know if it works for you. |
Re: Adding Images to the Invoice
Tony, thank you for this. It didn't work as written, I had to make two changes to image.tpl:
Code:
{* vim: set ts=2 sw=2 sts=2 et: *} First, changed "invoice.items" to "invoice.item". Figured this out looking at the other items.tpl files /skins/admin/en/order/invoice/parts/items/ Second, seems you have to call the image widget class as you see. I don't really understand this so if you can explain I would appreciate it. Found this looking at another tpl using the getImage function, namely item.image.tpl. Haven't tested, but I assume everything after the alt tag is optional. |
Re: Adding Images to the Invoice
Hi topspin6711!
You are totally right about my mistakes in the code. Sorry for that and corrected my initial code. The thing about calling <widget> is you basically saying "OK, X-Cart, you have to display an image with source passed in image param, alt from alt param and dimensions defined in height/width params". Of course, you can do the same by specifying this code in template: <img src="{item.getImage()}" alt="item.getName()" max-width="80" max-height="80"> but X-Cart will slice an image on fly if you call it via widget, so if you call <widget> your notification will have 80x80 image, while if you call <img src>, your notification will have big image resized by mail client. Hopefully, it helps. Let me know if it is still unclear why <widget> is used. |
Re: Adding Images to the Invoice
Here are the results that I got. I know what's wrong, but I'm not 100% sure how to fix it.
Single Item in the Cart: http://i21.photobucket.com/albums/b298/fasterthanyours/Images%20On%20Invoice%2001%20-%20Single%20Item.jpg Multiple Items in Cart: http://i21.photobucket.com/albums/b298/fasterthanyours/Images%20On%20Invoice%2002%20-%20Multiple%20Items.jpg |
Re: Adding Images to the Invoice
It looks like <td></td> tags are missed in the template that renders a product image. If you can send me your module, I will be able to say what is wrong exactly.
Tony. |
Re: Adding Images to the Invoice
Tony,
Here is the current package https://www.dropbox.com/s/itzoohn09ofan0z/FasterThanYours-ImagesOnInvoice-v5_1_8.tar?dl=0 |
Re: Adding Images to the Invoice
Tony,
I figured it out. you were right about the td missing. Now how do I got about getting it on the General Info Tab? I suppose I need to know all of the other places that an Admin or user would be viewing an invoice or detailed order information. |
Re: Adding Images to the Invoice
Hi Michael!
I have an article that explains the whole process here: http://kb.x-cart.com/display/XDD/Adding+product+images+to+order+notifications Please have a look and let me know if it helps. Tony. |
Re: Adding Images to the Invoice
Tony,
In the Admin area, how do I make the images clickable? In the Thank you Page area, how do I make the images clickable? Also in the Admin Area, I'd like to have the images on the General Info Tab. It's working fine on the Invoice Tab. Most likely my client's employees will only use the General Info Tab and then the Invoice as a final reference. If you're on the Invoice Tab and and you click the Name of the Product it take you to the edit product page. I would like that to be the same on the Image in the General Info Tab and the Invoice Tab. http://i21.photobucket.com/albums/b298/fasterthanyours/General%20Info%20Tab%20-%20No%20Image.jpg |
Re: Adding Images to the Invoice
1) Making images clickable is basically to wrap them into <a></a> tags. I believe, you already know that, so I am not sure what piece of advice I can give you here aside from just adding <a></a> tags.
2) In order to add images to Order Items section in General info tab, you need to decorate the \XLite\View\ItemsList\Model\OrderItem viewer class and add new image field to the defineColumns() method similar to how it is done here: http://kb.x-cart.com/display/XDD/ItemsList+in+admin+area Please, let me know if it makes sense to you. Tony. |
Re: Adding Images to the Invoice
Tony,
Does this look right? PHP Code:
|
Re: Adding Images to the Invoice
[quote=tony_sologubov]1) Making images clickable is basically to wrap them into <a></a> tags. I believe, you already know that, so I am not sure what piece of advice I can give you here aside from just adding <a></a> tags.[/quote
Tony, I know how to use <a> lol I just have no idea with the proper code would be to do that. |
Re: Adding Images to the Invoice
Quote:
Makes sense now :- ) You can specify it as Code:
?target=product&product_id=#PRODUCT ID# of course #PRODUCT ID# part will be taken from the {item} object. The code you shown previously does not make a lot of sense to me as I am not quite following what you are trying to achieve by it. |
Re: Adding Images to the Invoice
I'm trying to get the image load on the General Info Tab on when you look at the order information. You originally said:
Quote:
And that's what I was trying to do. I was asking your opinion before I tried the code. |
Re: Adding Images to the Invoice
Quote:
Thanks for the explanation, Michael. Now your idea is clear to me. Your code should look as follows: PHP Code:
Because, you only need to add one more field to an array returned by defineColumns() method, not to overwrite this array completely. |
Re: Adding Images to the Invoice
Tony,
This may have broken with the latest release. I have duplicate logos on my invoices and the Image column is there, but the image is not. The Image is showing up on the "Thank your for your order" screen after checkout. I am working on something unique with Olesya that modifies the Invoice Email. You may want to chat with her. Packed Mod: https://www.dropbox.com/s/6pih1imkjzinhog/FasterThanYours-ImagesOnInvoice-v5_2_0.tar?dl=0 Image of the Invoice in Email http://i21.photobucket.com/albums/b298/fasterthanyours/Images%20On%20Invoice%2003%20-%20Double%20Logos%20a...20pictures.jpg |
Re: Adding Images to the Invoice
Quote:
It works on our local installation. Some other module (perhaps, a custom one) seems to cause the problem. |
Re: Adding Images to the Invoice
I think the core installation is corrupt. I disabled all mods and it's still producing the problem. How can i replace just the files that this mod affects or even all of the files that generate that emails?
|
Re: Adding Images to the Invoice
Quote:
The invoice logo duplicates because you have one piece of code that add a logo in the .tpl template of the invoice (templates can be found in /skins/default/en/order/invoice) and one in the header of the invoice. Go to the "Store setup" > "Email notifications" > "Headers and signatures" and remove everything from the "Header" section. That is how you eliminate one of the logos. About the "Image" column on the invoice, most likely one of your templates is customized, and it mistakenly adds this. This should be looked into thoroughly on your server. |
Re: Adding Images to the Invoice
Igor,
Actually I had this problem in 5.2.6. I haven't checked in 5.2.9 yet. In the old version I was able to remove the logo, but the remainder of the text kept reproducing itself. Tony, Since upgrading to 5.2.9, the Images on Invoice Mod has stopped working. |
Re: Adding Images to the Invoice
Quote:
Please submit a support ticket at https://secure.x-cart.com |
Re: Adding Images to the Invoice
Tony,
Nevermind. I removed and reinstalled the Mod, it's working now. |
All times are GMT -8. The time now is 02:39 PM. |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.