How to get "items" column in orders panel in WooCommerce - wordpress

Since WooCommerce major update 3.0+ the "Purchased" column in backend orders list panel has been removed. This column previously showed a toggle list of items in the order for quick viewing.
How to Get back this "items" column in orders panel?
If there is any hook for that? Any ideas?
Thanks

That appears to have been removed for performance reasons, but you could look at the code that was removed and add it back via the manage_shop_order_posts_columns filter and manage_shop_order_posts_custom_column action.
/**
* Modify the custom columns for orders.
* #param array $columns
* #return array
*/
function so_43719068_shop_order_columns( $columns ) {
// the new column as an array for subsequent array manip
$new_column = array( 'order_items' => __( 'Purchased', 'your-plugin' ) );
$insert_after = 'order_title';
// insert after specified column
if( isset( $columns[ $insert_after ] ) ){
// find the "title" column
$index = array_search( $insert_after, array_keys( $columns) );
// reform the array
$columns = array_merge( array_slice( $columns, 0, $index + 1, true ), $new_column, array_slice( $columns, $index, count( $columns ) - $index, true ) );
// or add to end
} else {
$columns = array_merge( $columns, $new_column );
}
return $columns;
}
add_filter( 'manage_shop_order_posts_columns', 'so_43719068_shop_order_columns', 20 );
/**
* Output custom columns for orders.
* #param string $column
* #param int $post_id
*/
function so_43719068_render_shop_order_columns( $column, $post_id ) {
global $the_order;
if ( empty( $the_order ) || $the_order->get_id() !== $post_id ) {
$the_order = wc_get_order( $post_id );
}
switch ( $column ) :
case 'order_items' :
/* translators: %d: order items count */
echo '' . apply_filters( 'woocommerce_admin_order_item_count', sprintf( _n( '%d item', '%d items', $the_order->get_item_count(), 'woocommerce' ), $the_order->get_item_count() ), $the_order ) . '';
if ( sizeof( $the_order->get_items() ) > 0 ) {
echo '<table class="show_order_items" cellspacing="0">';
foreach ( $the_order->get_items() as $item ) {
$product = apply_filters( 'woocommerce_order_item_product', $item->get_product(), $item );
$item_meta_html = wc_display_item_meta( $item, array( 'echo' => false ) );
?>
<tr class="<?php echo apply_filters( 'woocommerce_admin_order_item_class', '', $item, $the_order ); ?>">
<td class="qty"><?php echo esc_html( $item->get_quantity() ); ?></td>
<td class="name">
<?php if ( $product ) : ?>
<?php echo ( wc_product_sku_enabled() && $product->get_sku() ) ? $product->get_sku() . ' - ' : ''; ?><?php echo apply_filters( 'woocommerce_order_item_name', $item->get_name(), $item, false ); ?>
<?php else : ?>
<?php echo apply_filters( 'woocommerce_order_item_name', $item->get_name(), $item, false ); ?>
<?php endif; ?>
<?php if ( ! empty( $item_meta_html ) ) : ?>
<?php echo wc_help_tip( $item_meta_html ); ?>
<?php endif; ?>
</td>
</tr>
<?php
}
echo '</table>';
} else echo '–';
break;
endswitch;
}
add_action( 'manage_shop_order_posts_custom_column', 'so_43719068_render_shop_order_columns', 10, 2 );

Related

How to Customize Cart and Checkout page for Woocommerce? [duplicate]

This question already has answers here:
Remove attribute values from product variation title and show them on separate rows
(1 answer)
Display variations attributes values as separate rows in Woocommerce cart / checkout
(1 answer)
Closed 2 years ago.
I noticed when I add to Cart products that have variations, Woocommerce uses 2 templates in Cart or Checkout pages.
if the product has only one or two variations, it uses this template as an example of my product:
<tr class="cart_item">
<td class="product-name">
3-in-1 Rechargeable Trimmer Grinder - CHINA, 3 IN 1 Grooming N5
<strong class="product-quantity">× 2</strong>
</td>
</tr>
If the product has more than two variations, it uses the following:
<tr class="cart_item">
<td class="product-name">
Mini Shaver Hair Trimmer Rechargeable
<strong class="product-quantity">× 1</strong>
<dl class="variation">
<dt class="variation-Size">Size:</dt>
<dd class="variation-Size"><p>Standard</p> </dd>
<dt class="variation-ShipsFrom">Ships From:</dt>
<dd class="variation-ShipsFrom"><p>CHINA</p> </dd>
<dt class="variation-Color">Color:</dt>
<dd class="variation-Color"><p>White</p> </dd>
</dl>
</td>
</tr>
As you notice when there are more than two it uses the class variations.
my question how to modify Woocommerce so that it uses only the 2nd template (more than two variations), in order to simplify code when i want customizing css or javascript.
more details :
review-order.php:
<tbody>
<?php
do_action( 'woocommerce_review_order_before_cart_contents' );
foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
$_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
if ( $_product && $_product->exists() && $cart_item['quantity'] > 0 && apply_filters( 'woocommerce_checkout_cart_item_visible', true, $cart_item, $cart_item_key ) ) {
?>
<tr class="<?php echo esc_attr( apply_filters( 'woocommerce_cart_item_class', 'cart_item', $cart_item, $cart_item_key ) ); ?>">
<td class="product-name">
<?php echo apply_filters( 'woocommerce_cart_item_name', $_product->get_name(), $cart_item, $cart_item_key ) . ' '; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
<?php echo apply_filters( 'woocommerce_checkout_cart_item_quantity', ' <strong class="product-quantity">' . sprintf( '× %s', $cart_item['quantity'] ) . '</strong>', $cart_item, $cart_item_key ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
<?php echo wc_get_formatted_cart_item_data( $cart_item ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</td>
<td class="product-total">
<?php echo apply_filters( 'woocommerce_cart_item_subtotal', WC()->cart->get_product_subtotal( $_product, $cart_item['quantity'] ), $cart_item, $cart_item_key ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</td>
</tr>
<?php
}
}
do_action( 'woocommerce_review_order_after_cart_contents' );
?>
</tbody>
cart-item-data.php:
<?php
/**
* Cart item data (when outputting non-flat)
*
* This template can be overridden by copying it to yourtheme/woocommerce/cart/cart-item-data.php.
*
* HOWEVER, on occasion WooCommerce will need to update template files and you
* (the theme developer) will need to copy the new files to your theme to
* maintain compatibility. We try to do this as little as possible, but it does
* happen. When this occurs the version of the template file will be bumped and
* the readme will list any important changes.
*
* #see https://docs.woocommerce.com/document/template-structure/
* #package WooCommerce/Templates
* #version 2.4.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
?>
<dl class="variation">
<?php foreach ( $item_data as $data ) : ?>
<dt class="<?php echo sanitize_html_class( 'variation-' . $data['key'] ); ?>"><?php echo wp_kses_post( $data['key'] ); ?>:</dt>
<dd class="<?php echo sanitize_html_class( 'variation-' . $data['key'] ); ?>"><?php echo wp_kses_post( wpautop( $data['display'] ) ); ?></dd>
<?php endforeach; ?>
</dl>
cart.php :
<tbody>
<?php do_action( 'woocommerce_before_cart_contents' ); ?>
<?php
foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
$_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
$product_id = apply_filters( 'woocommerce_cart_item_product_id', $cart_item['product_id'], $cart_item, $cart_item_key );
if ( $_product && $_product->exists() && $cart_item['quantity'] > 0 && apply_filters( 'woocommerce_cart_item_visible', true, $cart_item, $cart_item_key ) ) {
$product_permalink = apply_filters( 'woocommerce_cart_item_permalink', $_product->is_visible() ? $_product->get_permalink( $cart_item ) : '', $cart_item, $cart_item_key );
?>
<tr class="woocommerce-cart-form__cart-item <?php echo esc_attr( apply_filters( 'woocommerce_cart_item_class', 'cart_item', $cart_item, $cart_item_key ) ); ?>">
<td class="product-remove">
<?php
echo apply_filters( // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
'woocommerce_cart_item_remove_link',
sprintf(
'×',
esc_url( wc_get_cart_remove_url( $cart_item_key ) ),
esc_html__( 'Remove this item', 'woocommerce' ),
esc_attr( $product_id ),
esc_attr( $_product->get_sku() )
),
$cart_item_key
);
?>
</td>
<td class="product-thumbnail">
<?php
$thumbnail = apply_filters( 'woocommerce_cart_item_thumbnail', $_product->get_image(), $cart_item, $cart_item_key );
if ( ! $product_permalink ) {
echo $thumbnail; // PHPCS: XSS ok.
} else {
printf( '%s', esc_url( $product_permalink ), $thumbnail ); // PHPCS: XSS ok.
}
?>
</td>
<td class="product-name" data-title="<?php esc_attr_e( 'Product', 'woocommerce' ); ?>">
<?php
if ( ! $product_permalink ) {
echo wp_kses_post( apply_filters( 'woocommerce_cart_item_name', $_product->get_name(), $cart_item, $cart_item_key ) . ' ' );
} else {
echo wp_kses_post( apply_filters( 'woocommerce_cart_item_name', sprintf( '%s', esc_url( $product_permalink ), $_product->get_name() ), $cart_item, $cart_item_key ) );
}
do_action( 'woocommerce_after_cart_item_name', $cart_item, $cart_item_key );
// Meta data.
echo wc_get_formatted_cart_item_data( $cart_item ); // PHPCS: XSS ok.
// Backorder notification.
if ( $_product->backorders_require_notification() && $_product->is_on_backorder( $cart_item['quantity'] ) ) {
echo wp_kses_post( apply_filters( 'woocommerce_cart_item_backorder_notification', '<p class="backorder_notification">' . esc_html__( 'Available on backorder', 'woocommerce' ) . '</p>', $product_id ) );
}
?>
</td>
<td class="product-price" data-title="<?php esc_attr_e( 'Price', 'woocommerce' ); ?>">
<?php
echo apply_filters( 'woocommerce_cart_item_price', WC()->cart->get_product_price( $_product ), $cart_item, $cart_item_key ); // PHPCS: XSS ok.
?>
</td>
<td class="product-quantity" data-title="<?php esc_attr_e( 'Quantity', 'woocommerce' ); ?>">
<?php
if ( $_product->is_sold_individually() ) {
$product_quantity = sprintf( '1 <input type="hidden" name="cart[%s][qty]" value="1" />', $cart_item_key );
} else {
$product_quantity = woocommerce_quantity_input(
array(
'input_name' => "cart[{$cart_item_key}][qty]",
'input_value' => $cart_item['quantity'],
'max_value' => $_product->get_max_purchase_quantity(),
'min_value' => '0',
'product_name' => $_product->get_name(),
),
$_product,
false
);
}
echo apply_filters( 'woocommerce_cart_item_quantity', $product_quantity, $cart_item_key, $cart_item ); // PHPCS: XSS ok.
?>
</td>
<td class="product-subtotal" data-title="<?php esc_attr_e( 'Subtotal', 'woocommerce' ); ?>">
<?php
echo apply_filters( 'woocommerce_cart_item_subtotal', WC()->cart->get_product_subtotal( $_product, $cart_item['quantity'] ), $cart_item, $cart_item_key ); // PHPCS: XSS ok.
?>
</td>
</tr>
<?php
}
}
?>
<?php do_action( 'woocommerce_cart_contents' ); ?>
<tr>
<td colspan="6" class="actions">
<?php if ( wc_coupons_enabled() ) { ?>
<div class="coupon">
<label for="coupon_code"><?php esc_html_e( 'Coupon:', 'woocommerce' ); ?></label> <input type="text" name="coupon_code" class="input-text" id="coupon_code" value="" placeholder="<?php esc_attr_e( 'Coupon code', 'woocommerce' ); ?>" /> <button type="submit" class="button" name="apply_coupon" value="<?php esc_attr_e( 'Apply coupon', 'woocommerce' ); ?>"><?php esc_attr_e( 'Apply coupon', 'woocommerce' ); ?></button>
<?php do_action( 'woocommerce_cart_coupon' ); ?>
</div>
<?php } ?>
<button type="submit" class="button" name="update_cart" value="<?php esc_attr_e( 'Update cart', 'woocommerce' ); ?>"><?php esc_html_e( 'Update cart', 'woocommerce' ); ?></button>
<?php do_action( 'woocommerce_cart_actions' ); ?>
<?php wp_nonce_field( 'woocommerce-cart', 'woocommerce-cart-nonce' ); ?>
</td>
</tr>
<?php do_action( 'woocommerce_after_cart_contents' ); ?>
</tbody>
wc-product-functions.php :
/**
* Variation Formatting.
*
* Gets a formatted version of variation data or item meta.
*
* #param array|WC_Product_Variation $variation Variation object.
* #param bool $flat Should this be a flat list or HTML list? (default: false).
* #param bool $include_names include attribute names/labels in the list.
* #param bool $skip_attributes_in_name Do not list attributes already part of the variation name.
* #return string
*/
function wc_get_formatted_variation( $variation, $flat = false, $include_names = true, $skip_attributes_in_name = false ) {
$return = '';
if ( is_a( $variation, 'WC_Product_Variation' ) ) {
$variation_attributes = $variation->get_attributes();
$product = $variation;
$variation_name = $variation->get_name();
} else {
$product = false;
$variation_name = '';
// Remove attribute_ prefix from names.
$variation_attributes = array();
if ( is_array( $variation ) ) {
foreach ( $variation as $key => $value ) {
$variation_attributes[ str_replace( 'attribute_', '', $key ) ] = $value;
}
}
}
$list_type = $include_names ? 'dl' : 'ul';
if ( is_array( $variation_attributes ) ) {
if ( ! $flat ) {
$return = '<' . $list_type . ' class="variation">';
}
$variation_list = array();
foreach ( $variation_attributes as $name => $value ) {
// If this is a term slug, get the term's nice name.
if ( taxonomy_exists( $name ) ) {
$term = get_term_by( 'slug', $value, $name );
if ( ! is_wp_error( $term ) && ! empty( $term->name ) ) {
$value = $term->name;
}
}
// Do not list attributes already part of the variation name.
if ( '' === $value || ( $skip_attributes_in_name && wc_is_attribute_in_product_name( $value, $variation_name ) ) ) {
continue;
}
if ( $include_names ) {
if ( $flat ) {
$variation_list[] = wc_attribute_label( $name, $product ) . ': ' . rawurldecode( $value );
} else {
$variation_list[] = '<dt>' . wc_attribute_label( $name, $product ) . ':</dt><dd>' . rawurldecode( $value ) . '</dd>';
}
} else {
if ( $flat ) {
$variation_list[] = rawurldecode( $value );
} else {
$variation_list[] = '<li>' . rawurldecode( $value ) . '</li>';
}
}
}
if ( $flat ) {
$return .= implode( ', ', $variation_list );
} else {
$return .= implode( '', $variation_list );
}
if ( ! $flat ) {
$return .= '</' . $list_type . '>';
}
}
return $return;
}
class-wc-order-item-meta.php :
/**
* Display meta in a formatted list.
*
* #param bool $flat Flat (default: false).
* #param bool $return Return (default: false).
* #param string $hideprefix Hide prefix (default: _).
* #param string $delimiter Delimiter used to separate items when $flat is true.
* #return string|void
*/
public function display( $flat = false, $return = false, $hideprefix = '_', $delimiter = ", \n" ) {
$output = '';
$formatted_meta = $this->get_formatted( $hideprefix );
if ( ! empty( $formatted_meta ) ) {
$meta_list = array();
foreach ( $formatted_meta as $meta ) {
if ( $flat ) {
$meta_list[] = wp_kses_post( $meta['label'] . ': ' . $meta['value'] );
} else {
$meta_list[] = '
<dt class="variation-' . sanitize_html_class( sanitize_text_field( $meta['key'] ) ) . '">' . wp_kses_post( $meta['label'] ) . ':</dt>
<dd class="variation-' . sanitize_html_class( sanitize_text_field( $meta['key'] ) ) . '">' . wp_kses_post( wpautop( make_clickable( $meta['value'] ) ) ) . '</dd>
';
}
}
if ( ! empty( $meta_list ) ) {
if ( $flat ) {
$output .= implode( $delimiter, $meta_list );
} else {
$output .= '<dl class="variation">' . implode( '', $meta_list ) . '</dl>';
}
}
}
$output = apply_filters( 'woocommerce_order_items_meta_display', $output, $this, $flat );
if ( $return ) {
return $output;
} else {
echo $output; // WPCS: XSS ok.
}
}

Woocommerce Display a short description in the order overview via the Permalink Product Link in order-details-item.php

I would like to have the respective short description of the product / article displayed in WOOCOMMERCE in the order overview "Order-Details-Item" (template / woocommerce / order / order-details-item.php) about the product Permalink.
I found the following code on the web to allow a brief description.
Here is the code for this:
<div class="product_short_description_cart_default">
<?php
$product_id = $_product->get_parent_id();
$product = wc_get_product($product_id);
echo $product->get_short_description();
?>
</div>
But how do I incorporate them into my order-details-item.php file?
Here is the code for this:
<?php
/**
* Order Item Details
*
* This template can be overridden by copying it to yourtheme/woocommerce/order/order-details-item.php.
*
* HOWEVER, on occasion WooCommerce will need to update template files and you
* (the theme developer) will need to copy the new files to your theme to
* maintain compatibility. We try to do this as little as possible, but it does
* happen. When this occurs the version of the template file will be bumped and
* the readme will list any important changes.
*
* #see https://docs.woocommerce.com/document/template-structure/
* #package WooCommerce/Templates
* #version 3.7.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
if ( ! apply_filters( 'woocommerce_order_item_visible', true, $item ) ) {
return;
}
?>
<tr class="<?php echo esc_attr( apply_filters( 'woocommerce_order_item_class', 'woocommerce-table__line-item order_item', $item, $order ) ); ?>">
<td class="woocommerce-table__product-name product-name">
<div class="order-details-item-default-product-name-left">
<?php
echo '<div class="product-image">'.$product->get_image(array( 80, 80)).'</div>';
$is_visible = $product && $product->is_visible();
$product_permalink = apply_filters( 'woocommerce_order_item_permalink', $is_visible ? $product->get_permalink( $item ) : '', $item, $order );
?>
</div>
<div class="order-details-item-default-product-name-right">
<?php
echo apply_filters( 'woocommerce_order_item_name', $product_permalink ? sprintf( '%s', $product_permalink, $item->get_name() ) : $item->get_name(), $item, $is_visible ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
$qty = $item->get_quantity();
$refunded_qty = $order->get_qty_refunded_for_item( $item_id );
if ( $refunded_qty ) {
$qty_display = '<del>' . esc_html( $qty ) . '</del> <ins>' . esc_html( $qty - ( $refunded_qty * -1 ) ) . '</ins>';
} else {
$qty_display = esc_html( $qty );
}
echo apply_filters( 'woocommerce_order_item_quantity_html', ' <strong class="product-quantity">' . sprintf( '× %s', $qty_display ) . '</strong>', $item ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
do_action( 'woocommerce_order_item_meta_start', $item_id, $item, $order, false );
wc_display_item_meta( $item ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
do_action( 'woocommerce_order_item_meta_end', $item_id, $item, $order, false );
// SKU mit Sprachdatei
echo '<div class="cart-sku-item">' . __( "SKU:", "woostroid") . $product->sku . '</div>';
?>
</div>
</td>
<td class="woocommerce-table__product-total product-total">
<?php echo $order->get_formatted_line_subtotal( $item ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</td>
</tr>
<?php if ( $show_purchase_note && $purchase_note ) : ?>
<tr class="woocommerce-table__product-purchase-note product-purchase-note">
<td colspan="2"><?php echo wpautop( do_shortcode( wp_kses_post( $purchase_note ) ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></td>
</tr>
<?php endif; ?>
Can you please help me there!
Just place below code in functions.php
add_filter( 'woocommerce_order_item_name', 'display_product_title_as_link', 10, 2 );
function display_product_title_as_link( $item_name, $item ) {
$_product = get_product( $item['variation_id'] ? $item['variation_id'] : $item['product_id'] );
$_var_description ='';
if ( $item['variation_id'] ) {
$_var_description = $_product->get_variation_description();
}else{
$_var_description = $_product->get_short_description();
}
return $_var_description.'<br>'.$item_name;
}
Thanks for your efforts and for the great code.
But did we talk past each other ?!
So I would like to have the following displayed next to the product image:
Product short description
Product name with link
Design / (variants of products)
Item number (SKU NUMBER)
points 2 and 3 and 4 work.
I only miss the first point (product short description) (echo $ product-> get_short_description ();)
Excuse me for my first bad description.

Adding WooCommerce CSS classes for attributes

How can I add a CSS class for the product attribute in Woocommerce? For Example, I need to display individual icons for each attribute via :before & :after pseudoelements.
Thanks in advance!
P.S. Sorry fot delay
I thought that you are familiar with the syntax of Woocommerce. Also Woocommerce use actions & hooks to display some information. For example to display attributes on the product page. I want to display Woocommcerce product attributes with individual icons. Now I added php code after the hook in content-product.php (woocomemrce template to display products in loop)
/**
* woocommerce_after_shop_loop_item_title hook.
*
* #hooked woocommerce_template_loop_rating - 5
* #hooked woocommerce_template_loop_price - 10
*/
do_action( 'woocommerce_after_shop_loop_item_title' );
/** ATTRIBUTES BEGIN **/
// Get the attributes
$attributes = $product->get_attributes();
// Start the loop
foreach ( $attributes as $attribute ) :
// Check and output, adopted from /templates/single-product/product-attributes.php
if ( $attribute['is_taxonomy'] ) {
$values = wc_get_product_terms( $product->id, $attribute['name'], array( 'fields' => 'names' ) );
echo apply_filters( 'woocommerce_attribute', wpautop( wptexturize( implode( ', ', $values ) ) ), $attribute, $values );
} else {
// Convert pipes to commas and display values
$values = array_map( 'trim', explode( WC_DELIMITER, $attribute['value'] ) );
echo apply_filters( 'woocommerce_attribute', wpautop( wptexturize( implode( ', ', $values ) ) ), $attribute, $values );
}
endforeach;
/** ATTRIBUTES END **/
By this method I can display product attributs and add icon to the attributes. But I can add only one icon, because in Woocommerce there is no functionality to add CSS classes foe each attribute.
I have understood that you need to add different classes (for CSS) for each attribute.
For this you have to edit the following php file in woocommerece. In your wordpress go to wp-content\plugins\woocommerce\templates\single-product and open product-attributes.php file.
Replace following code.
Note:Either you can edit in plugin directly or you can copy this file into your child theme.
<?php
/**
* Product attributes
*
* Used by list_attributes() in the products class.
*
* This template can be overridden by copying it to yourtheme/woocommerce/single-product/product-attributes.php.
*
* HOWEVER, on occasion WooCommerce will need to update template files and you
* (the theme developer) will need to copy the new files to your theme to
* maintain compatibility. We try to do this as little as possible, but it does
* happen. When this occurs the version of the template file will be bumped and
* the readme will list any important changes.
*
* #see https://docs.woocommerce.com/document/template-structure/
* #author WooThemes
* #package WooCommerce/Templates
* #version 3.1.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
?>
<table class="shop_attributes">
<?php if ( $display_dimensions && $product->has_weight() ) : ?>
<tr>
<th><?php _e( 'Weight', 'woocommerce' ) ?></th>
<td class="product_weight"><?php echo esc_html( wc_format_weight( $product->get_weight() ) ); ?></td>
</tr>
<?php endif; ?>
<?php if ( $display_dimensions && $product->has_dimensions() ) : ?>
<tr>
<th><?php _e( 'Dimensions', 'woocommerce' ) ?></th>
<td class="product_dimensions"><?php echo esc_html( wc_format_dimensions( $product->get_dimensions( false ) ) ); ?></td>
</tr>
<?php endif; ?>
<?php
//Here I added a variable for incrementing.
$class_name=1;
?>
<?php foreach ( $attributes as $attribute ) : $class_name++; ?>
<tr>
<th class="my_classname_<?php echo $class_name++; ?>"><?php echo wc_attribute_label( $attribute->get_name() ); ?></th>
<td><?php
$values = array();
if ( $attribute->is_taxonomy() ) {
$attribute_taxonomy = $attribute->get_taxonomy_object();
$attribute_values = wc_get_product_terms( $product->get_id(), $attribute->get_name(), array( 'fields' => 'all' ) );
foreach ( $attribute_values as $attribute_value ) {
$value_name = esc_html( $attribute_value->name );
if ( $attribute_taxonomy->attribute_public ) {
$values[] = '' . $value_name . '';
} else {
$values[] = $value_name;
}
}
} else {
$values = $attribute->get_options();
foreach ( $values as &$value ) {
$value = make_clickable( esc_html( $value ) );
}
}
echo apply_filters( 'woocommerce_attribute', wpautop( wptexturize( implode( ', ', $values ) ) ), $attribute, $values );
?></td>
</tr>
<?php endforeach; ?>
</table>
If you want to assign the CSS class for eache of the Woocommerce specific attribute value you can use this code:
/** ATTRIBUTES BEGIN **/
// Get the attributes
$attributes = $product->get_attributes();
// Start the loop
foreach ( $attributes as $attribute ) :
// Check and output, adopted from /templates/single-product/product-attributes.php
if ( $attribute['is_taxonomy'] ) {
$values = wc_get_product_terms( $product->id, $attribute['name'], array( 'fields' => 'names' ) );
if($attribute['name'] == 'pa_usl_otpuska'){
foreach($values as $value){
$value_classname = $value; // how can I get the value name??
}
echo apply_filters( 'woocommerce_attribute', wpautop( wptexturize('<span class="lbl ' . $value_classname . '">'. implode( '</span><span class="lbl ' . $value . '">', $values ).'</span>' ) ), $attribute, $values );
} else {
echo apply_filters( 'woocommerce_attribute', wpautop( wptexturize( implode( ', ', $values ) ) ), $attribute, $values );
}
} else {
// Convert pipes to commas and display values
$values = array_map( 'trim', explode( WC_DELIMITER, $attribute['value'] ) );
echo apply_filters( 'woocommerce_attribute', wpautop( wptexturize( implode( ', ', $values ) ) ), $attribute, $values );
}
endforeach;
/** ATTRIBUTES END **/
For example I have added this code to the Woocomemrce - content-product.php after the hook:
do_action( 'woocommerce_after_shop_loop_item_title' );
And added some CSS code like this:
.lbl.reciept:before{
font-family: FontAwesome;
content: "\f0f6";
padding-right:10px;
color:#FF9F41;
font-size:25px;
}

Woocommerce variable products

I am using woocommerce in my website. I need radio buttons instead of dropdown for variations on product page. For this, I have replaced the variable.php file with the following code :--
<?php
/**
* Variable product add to cart
*
* #author WooThemes
* #package WooCommerce/Templates
* #version 2.5.0
*
* Modified to use radio buttons instead of dropdowns
* #author 8manos
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
if ( ! function_exists( 'print_attribute_radio' ) ) {
function print_attribute_radio( $checked_value, $value, $label, $name ) {
global $product;
// This handles < 2.4.0 bw compatibility where text attributes were not sanitized.
$checked = sanitize_title( $checked_value ) === $checked_value ? checked( $checked_value, sanitize_title( $value ), false ) : checked( $checked_value, $value, false );
$input_name = 'attribute_' . esc_attr( $name ) ;
$esc_value = esc_attr( $value );
$id = esc_attr( $name . '_v_' . $value . $product->get_id() ); //added product ID at the end of the name to target single products
$filtered_label = apply_filters( 'woocommerce_variation_option_name', $label );
printf( '<div><input type="radio" name="%1$s" value="%2$s" id="%3$s" %4$s><label for="%3$s">%5$s</label></div>', $input_name, $esc_value, $id, $checked, $filtered_label );
}
}
global $product;
$attribute_keys = array_keys( $attributes );
do_action( 'woocommerce_before_add_to_cart_form' ); ?>
<form class="variations_form cart" method="post" enctype='multipart/form-data' data-product_id="<?php echo absint( $product->get_id() ); ?>" data-product_variations="<?php echo htmlspecialchars( wp_json_encode( $available_variations ) ) ?>">
<?php do_action( 'woocommerce_before_variations_form' ); ?>
<?php if ( empty( $available_variations ) && false !== $available_variations ) : ?>
<p class="stock out-of-stock"><?php _e( 'This product is currently out of stock and unavailable.', 'woocommerce' ); ?></p>
<?php else : ?>
<table class="variations" cellspacing="0">
<tbody>
<?php foreach ( $attributes as $name => $options ) : ?>
<tr>
<td class="label"><label for="<?php echo sanitize_title( $name ); ?>"><?php echo wc_attribute_label( $name ); ?></label></td>
<?php
$sanitized_name = sanitize_title( $name );
if ( isset( $_REQUEST[ 'attribute_' . $sanitized_name ] ) ) {
$checked_value = $_REQUEST[ 'attribute_' . $sanitized_name ];
} elseif ( isset( $selected_attributes[ $sanitized_name ] ) ) {
$checked_value = $selected_attributes[ $sanitized_name ];
} else {
$checked_value = '';
}
?>
<td class="value">
<?php
if ( ! empty( $options ) ) {
if ( taxonomy_exists( $name ) ) {
// Get terms if this is a taxonomy - ordered. We need the names too.
$terms = wc_get_product_terms( $product->get_id(), $name, array( 'fields' => 'all' ) );
foreach ( $terms as $term ) {
if ( ! in_array( $term->slug, $options ) ) {
continue;
}
print_attribute_radio( $checked_value, $term->slug, $term->name, $sanitized_name );
}
} else {
foreach ( $options as $option ) {
print_attribute_radio( $checked_value, $option, $option, $sanitized_name );
}
}
}
echo end( $attribute_keys ) === $name ? apply_filters( 'woocommerce_reset_variations_link', '<a class="reset_variations cstm-reset" href="#">' . __( 'Clear', 'woocommerce' ) . '</a>' ) : '';
?>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<?php do_action( 'woocommerce_before_add_to_cart_button' ); ?>
<div class="single_variation_wrap">
<?php
do_action( 'woocommerce_before_single_variation' );
do_action( 'woocommerce_single_variation' );
do_action( 'woocommerce_after_single_variation' );
?>
</div>
<?php do_action( 'woocommerce_after_add_to_cart_button' ); ?>
<?php endif; ?>
<?php do_action( 'woocommerce_after_variations_form' ); ?>
</form>
<?php do_action( 'woocommerce_after_add_to_cart_form' ); ?>
It shows the radio buttons as I needed but the problem is that, the price is not displaying on variation products.You can check my website http://www.itsjal.com/store/product/led-lamp-par38/
Price should be displayed at the end when I select variations options. Can anybody help me to solve this problem ?
Thanks
You can try this plugin. https://wordpress.org/plugins/woocommerce-radio-buttons/
This plugin also has its own template files if you want to customize it.

WooCommerce product image zoom

I am currently working on a Wordpress website that supports WooCommerce. I've created a product, and I've uploaded a featured image and other photos for the gallery. But there is a problem i can't figure out. It doesn't matter how big the photo is, if I put the cursor on it, it zooms almost 200%, and that's too much. Does anyone know how to reduce (or remove) the zoom feature? I've been to "sinlge-product/product-image.php" but it seems I can't find any zoom option in the code:
<?php
/**
* Single Product Image
*
* #author WooThemes
* #package WooCommerce/Templates
* #version 2.0.14
*/
if ( ! defined( 'ABSPATH' ) ) {
exit; // Exit if accessed directly
}
global $post, $woocommerce, $product;
?>
<div class="images">
<?php
if ( has_post_thumbnail() ) {
$image_title = esc_attr( get_the_title( get_post_thumbnail_id() ) );
$image_caption = get_post( get_post_thumbnail_id() )->post_excerpt;
$image_link = wp_get_attachment_url( get_post_thumbnail_id() );
$image = get_the_post_thumbnail( $post->ID, apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ), array(
'title' => $image_title,
'alt' => $image_title
) );
$attachment_count = count( $product->get_gallery_attachment_ids() );
if ( $attachment_count > 0 ) {
$gallery = '[product-gallery]';
} else {
$gallery = '';
}
} else {
echo apply_filters( 'woocommerce_single_product_image_html', sprintf( '<img src="%s" alt="%s" />', wc_placeholder_img_src(), __( 'Placeholder', 'woocommerce' ) ), $post->ID );
}
?>
<?php do_action( 'woocommerce_product_thumbnails' ); ?>
</div>
Thank you!
Copy / Paste this code to functions.php on your child theme. Tested and approved ;)
remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20 );
add_filter( 'woocommerce_gallery_full_size', 'change_magnifier_lightbox_image_size', 20, 1 );
function change_magnifier_lightbox_image_size( $size ){
$thumbnail_id = get_post_thumbnail_id( get_the_id() );
$attachment = wp_get_attachment_metadata( $thumbnail_id, FALSE );
// Always return a value in a filter hook
return ( $attachment['width'] > 3071 || $attachment['height'] > 3071 ) ? 'preview' : 'large';
}

Resources