WooCommerce Product Page Calling in Data

Support
#1

I am trying to customise the WooCommerce product page by calling in data via ACF. I am an expert in integrating ACF with Pro and have hit a wall as I can’t seem to call fields into my product page.

Any help would be super as I am stuck and have read ACF and WooCommerce data with no real help…

Sincerely,
Paul

#2

Hello There,

Thanks for writing in!

Please check out this links as a reference to display custom fields in the product page:



Please be advised that this particular customization request is outside the scope of our support as this is not related to an issue with the theme and instead has to do with your customization of it. As such, you will need to investigate this particular issue on your own or seek help from a developer should you not feel comfortable making these changes yourself. If you have any further questions about the theme, we are more than happy to provide you with assistance on these inquiries.

Thank you for your understanding.

#3

I have worked out how to integrate text fields but my image is coming through as a link do you know why it is converting my image to text on the front end?

#4

Hello There,

Could you please share your code where you have added to display the custom field? You must have missed the echo statement to display the image.

Thank you in advance.

#5

This is the code I am using referring to an ACF image field ‘tire_brand_logo’:

add_action( 'woocommerce_single_product_summary', 'tire_brand_logo', 1 );
 
function tire_brand_logo() {
echo the_field('tire_brand_logo');
}

#6

Hi There,

Please change the return value of your image field to this:

Then the custom code should be like this:

add_action( 'woocommerce_single_product_summary', 'tire_brand_logo', 1 );
 
function tire_brand_logo() {
echo '<img class="product-brand" src="' . get_field('tire_brand_logo') . '" />';
}

Hope it helps :slight_smile:

#7

Any idea on how to restrict size?

#8

Hi There,

To reduce the size of image, please add this custom CSS:

.product-brand { max-width: 150px; }

Hope it helps!

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.