Support

Home Forums Event Espresso Premium Can I add images………….

Can I add images………….

Posted: January 20, 2014 at 10:32 pm


Paul Miller

January 20, 2014 at 10:32 pm

I would like to add 2 images. One with a link for “Complete Registration”, and the second under my off-line invoice payment option for the “Pay by Invoice” option. How would I go about doing this? Thanks.


Dean

January 21, 2014 at 12:39 am

Hi Paul,

For the Complete Registration link, you could use CSS to replace the text with an image http://css-tricks.com/css-image-replacement/

For the additional image, you need to edit either the invoice’s invoice_vars.php to add the image in to the html code.


Paul Miller

January 21, 2014 at 3:14 am

Thanks Dean, ok where on the invoices_vars template would I add an image for that. I have a nice little invoice icon (jpeg) which I would love to link to the “Pay by invoice’ option. It looks strange as is because I’ve got the big Paypal button and then just a text link for invoices. The invoice icon would balance it up. Look forward to your advice, cheers.


Dean

January 21, 2014 at 5:56 am

Ahh I see, so you want to add the image next to the text in the invoice button/link?

Well if thats the case, sorry for misunderstanding. It can be done with CSS again.

Add it as a background image and pad the text out on the left.

Something like this http://stackoverflow.com/questions/735394/add-image-to-left-of-text-via-css


Paul Miller

January 25, 2014 at 12:40 am

Hi Dean,
Thanks for your help, OK I’m a little lost now, i’ve looked at all the documentation you’ve supplied but I need some further clarification please. Firstly which css would I apply the changes to? Would it be espresso_default.css? If so I’ve replaced the standard one with a blank one (as per previous support help I was given) as I was having heaps of style/formatting issues. So what code would I put back in to just add the images mentioned above. Or am I on the wrong track completely??!!
Thanks in advance.


Dean

January 27, 2014 at 2:11 am

Hi,

You can apply the CSS changes either to your themes style.css or you can use a plugin such as My Custom CSS http://wordpress.org/plugins/my-custom-css/


Paul Miller

January 27, 2014 at 2:38 pm

OK Dean, thanks again for your help. I decided the easiest option for me, after viewing all the resources you’ve given me, and with my extremely limited experience, would be to just modify the invoice_vars.php file which you mentioned early on. What I did was add my invoice image on line 35 like this:
<?php
$image = “invoiceicon1.png”; Echo “”
?>
The ‘invoiceicon1.png’ file is in the Invoice folder with the other files. For some reason however the image wont show. You can see where it is supposed to be, but it is not visible. Appreciate your help to get it visible!! And excuse my poor knowledge here, i’m trying!! Cheers.
in this field To insert an imageInstead of fiddling with css I decided to modify


Paul Miller

January 27, 2014 at 2:45 pm

Sorry Dean, for some reason the code didnt come out correctly above, i’ll try again:
<pre class=”brush: text; gutter: true; first-line: 1; highlight: []; html-script: false”><?php
$image = "invoiceicon1.png";
Echo "<img src=".$image."
Style=width:60px;height:75px;>"
?>
I just highlighted it and pressed the plain text link and it added some stuff!! Hope it makes sense.


Sidney Harrell

January 27, 2014 at 5:24 pm

You almost never want to use a relative link to a resource, because it’s not always clear what it is relative to. You might put the image in the invoice folder, but the code in invoice_vars.php is run by being included in another file, which is run by being included in another file, etc, and it’s looking for that relative link relative to either the plugins/event-espresso folder or the web root. The only way to tell for sure is to right click on the missing image icon, inspect the element with either Chrome’s developer tools or Firefox’s firebug add-on, and look at where the missing link is looking. You’re much better off using either the WP media uploader, which will give you an absolute link after you’ve uploaded your image, or placing it in uploads/espresso, and then using one of our url constants to anchor an absolute link, like so:

$image = EVENT_ESPRESSO_UPLOAD_URL."invoiceicon1.png";
Echo "<img src=".$image."
Style=width:60px;height:75px;>"


Paul Miller

January 27, 2014 at 6:15 pm

Sidney, thanks. Your support has been outstanding! Much appreciated, this has been a long road getting EE exactly how we need it. Apart from one other issue, we’re now good to roll. Cheers.

The support post ‘Can I add images………….’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso