Adding Static Image to WooCommerce Content-Single-Product template

Question

I am trying to add some static images to the single product template in WooCommerce but they are not displaying properly.

I am hooking into the woocommerce_after_single_product_summary hook and everything is being included in the file fine.

I have added, among other things, the following code:

<div class="product-detail-header">
    <img src="<?php echo get_stylesheet_directory(); ?>/images/sig-technical.png" />
    <h3>Technical</h3>
    <hr>
</div>

For some reason the image path is inserting itself after the path of the current page which is obviously not where it should be pointing to.

It is translating to

http://wp_project2/product/jazz/C:/wamp/www/wp_project2/wp-content/themes/Divi-child/images/sig-technical.png

instead of

C:/wamp/www/wp_project2/wp-content/themes/Divi-child/images/sig-technical.png

I've been racking my brain and can't figure this one out. Any ideas would be greatly appreciated.

Answer 1

Many thanks to Nathan Powell for the fix.

Changing get_stylesheet_directory() to get_stylesheet_directory_uri() will return the correct URL.

get_stylesheet_directory() returns the absolute server path to child or parent theme (hence my previous issue) whereas get_stylesheet_directory_uri() returns the properly formed URI of child or parent theme.

I suppose the lesson is to pay close attention to exactly what function you're using as WordPress has many similarly named plugins.

You can check out the codex docs here: get_stylesheet_directory() & get_stylesheet_directory_uri()