It’s essentially telling me “could not load image” while the image exists and is accessible via exactly that link.
If you want, I can prove it to you that the image exists.
http://www.easy2work.at/wp-content/plugins/woocommerce-pdf-invoices-packing-slips/images/background.jpg
Here you go
Plugin Contributor
Ewout
(@pomegranate)
Hi! The images folder is only used for the plugin images, the template is processed in a different folder. Which is good thing, because otherwise you’d lose the image when the plugin is updated. It’s better to work with an absolute server path (not a URL), check out the documentation on using images here:
http://docs.wpovernight.com/woocommerce-pdf-invoices-packing-slips/insert-images/
Also, if you’re making these changes, make sure to copy the template files to your theme folder first (full docs here).
Ewout
I have checked the insert-images page and have tried multiple methods
1. tried using the images folder
2. tried using the template folder
3. tried using the theme/images folder
4. tried using an external source
Could it be that your plugin just can’t convert “background-image” for the PDF? It’s not visible on the HTML output either.
Plugin Contributor
Ewout
(@pomegranate)
Yes, that is possible, I haven’t tested that. The PDF creation is not handled by my plugin but by a third party library (dompdf). By the looks of it, the background image should be supported though (this plugin uses version 0.6 of dompdf)
Because you wrote that it gave you a “could not load image” error (I’m assuming this was in the PDF), I thought that it was actually trying to load the image.
1 & 3 will never work, as the plugin will not look for any images there. 4 may not work depending on your server configuration.
Note that in your example you wrote:
.background { background-image: url("bg.jpg") !important; }
but the link you posted was background.jpg instead of bg.jpg (not sure if that was a typo).
So essentially, 2 is your best option, make sure you follow the instructions in the documentation precisely. When you are using server paths, the output to HTML will not show your image, but you can view the source and check if that server path is correct. I recommend to test using a regular image first, and when that works, try the background method. This way you can actually rule out whether it is an issue with the PDF library or with your code. Always use a full server path, not relative.
Let me know if that helps!
Yeah. I’ve tested with different filenames as well.
bg.jpg/png and background.jpg/png were two of my tries.
As I can’t see the HTML in the PDF file the “could not load image” error is when enabling HTML output.
If you want, I can give you access to the PDF/HTML file.
90% of my tries involved server paths because I’ve had minor troubles with other websites and plugins using the relative paths.
Plugin Contributor
Ewout
(@pomegranate)
I see – I thought you got the error in the PDF – the fact that you get it in the HTML is normal as the browser will not have access to your server path.
Can you send me your template files (zipped) and the output HTML (preferably as a file) to [email protected] so I can take a look?
Thanks!
I found a solution myself.
PDF DOES NOT TAKE background-color AS AN OPTION!
Instead implement an image with <img src"" class=""> and give it the following CSS:
position: absolute; z-index: -1; top: X; left: X; (X as in the value you need)
You may also add width, height (auto?) or a margin depending on your needs.
Last but not least, let me repeat: background-color DOES NOT WORK!
Plugin Contributor
Ewout
(@pomegranate)
Thanks for sharing the solution with us! This is what I meant in my earlier post when I wrote that I’d test with a simple image first to make sure you’re using the correct URL.
I will do some testing for this, as the dompdf documentation states that background-image (I assume that’s what you mean instead of background-color) should work.
Thanks and have a great day!
Ewout
I wrote color? Oh my. Yeah.. it doesn’t take background-IMAGE as an option. I always knew the URL works because I can find the image via said link in my browser.
Thanks, you too.
