I'm wanting to add some static icons to my WooCommerce email templates. However, I'm struggling with getting the right code to work inside the template file. Please note I'm no Wordpress expert, but I know my way around the template files and language.
I've moved the email templates into my theme directory so I'm able to override them successfully.
I've tried using the standard Wordpress way of linking to static image, adding on the location of the image, within a theme like this:
<img src="<?php bloginfo('template_url'); ?>/woocommerce/emails/images/my-img.jpg" />
... which doesn't work.
I appreciate that the WooCommerce way of doing this might differ slightly. Are there any WooCommerce experts that have any ideas? Is what I want even possible?
Here's an example email template that comes bundled with WooCommerce:
<?php
/**
* Admin new order email
*
* @author WooThemes
* @package WooCommerce/Templates/Emails/HTML
* @version 2.0.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly
}
?>
<?php do_action( 'woocommerce_email_header', $email_heading ); ?>
<p><?php printf( __( 'You have received an order from %s. Their order is as follows:', 'woocommerce' ), $order->billing_first_name . ' ' . $order->billing_last_name ); ?></p>
<?php do_action( 'woocommerce_email_before_order_table', $order, true, false ); ?>
<h2><a href="<?php echo admin_url( 'post.php?post=' . $order->id . '&action=edit' ); ?>"><?php printf( __( 'Order #%s', 'woocommerce'), $order->get_order_number() ); ?></a> (<?php printf( '<time datetime="%s">%s</time>', date_i18n( 'c', strtotime( $order->order_date ) ), date_i18n( wc_date_format(), strtotime( $order->order_date ) ) ); ?>)</h2>
<table cellspacing="0" cellpadding="6" style="width: 100%; border: 1px solid #eee;" border="1" bordercolor="#eee">
<thead>
<tr>
<th scope="col" style="text-align:left; border: 1px solid #eee;"><?php _e( 'Product', 'woocommerce' ); ?></th>
<th scope="col" style="text-align:left; border: 1px solid #eee;"><?php _e( 'Quantity', 'woocommerce' ); ?></th>
<th scope="col" style="text-align:left; border: 1px solid #eee;"><?php _e( 'Price', 'woocommerce' ); ?></th>
</tr>
</thead>
<tbody>
<?php echo $order->email_order_items_table( false, true ); ?>
</tbody>
<tfoot>
<?php
if ( $totals = $order->get_order_item_totals() ) {
$i = 0;
foreach ( $totals as $total ) {
$i++;
?><tr>
<th scope="row" colspan="2" style="text-align:left; border: 1px solid #eee; <?php if ( $i == 1 ) echo 'border-top-width: 4px;'; ?>"><?php echo $total['label']; ?></th>
<td style="text-align:left; border: 1px solid #eee; <?php if ( $i == 1 ) echo 'border-top-width: 4px;'; ?>"><?php echo $total['value']; ?></td>
</tr><?php
}
}
?>
</tfoot>
</table>
<?php do_action( 'woocommerce_email_after_order_table', $order, true, false ); ?>
<?php do_action( 'woocommerce_email_order_meta', $order, true, false ); ?>
<h2><?php _e( 'Customer details', 'woocommerce' ); ?></h2>
<?php if ( $order->billing_email ) : ?>
<p><strong><?php _e( 'Email:', 'woocommerce' ); ?></strong> <?php echo $order->billing_email; ?></p>
<?php endif; ?>
<?php if ( $order->billing_phone ) : ?>
<p><strong><?php _e( 'Tel:', 'woocommerce' ); ?></strong> <?php echo $order->billing_phone; ?></p>
<?php endif; ?>
<?php wc_get_template( 'emails/email-addresses.php', array( 'order' => $order ) ); ?>
<?php do_action( 'woocommerce_email_footer' ); ?>
Here's a link to that template on GitHub: https://github.com/woothemes/woocommerce/blob/master/templates/emails/admin-new-order.php
Any help would be much appreciated, thanks!
Try this:
<img src="<?php echo get_template_directory_uri(); ?>/woocommerce/emails/images/my-img.jpg" />