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;
}
}
?>
Related
I'm looking to add the attribute data of simple products in the infobox (cart/checkout/email). I am currently doing this with the following code:
function sm_woo_cart_attributes($cart_item, $cart_item_key){
$item_data = $cart_item_key['data'];
$attributes = $item_data->get_attributes();
if ( ! $attributes ) {
return $cart_item;
}
$out = $cart_item . '<br />';
foreach ( $attributes as $attribute ) {
if ( $attribute['is_taxonomy'] ) {
// skip variations
if ( $attribute['is_variation'] ) {
continue;
}
// backwards compatibility for attributes which are registered as taxonomies
$product_id = $item_data->id;
$terms = wp_get_post_terms( $product_id, $attribute['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->name) ) {
$tax_label = $tax_object->labels->name;
} elseif ( isset( $tax_object->label ) ) {
$tax_label = $tax_object->label;
}
foreach ( $terms as $term ) {
$out .= $tax_label . ': ';
$out .= $term->name . '<br />';
}
} else {
// not a taxonomy
$out .= $attribute['name'] . ': ';
$out .= $attribute['value'] . '<br />';
}
}
echo $out;
}
add_filter( 'woocommerce_cart_item_name', 'sm_woo_cart_attributes', 10, 2 );
This lists all of the attribute data, but above the product, shown in this screenshot. Is there any way to move the attribute data under the product image?
I am trying to display certain attributes that have data on a custom tab in woocommerce. I have found several examples of code but none are working for me.
I was given the following code
add_filter( 'woocommerce_display_product_attributes', 'remove_product_information', 10, 2 );
function remove_product_information( $product_attributes, $product ) {
// Remove an attribute from the array
unset($product_attributes['color']);
return $product_attributes;
}
echo wc_display_product_attributes( $product );
but its not filtering anything out it still displays 'color' or any other attribute name I put in there. Also I need t filter out several attributes, so do I just add additional unset lines? or is there a cleaner way to do that? Any insight on this?
Solution 1:
If you want to customize single product page attributes, You need to customize/override the product attribute page with your custom attribute page, after that, you can modify the attribute accordingly.
To customise the page like:
Copy
plugins/woocommerce/templates/single-product/product-attributes.php
To
themes/your-theme/woocommerce/single-product/product-attributes.php
and modify that.
Solution 2:
You have to define first the desired product attributes slugs in an array, after that you will get in single product pages:
add_action( 'display_product_attributes', 'display_product_attributes', 25 );
function display_some_product_attributes(){
// HERE define the desired product attributes to be displayed
$defined_attributes = array('fyllighet', 'carrier', 'billing-e-number');
global $product;
$attributes = $product->get_attributes();
if ( ! $attributes ) {
return;
}
$out = '<ul class="taste-attributes">';
foreach ( $attributes as $attribute ) {
// Get the product attribute slug from the taxonomy
$attribute_slug = str_replace( 'pa_', '', $attribute->get_name() );
// skip all non desired product attributes
if ( ! in_array($attribute_slug, $defined_attributes) ) {
continue;
}
// 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 .= '<p class="attribute-label">' . esc_html( $tax_label ) . ': </p> ';
$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 .= '<span class="attribute-value">' . implode(', ', $tax_terms) . '</span><progress value="' . implode(', ', $tax_terms) .
'" max="10"><div class="progress-bar"><span style="width:'
. implode(', ', $tax_terms) . '0%">'
. implode(', ', $tax_terms) . '</span></div></progress></li>';
} else {
$value_string = implode( ', ', $attribute->get_options() );
$out .= '<li class="' . sanitize_title($name) . ' ' . sanitize_title( $value_string ) . '">';
$out .= '<p class="attribute-label">' . $name . ': </p> ';
$out .= '<progress value="' . esc_html( $value_string ) . '" max="10"></progress></li>';
}
}
$out .= '</ul>';
echo $out;
}
So the code I posted does work, I was just using the wrong name for the attribute. I needed to add 'attribute_pa_' so for example 'attribute_pa_brand'
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!
I am working on a solution to have specific product attributes on a single product page. Based on Display specific custom product attributes on single product pages in Woocommerce answer code, I made some little changes here below
to display the selected attribute on single product pages:
add_action( 'woocommerce_single_product_summary', 'display_some_product_attributes', 25 );
function display_some_product_attributes(){
// HERE define the desired product attributes to be displayed
$defined_attributes = array('attributeB', 'attributeC', 'attributeD');
global $product;
$attributes = $product->get_attributes();
echo '<div style="font-size: 20px; font-weight: 500; margin-bottom: 5px; text-transform: uppercase;"><span>Sensorik</span></div>';
if ( ! $attributes ) {
return;
}
$out = '<ul class="taste-attributes">';
foreach ( $attributes as $attribute ) {
// Get the product attribute slug from the taxonomy
$attribute_slug = str_replace( 'pa_', '', $attribute->get_name() );
// skip all non desired product attributes
if ( ! in_array($attribute_slug, $defined_attributes) ) {
continue;
}
// 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 .= '<p class="' . esc_attr( $name ) . '">';
$out .= '<span class="attribute-label">' . esc_html( $tax_label ) . ': </span>';
$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 .= '<span class="attribute-value">' . implode(', ', $tax_terms) . '</span></p>';
} else {
$value_string = implode( ', ', $attribute->get_options() );
$out .= '<span class="' . sanitize_title($name) . ' ' . sanitize_title( $value_string ) . '">';
$out .= '<p class="attribute-label">' . $name . ': </p></span>';
}
}
$out .= '</ul>';
echo $out;
}
Then to transform text to an image for some attributes, I use the code below:
``` /**
* Insert JavaScript to replace WooCommerce product attributes text with images.
*/
function my_woocommerce_attributes_images(){
?>
<script>(function() {
var list, index, element, attValue, imgURL;
list = document.getElementsByClassName("attributeA");
for (index = 0; index < list.length; ++index) {
element = list[index];
attValue = element.getElementsByClassName("attribute-value")[0].innerText;
switch (attValue.trim()) {
case "valueA":
imgURL = "/wp-content/uploads/2020/10/cigar.png";
break;
case "valueB":
imgURL = "/wp-content/uploads/2020/10/fish.png";
break;
}
element.innerHTML = '<span class="attribute-label">Atteibute A: </span><img src="' + imgURL + '" width="20" height="20" />';
}
})();</script>
<?php
}
add_action('wp_footer', 'my_woocommerce_attributes_images'); ```
But I have the following problems:
Currently, only one case can be possible. If two ore more are true, it will not load any images. So we need a for each loop here and out put all true values => images. But all of my tryout was not sucessfull.
Currently we have to insert the code multiple times when we want to transform text to images from more than one attribute. I already tried to add a for each loop for list = document.getElementsByClassName("attributeA"); in order taht we can have there something like list = document.getElementsByClassName("attributeA", "attributeB", "attributeB"); But I'm not able to get this to work.
In order to make this more generic, also the element.innerHTML = '<span class="attribute-label">Attribute A: </span><img src="' + imgURL + '" width="20" height="20" />'; should be display the generic current Attribute lable name. But yeah, here I not able to add this in a ore generic way.
Any suggestions are welcome to make it work.
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.