Wordpress display custom taxonomy image on single post - php - php

I´m trying to display a custom taxonomy image in the frontend on a single post.
Following situation:
Created a CPT for "Weine"
Added a taxonomy "winzer"
Added the following code to my functions.php to display the "winemaker" taxonomy with its description in the single post using a shortcode:
function wpb_catlist_desc() {
$string = '<div>';
$catlist = get_terms( 'winzer' );
if ( ! empty( $catlist ) ) {
foreach ( $catlist as $key => $item ) {
$string .= '<div>'. $item->name . '<br />';
$string .= '<em>'. $item->description . '</em></div>';
}
}
$string .= '</div>';
return $string;
}
add_shortcode('wpb_categories', 'wpb_catlist_desc');
Added an Image fieled to the "winzer" taxonomy using ACF. --> Here´s where I´m stuck now.
I need to add another line to the php snippet to also display the image using the shortcode.
Any hints how to get this done? :)
Cheers!!!!

function wpb_catlist_desc() {
$string = '<div>';
$catlist = get_terms( 'winzer' );
if ( ! empty( $catlist ) ) {
foreach ( $catlist as $key => $item ) {
$image = get_field('Your_image_field_ID');
if(!empty($image)) {
$imgurl = $image['url'];
}
$string .= '<div>';
$string .= '<img src="' . $imgurl . '" alt="' . $item->name . '"/><br />';
$string .= $item->name . '<br />';
$string .= '<em>'. $item->description . '</em></div>';
}
}
$string .= '</div>';
return $string;
}
add_shortcode('wpb_categories', 'wpb_catlist_desc');

Here's how I got it solved:
function wpb_catlist_desc() {
global $post;
$string = '<div>';
$catlist = wp_get_post_terms($post->ID, 'winzer');
if ( ! empty( $catlist ) ) {
foreach ($catlist as $item ) {
$image = get_field('winzer_bild', 'winzer_'.$item->term_id);
if(!empty($image)) {
$imgurl = $image['url'];
}
$string .= '<div>';
$string .= '<img class="winzer-bild-klein" src="' . $imgurl . '" alt="' . $item->name . '"style="width:100%;"/>';
$string .= '<h3 class="winzer-name-n">'. $item->name . '</h3>';
$string .= '<p>'. $item->description . '</p></div>';
}
}
$string .= '</div>';
return $string;
}
add_shortcode('wpb_categories', 'wpb_catlist_desc');

Related

Wordpress custom post type how to display taxonomy description in single post

I´m trying to display a custom taxonomy item description in the frontend on a single post.
Following situation:
Created a CPT for "Weine"
Added a taxonomy "winzer"
Added the following code to my functions.php to display the "winzer" taxonomy item with its description in the single post using a shortcode:
function wpb_catlist_desc() {
$string = '<div>';
$catlist = get_terms( 'winzer' );
if ( ! empty( $catlist ) ) {
foreach ( $catlist as $key => $item ) {
$string .= '<div>'. $item->name . '<br />';
$string .= '<em>'. $item->description . '</em></div>';
}
}
$string .= '</div>';
return $string;
}
add_shortcode('wpb_categories', 'wpb_catlist_desc');
The code is working well, but it’s displaying all the items I created in the “Winzer” Taxonomy.
I just want to display the Item which is related to the single post.
Any ideas on how to change the code to get this done?
Cheers!!!!
You could use get_the_terms() instead of using get_terms(). So you could do something like this:
add_shortcode('wpb_categories', 'wpb_catlist_desc');
$the_id_of_current_post = get_the_ID(); // get the id of the current post
// pass the id to your function
function wpb_catlist_desc($the_id_of_current_post)
{
$string = '<div>';
$$catlist = get_the_terms( $the_id_of_current_post, 'winzer' );
if ( ! empty( $catlist ) ) {
foreach ( $catlist as $cat ) {
$string .= '<div>'. $cat->name . '<br />';
$string .= '<em>'. $cat->description . '</em></div>';
}
}
$string .= '</div>';
return $string;
}
Or an alternative way would be something like this:
add_shortcode('wpb_categories', 'wpb_catlist_desc');
function wpb_catlist_desc()
{
global $post;
$the_id_of_current_post = $post->ID; // get the id of the current post
$string = '<div>';
$$catlist = get_the_terms( $the_id_of_current_post, 'winzer' );
if ( ! empty( $catlist ) ) {
foreach ( $catlist as $cat ) {
$string .= '<div>'. $cat->name . '<br />';
$string .= '<em>'. $cat->description . '</em></div>';
}
}
$string .= '</div>';
return $string;
}
Let me know if you were able to get this to work!

How do I call post objects (products) custom fields using shortcodes on posts

I'm trying to show 'featured products' on blog posts. These featured products are to be selected with custom fields post objects on the back end for each post.
I have written up what I think the PHP should be - where am I going wrong? When I try to use the shortcode no code appears (but the shortcode text doesn't show so it's definitely added). Thanks :)
<?php
add_shortcode('featuredproducts' , 'printfeaturedprod');
function printfeaturedprod(){
$html = '';
$instruments = get_field('featuredprod');
if( $instruments ):
$html .= '<div class="featuredproducts">';
$html .= '<h2 style="font-size:18px; font-family:poppins;">Featured in this video</h2>';
foreach( $instruments as $instruments ):
$permalink = get_permalink( $instruments->ID );
$title = get_the_title( $instruments->ID );
$product = wc_get_product( $instruments->ID );
$price = $product->get_price();
$featured_img_url = get_the_post_thumbnail_url($instruments->ID, 'full');
$html .= '<div class="featuredproduct">';
$html .= '<img class="featuredproductimg" src="' . $featured_img_url . '">';
$html .= '<div class="proddetails">';
$html .= '<a class="producttitle" href="' . $permalink . '"><?php echo esc_html( $title ); ?></a>';
$html .= '<br><span class="productprice">£' . $price . '</span>';
$html .= '</div>';
$html .= '</div>';
endforeach;
$html .= '</div>';
endif;
}
You have built your HTML in the $html variable but then you don’t do anything with it. The shortcode doesn’t automatically know that you want to display the $html variable so you need to return ( or echo) it at the end before the function finishes:
add_shortcode('featuredproducts' , 'printfeaturedprod');
function printfeaturedprod(){
$html = '';
/* your code here... */
return $html;
}
Reference: See the add_shortcode WP documentation

Show specific item attribute in WooCommerce cart

I have code which (I modified and took from here Woocommerce get specific attribute value on cart page) is showing full list of containing attributes, but I would like to use only specific attribute, let's say "colour1" to generate SVG file.
<?php
$item_data = $cart_item['data'];
$attributes = $item_data->get_attributes();
foreach ( $attributes as $attribute )
{
$out ='';
$out .= $attribute['name'] . ': ';
$out .= $attribute['value'] . '<br />';
echo $out;
}
?>
just found solution:
<?php
$item_data = $cart_item['data'];
$attributes = $item_data->get_attributes();
foreach ( $attributes as $attribute )
{
if ( $attribute['name'] == 'colour1' ) {
$out ='';
$out .= $attribute['name'] . ': ';
$out .= $attribute['value'] . '<br />';
echo $out;
}
}
?>

Wordpress - echo implode

I've got the following snippet to grab all the terms of the taxonomy available for the post.
$tags = get_the_terms( $post->ID, 'books' );
if( $tags ) : ?>
<div class="listing-tag-list">
<?php foreach( $tags as $tag ) :
$tag_link = esc_url( get_term_link( $tag ) );
$tag_output = '';
$tag_output .= '<a href="' . $tag_link . '" class="listing-tag">';
$tag_output .= '<span class="tag__text">' . $tag->name . '</span></a>';
echo $tag_output;
endforeach; ?>
</div>
<?php endif;
My problem is that currently, the terms show in a row without a space.
How can I separate them with a space and a comma?
I've been trying to use implode and so replace the echo $tag_output; with echo implode( ', ', $tag_output );, but I can't seem to be able to fit it into the current code.
Where am I going wrong?
Why not add it directly in your loop
$tag_output = '';
$tag_output .= '<a href="' . $tag_link . '" class="listing-tag">';
$tag_output .= '<span class="tag__text">' . $tag->name . '</span></a>';
$tag_output .=", ";
echo $tag_output;
And outside the loop,remove the last comma
rtrim($tag_output,', ');
Easy and simple solution:
<?php echo get_the_terms_list( $post_id, 'books', '<div class="listing-tag-list">', ', ', '</div>' );?>
More details on codex
Or this one:
<?php
$tags = get_the_terms( $post->ID, 'books' );
if( ! is_wp_error( $tags ) ){
$links = array();
foreach ( $tags as $tag ) {
$link = get_term_link( $tag, $tag );
$links[] = '<span class="tag__text">' . $tag->name . '</span>';
}
$before = '<div class="listing-tag-list">';
$sep = ', ';
$after = '</div>';
echo $before . join( $sep, $tag_links ) . $after;
}

Replace WooCommerce attribute labels by a custom image for each

I am working on project and I need some group help.
I am using woocommerce product system and on shop archive page product I am showing attribute-label: attribute-value (just like text).
attribute-label:attribute-value (ex. Transmission: Manual)
Is there a way to show attribute-label as image? I can't add html code like <img src..."/> and styling with CSS doesn't help too.
I have searched for plugins and more.. But nothing on web.
To show attributes on product shop page i have used this function:
function isa_woocommerce_all_pa(){
global $product;
$attributes = $product->get_attributes();
if ( ! $attributes ) {
return;
}
$out = '<ul class="custom-attributes">';
foreach ( $attributes as $attribute ) {
// skip variations
if ( $attribute->get_variation() ) {
continue;
}
$name = $attribute->get_name();
if ( $attribute->is_taxonomy() ) {
$terms = wp_get_post_terms( $product->get_id(), $name, 'all' );
// get the taxonomy
$tax = $terms[0]->taxonomy;
// get the tax object
$tax_object = get_taxonomy($tax);
// get tax label
if ( isset ( $tax_object->labels->singular_name ) ) {
$tax_label = $tax_object->labels->singular_name;
} elseif ( isset( $tax_object->label ) ) {
$tax_label = $tax_object->label;
// Trim label prefix since WC 3.0
if ( 0 === strpos( $tax_label, 'Product ' ) ) {
$tax_label = substr( $tax_label, 8 );
}
}
$out .= '<li class="' . esc_attr( $name ) . '">';
$out .= '<span class="attribute-label">' . esc_html( $tax_label ) . ': </span> ';
$out .= '<span class="attribute-value">';
$tax_terms = array();
foreach ( $terms as $term ) {
$single_term = esc_html( $term->name );
// Insert extra code here if you want to show terms as links.
array_push( $tax_terms, $single_term );
}
$out .= implode(', ', $tax_terms);
$out .= '</span></li>';
} else {
$value_string = implode( ', ', $attribute->get_options() );
$out .= '<li class="' . sanitize_title($name) . ' ' . sanitize_title( $value_string ) . '">';
$out .= '<span class="attribute-label">' . $name . ': </span> ';
$out .= '<span class="attribute-value">' . esc_html( $value_string ) . '</span></li>';
}
}
$out .= '</ul>';
echo $out;
}
add_action('woocommerce_single_product_summary', 'isa_woocommerce_all_pa', 25);
Can someone help me with this? How to change attribute-label with image?
Updated since WC 3.2+
As Product attributes dont have images, you should create a in your active theme a folder images (if it doesn't exist) and inside a subfolder attributes.
For each product attribute, you will have to add an image inside this subfolder attributes, which name will be the name of your attribute (the slug). For example for "Color" attribute you will have to add an image named color.jpg.
Then I have make some changes in your code, to get this working. Only the terms set in the product for each attribute will be displayed. For each attribute you will get an image.
Here is the code:
add_action('woocommerce_single_product_summary', 'isa_woocommerce_all_pa', 25);
function isa_woocommerce_all_pa(){
global $product;
$attributes = $product->get_attributes();
if ( ! $attributes ) return;
$out = '<ul class="custom-attributes">';
foreach ( $attributes as $attribute ) {
if ( $attribute->get_variation() ) continue; // skip variations
if ( $attribute->is_taxonomy() ) {
$taxonomy = $attribute->get_name();
$taxo_obj = $attribute->get_taxonomy_object();
$name = $taxo_obj->attribute_name; // <== Corrected
$label = $taxo_obj->attribute_label; // <== Corrected
$out .= '<li class="' . esc_attr( $taxonomy ) . '">';
## ATTRIBUTE IMAGE ##
// For a child theme use get_stylesheet_directory_uri() instead.
$out .= '<img class="attribute-image" src="'.get_template_directory_uri().'/images/attributes/'.$name.'.jpg" alt="Attribute '.$label.'"/> ';
$out .= '<span class="attribute-values">';
$terms = wp_get_post_terms( $product->get_id(), $taxonomy, array('fields' => 'names') );
foreach ( $terms as $term_name )
$term_names['name'] = $term_name;
$out .= implode(', ', $term_names);
$out .= '</span></li>';
} else {
$value_string = implode( ', ', $attribute->get_options() );
$out .= '<li class="' . sanitize_title($taxonomy) . ' ' . sanitize_title( $value_string ) . '">';
$out .= '<span class="attribute-label">' . $taxonomy . ': </span> ';
$out .= '<span class="attribute-value">' . esc_html( $value_string ) . '</span></li>';
}
}
$out .= '</ul>';
echo $out;
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
This code is tested and work.

Categories