ACF get image from product term - wordpress

I would like to display a brand logo on my product pages. I use Advanced Custom Fields (ACF) to insert the image on the taxonomy "Brand".
https://snipboard.io/JcYvM4.jpg
I have tried the code below, and tried to do as on the page here, but it doens't work...
https://www.advancedcustomfields.com/resources/adding-fields-taxonomy-term/
*The image return format is "Array".
function action_woocommerce_before_variations_form( ) {
$queried_object = get_queried_object();
$taxonomy = $queried_object->taxonomy;
$term_id = $queried_object->term_id;
$image = get_field('brand_logo', $taxonomy . '_' . $term_id);
echo '<img src="'.$image['url'].'" />';
};
// add the action
add_action( 'woocommerce_before_variations_form', 'action_woocommerce_before_variations_form', 10, 0 );

You can try like this:
<?php
$category_icon = get_woocommerce_term_meta( $cat->term_id, 'thumbnail_id', true );
$category-logo = wp_get_attachment_url( $category_icon );
?>

The woocommerce_before_variations_form is call on product page.
So if when you call get_queried_object() WordPress will return Product Object, not brand term.
So
Get brand(s) with your product id with get_the_terms function
Iterate on your brands and get image with get_field function
(optional) get brand link
Display your image
<?php
function prefix_add_brand_before_variations_form() {
// First get brand(s) with your product id.
$brands = get_the_terms(get_the_id(), 'brand');
// get_the_terms return false or an array, so
if(!$brands) {
return;
}
foreach ($brands as $brand) {
$image = get_field('brand_logo', $brand);
$brand_url = get_term_link($brand);
if (is_array($image)) : ?>
<a href="<?php echo $brand_url ?>">
<img src="<?php echo $image['url']; ?>" />
</a>
<?php
endif;
}
}
add_action('woocommerce_before_variations_form', 'prefix_add_brand_before_variations_form', 10, 0);

Related

Can't use custom tax query on archive-product.php in Woocommerce

I am using a custom archive-product.php file in my WooCommerce theme. I haven't changed much about the file, just added a few HTML elements for sidebars and such, but the main componants remain untouched.
In my template, I'm trying to get a list of categories with this code, in a sidebar (outside the loop):
$prodCats = get_categories(array('taxonomy'=>'product_cat','exclude'=>'26,482,474','parent'=>0));
if (!empty($prodCats)) {
//echo '<center><strong>Jump to Category</strong></center>';
echo '<ul>';
foreach ($prodCats as $cat) {
// get the thumbnail id using the queried category term_id
$thumbnail_id = get_term_meta( $cat->term_id, 'thumbnail_id', true );
// get the image URL
$image = wp_get_attachment_url( $thumbnail_id );
echo '<li>';
echo '';
echo '<div class="catName">'.$cat->name.'</div>';
echo '<img src="'.$image.'"/>';
echo '</li>';
}
echo '</ul>';
}
But, this outputs only the product categories that are part of the current WooCommerce loop. It will not get all the product categories. It seems to somehow be tied to the WC loop on that page instead of operating independantly.
Is this intended behavior on a custom post type archive or specifically on WooCommerce?
If not, what might I look for to solve this?
This code, which does a similar thing on a woocommerce Product Attribute (pa_brand) is also affected. Note that I'm using new WP_Term_Query here to see if that solves it, but it still only pulls the terms that are in the current WC loop.
//Get brand list and display it
function ppp_get_brand_list() {
?>
<div id="brandList">
<center><h4>Brands</h4></center>
<?php
$brandArgs = array(
'taxonomy' => 'pa_brand',
'hide_empty' => true,
);
$brands = new WP_Term_Query( $brandArgs );
echo '<ul>';
foreach ( $brands->terms as $brand ) {
$brand_image_id = get_term_meta( $brand->term_id, 'product_search_image_id', true );
$brand_image = wp_get_attachment_url( $brand_image_id );
$brand_link = get_term_link($brand->term_id,'pa_brand');
echo '<li><img src="'.$brand_image.'" alt="" /></li>';
}
echo '</ul>';
?>
</div>
<?php
}

Thumbnail and price not showing on related products section

Well, I'm trying to create a module with the related products I have in my shop. My template has a file in the route /theme-name/woocommerce/single-product/related.php. In this we can see some code of how it call to the related product. It use the template as the listing product page (same template), but when I tried to shpw the thumbnail or the price it doesn't work. It only show me the title of the product, nothing else.
This is the code I have in my template for the file /related.php
<?php
if ( $related_products ) : ?>
<section id="nm-related" class="related products">
<div class="nm-row">
<div class="col-xs-12">
<h2><?php esc_html_e( 'Related products', 'woocommerce' ); ?></h2>
<?php woocommerce_product_loop_start(); ?>
<?php foreach ( $related_products as $related_product ) : ?>
<?php
$post_object = get_post( $related_product->get_id() );
setup_postdata( $GLOBALS['post'] =& $post_object );
wc_get_template_part( 'content', 'product' ); ?>
<?php endforeach; ?>
<?php woocommerce_product_loop_end(); ?>
</div>
</div>
</section>
<?php endif;
After that I use the "content-product" template like the listing page, where I don't have any problem.
For example, to show the product thumbnail I tried this:
<div class="nm-shop-loop-thumbnail nm-loader">
<a href="<?php echo esc_url( get_permalink() ); ?>" class="nm-shop-loop-thumbnail-link woocommerce-LoopProduct-link">
<?php
$id_pro = get_the_ID();
$pro_2 = get_post_thumbnail_id($id_pro);
$featured_image_url = wp_get_attachment_url( $pro_2 );
if(! empty( $featured_image_url )) { ?>
<?php
/**
* Hook: woocommerce_before_shop_loop_item_title.
*
* #hooked woocommerce_show_product_loop_sale_flash - 10
* #hooked woocommerce_template_loop_product_thumbnail - 10
*/
do_action( 'woocommerce_before_shop_loop_item_title' );
} else { ?>
<img src="https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg" data-src="https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg" data-srcset="https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg 350w, https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg 250w, https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg 400w" alt="" sizes="(max-width: 350px) 100vw, 350px" width="350" height="420" class="attachment-woocommerce_thumbnail size-woocommerce_thumbnail wp-post-image lazyloaded" srcset="https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg 350w, https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg 250w, https://cdn.mtods.ch/wp-content/uploads/sites/2/20190409092145/nopic.jpg 400w">
<?php
}
?>
</a>
</div>
And as I said, it works for the listing page but not inside single page product in related products section.
The $id_pro variable work in both pages, it shows the id of the product, but when I try to get the thumbnail URL with this id it return me "".
In the first image you can see the example for the listing page, on the other hand, in the second image you can see the example for the related products for the single product page:
I change the functionality and I created a new related product module, but still not working I don't know why...
I tried this:
In my related.php:
// Same category products query
$mproduct = new WP_Query(array(
'post_type' => 'product',
'product_cat' => $cat_slug,
'posts_per_page' => -1,
));
// Get query data
$posts = $mproduct->get_posts();
$num = $mproduct->post_count;
// Create new array with the actual product in it
$array_pro = [];
$array_pro[] = $product_id;
// Function for check if product is in array
function test_function($rand_pro, $array_pro, $posts, $num) {
if (in_array($rand_pro, $array_pro)) {
$new_pro_id = $posts[rand(0,$num-1)]->ID;
return true;
} else {
return false;
}
}
// If array is not full insert next elements
while (count($array_pro) < 5) {
$rand_pro = $posts[rand(0,$num-1)]->ID;
$pro_in_array = test_function($rand_pro, $array_pro, $posts, $num);
if ($pro_in_array == false) {
$array_pro[] = $rand_pro;
}
}
// Remove first element of array
array_shift($array_pro);
?>
<div class="related-products-row">
<?php
foreach( $array_pro as $post ) {
$rel_product_id = $post;
$rel_product_title = get_the_title($rel_product_id);
$rel_product_link = get_the_permalink($rel_product_id);
$rel_product_img_url = get_the_post_thumbnail($rel_product_id);
$_product = wc_get_product( $rel_product_id );
$rel_product_ref = $_product->get_attribute( 'reference' );
?>
<div class="col-md-3">
<p><?php echo $rel_product_img_url; ?></p>
</div>
<?php
}
?>
</div>
If you can see, when I try to getthe name I don't have problems but when I try to get the post_thumbnail_url or ref_number it doesn't show anything I don't know why.

Reversing sort order of ingested RSS feed in PHP

I have a site where I am 'pulling' local events from a secondary website RSS feed. I have this working however the feed is displaying in reverse order with the local events dated later (i.e. at the end of October versus events dated for today) showing up at the top instead of the bottom.
Here is the code I am using for the feed ingest:
<?php if(function_exists('fetch_feed')) {
include_once(ABSPATH . WPINC . '/feed.php'); // include the required file
$feed = fetch_feed('http://sample.com.au/events/feed/'); // specify the source feed
$limit = $feed->get_item_quantity(25); // specify number of items
$semti = array_flip($limit);
$items = $feed->get_items(0, $limit); // create an array of items
}
if ($limit == 0) echo '<div>The feed is unavailable.</div>';
else foreach ($items as $item) : ?>
<p><b><a href="<?php echo esc_url( $item->get_permalink() ); ?>" target="_blank">
<?php echo esc_html( $item->get_title() ); ?></a></b>
<?php echo esc_html( $item->get_date('| j F | g:i a') ); ?><br>
<?php echo sanitize_text_field( $item->get_content() ); ?>
</p>
<?php endforeach; ?>
This works perfectly to get my remote RSS feed and display the title, date of the event and the excerpt, however the order is reverse sorted.
I tried adding filters like "sort and ksort" in the "foreach ($items $items) :" area but this did not work for me. I've racked my brains on this one and am hoping someone can help me out. I appreciate any guidance/help in advance.
Try the appropriately named array_reverse function!
<?php if(function_exists('fetch_feed')) {
include_once(ABSPATH . WPINC . '/feed.php'); // include the required file
$feed = fetch_feed('http://sample.com.au/events/feed/'); // specify the source feed
$limit = $feed->get_item_quantity(25); // specify number of items
$items = $feed->get_items(0, $limit); // create an array of items
$semti = array_reverse($items); // & flip it
}
if ($limit == 0) echo '<div>The feed is unavailable.</div>';
else foreach ($semti as $item) : ?>
<p><b><a href="<?php echo esc_url( $item->get_permalink() ); ?>" target="_blank">
<?php echo esc_html( $item->get_title() ); ?></a></b>
<?php echo esc_html( $item->get_date('| j F | g:i a') ); ?><br>
<?php echo sanitize_text_field( $item->get_content() ); ?>
</p>
<?php endforeach; ?>
From PHP.net:
array_reverse
Return an array with elements in reverse order
array array_reverse ( array $array [, bool $preserve_keys = false ] )
Takes an input array and returns a new array with the order of the elements reversed.

Rendering an image on a WooCommerce product page

Using the Advanced Custom Fields plugin, I am trying to render an image on a single product page in WooCommerce.
I found this snippet of code from someone who is doing the same thing, but is rendering a text field instead. How would I change this to render an image?
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_top_category_desc', 1 );
function woocommerce_template_top_category_desc (){
$terms = get_the_terms( $post->ID, 'wc-attibute-class' );
if ( !empty($terms)) {
$term = array_pop($terms);
$text= get_field('txt-field', $term);
if (!empty($text)) {
echo $text;
}
}
}
So far I have this, but it's not working. The add action is correct because I was using it for something else, but starting at $terms is where I get lost and is obviously not right.
add_action( 'woocommerce_product_thumbnails' , 'add_below_featured_image', 9 );
function add_below_featured_image() {
$terms = get_the_terms( $post->ID, '496' );
if ( !empty($terms)) {
$term = array_pop($terms);
$image = get_field('banner_feedback', $term);
if (!empty($image)) {
echo $image;
}
}
}
Figured it out.
add_action( 'woocommerce_product_thumbnails' , 'add_below_featured_image', 9 );
function add_below_featured_image() {
if( is_single( pageidhere ) ) {
echo '<br><img src="urlhere">';
}
}
Steps to add custom gallery below featured image in woocommerce single product page(you can modify suitably to add just a single image):
Create an ACF for Image Gallery.
Copy the template for product-image.php from /plugins/woocommerce/templates/single-product to themes/your-child-theme/woocommerce/single-product/
Add the following code to product-image.php just before the closing div of
"images"
Add the images you want in the gallery to your single product admin page in the ACF custom field.
`
<?php $images = get_field('product_image_gallery'); ?>
<div class="mycustom_image_gallery">
<?php if($images): ?>
<div class="popup-gallery">
<?php foreach( $images as $image ): ?>
<a href="<?php echo $image['url']; ?>"
class="lightbox-link"
title="<?php echo $image['caption']; ?>"
data-description="<?php echo $image['description']; ?>">
<div class="image-wrap">
<img src="<?php echo $image['sizes']['thumbnail']; ?>">
</div>
</a>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
`

Woocommerce with wordpress - how can I display category image?

Have got this working on general wordpress categories using this plugin:
https://wordpress.org/plugins/categories-images/
Then adding the following to the category.php template as advised on another thread.
<?php if (function_exists('z_taxonomy_image_url')) { ?>
<img src="<?php echo z_taxonomy_image_url(); ?>" alt="<?php the_title(); ?>" />
<?php } ?>
I'd like to do exactly the same with the product categories. Actually ideally I'd like to be able to add background images to each category so that the description text can go over the top, like the way this shop works:
http://www.natures-own.co.uk/Antioxidants/
Is this possible with some minor code tweaking, or better still is there a woocommerce equivalent to the wordpress plugin I've used?
I cannot find any resources for this anywhere, everything I find on searching is referring to just thumbnail of a category list as far as I can see!
Thanks in advance
Pat
You can add the category image and description by adding the following to the archive-product.php file after <?php if ( apply_filters( 'woocommerce_show_page_title', true ) ) : ?> that if statement:
if (is_product_category())
{
global $wp_query;
$cat = $wp_query->get_queried_object();
$thumbnail_id = get_woocommerce_term_meta( $cat->term_id, 'thumbnail_id', true );
// get the image URL
$image = wp_get_attachment_url( $thumbnail_id );
//if you only want the image, uncomment the two lines below
//list($width, $height) = getimagesize($image);
//echo '<img src="'.$image.'" alt="" width="'.$width.'" height="'.$height.'"/>';
$cat_id=$cat->term_id;
$prod_term=get_term($cat_id,'product_cat');
$description=$prod_term->description;
echo '<div class="category-description" style="background-image:url('.$image.');">'.$description.'</div>';
}
To display Woocommerce Category image
use this code -
add_action('woocommerce_archive_description', 'woocommerce_add_category_image', 20);
function woocommerce_add_category_image()
{
global $product;
if (is_product_category())
{
global $wp_query;
$cat = $wp_query->get_queried_object();
$thumbnail_id = get_woocommerce_term_meta($cat->term_id, 'thumbnail_id', true);
$image = wp_get_attachment_url($thumbnail_id);
if ($image)
{
echo '<img src="' . esc_url($image) . '" alt="" />';
}
}
}

Resources