I want to show my woocommerce website's variable product front end should show like this (kindly check image). Is there any way to do? enter image description here
I tried this function but it's not working
`add_filter( 'woocommerce_variation_option_name', 'display_variation_title_image');
function display_variation_title_image( $term_name ) {
global $wp_query;
$variation_id = $wp_query->post->ID;
$variation = new WC_Product_Variation( $variation_id );
$attachment_id = $variation->get_image_id();
$image_src = wp_get_attachment_image_src( $attachment_id, 'thumbnail' );
if ( $image_src ) {
$term_name .= '<img src="' . $image_src[0] . '" alt="' . $term_name . '" />';
}
return $term_name;
}
`
Related
Is there any way to change the items in cart number based only on the unique products?
I can’t find anything to start play with. Any help greatly appreciated!
Example:
Pen 3x
Book 2x
Currently :
5 items on Cart
Should be :
2 items on Cart.
Thanks
This is the current code on the theme and I target the kleo-notifications new-alert:
if ( ! function_exists( 'kleo_woo_get_mini_cart' ) ) {
function kleo_woo_get_mini_cart( $just_inner = false ) {
global $woocommerce;
//Enqueue variations script for quick view
wp_enqueue_script( 'wc-add-to-cart-variation' );
$cart_output = "";
$cart_total = $woocommerce->cart->get_cart_total();
$cart_count = $woocommerce->cart->cart_contents_count;
$cart_count_text = kleo_product_items_text( $cart_count );
$cart_has_items = '';
if ( $cart_count != "0" ) {
$cart_has_items = ' has-products';
}
if ( ! $just_inner ) {
$cart_output .= '<li class="menu-item kleo-toggle-menu shop-drop">'
. '<a class="cart-contents js-activated" href="' . wc_get_cart_url() . '" title="' . __( "View Cart", "woocommerce" ) . '">'
. '<span class="cart-items' . $cart_has_items . '"><i class="icon icon-basket-full-alt"></i> ';
if ( $cart_count != "0" ) {
$cart_output .= "<span class='kleo-notifications new-alert'>" . $cart_count . "</span>";
}
add_filter( 'woocommerce_add_to_cart_fragments', 'test_cart_count_fragments', 20, 10 );
function test_cart_count_fragments( $fragments ) {
global $woocommerce;
$items = $woocommerce->cart->get_cart();
$fragments['span.new-alert'] = '<span class="kleo-notifications new-alert">' . count($items). '</span>';
return $fragments;
}
Hello friends i want so image and description in categories list widget for showing description i use below code:
in function.php
function wpb_catlist_desc() {
$string = '<ul>';
$catlist = get_terms( 'category' );
if ( ! empty( $catlist ) ) {
foreach ( $catlist as $key => $item ) {
$string .= '<li>'. $item->name . '<br />';
$string .= '<em>'. $item->description . '</em> </li>';
}
}
$string .= '</ul>';
return $string;
}
add_shortcode('wpb_categories', 'wpb_catlist_desc');
and in class-wp-widget-categories.php
echo do_shortcode('[wpb_categories]');
it is showing categories name and his description now i want to show categories image also. any one please help me how can i get that. i had try Categories Images plugin for show images but can't able to show
Image get z_taxonomy_image_url($id) and z_taxonomy_image($id)
if(z_taxonomy_image_url($item->term_id))
{
$string .= '<img src ="'.z_taxonomy_image_url($item->term_id).'" style="width: 20%;">';
}
You can get the image using following code and append it to $string.
$catlist = get_terms( 'category' ); // get category list
$string ="<ul>";
foreach ( $catlist as $key => $item )
{
$thumbnail_id = get_woocommerce_term_meta( $item->term_id, 'thumbnail_id', true );
$image = wp_get_attachment_url( $thumbnail_id );
if ( $image ) {
$image_dis='<img src="' . $image . '" alt="' . $cat->name . '" />';
}
$string .= '<li>'. $item->name . '<br />';
$string .= $image_dis . '<br />';
$string .= '<em>'. $item->description . '</em> </li>';
}
$string .="</ul>";
echo $string;
I need to set a different size of thumb for subcategory and product, is this possible?
I need to show a list of subcategories with thumb 500 x 100 and a list of products with thumbnail 300 x 390.
I have already setting in woocommerce> setting > product > display > Product images but i cannot set a different size for subcategory or product.
lol i develop a clean solution:
function register_size_image() {
add_image_size( 'category_thumb', 1170, 585,true );
add_image_size( 'product_thumb', 750, 940,true );
}
add_action( 'after_setup_theme', 'register_size_image' );
function size_of_category_thumb($u)
{
return array(1170, 585,true);
}
add_filter('subcategory_archive_thumbnail_size', 'size_of_category_thumb');
function size_of_product_thumb($u)
{
return array(750, 940,true);
}
add_filter('single_product_archive_thumbnail_size', 'size_of_product_thumb');
i resolve overriding woocommerce's function, i put this on my functions.php
add_image_size( 'category_thumb', 500, 100,1 );
add_image_size( 'product_thumb', 300, 390,1 );
function woocommerce_subcategory_thumbnail( $category ) {
$small_thumbnail_size = 'category_thumb';
$thumbnail_id = get_woocommerce_term_meta( $category->term_id, 'thumbnail_id', true );
if ( $thumbnail_id ) {
$image = wp_get_attachment_image_src( $thumbnail_id, $small_thumbnail_size );
$image = $image[0];
$image_srcset = function_exists( 'wp_get_attachment_image_srcset' ) ? wp_get_attachment_image_srcset( $thumbnail_id, $small_thumbnail_size ) : false;
$image_sizes = function_exists( 'wp_get_attachment_image_sizes' ) ? wp_get_attachment_image_sizes( $thumbnail_id, $small_thumbnail_size ) : false;
} else {
$image = wc_placeholder_img_src();
$image_srcset = $image_sizes = false;
}
if ( $image ) {
// Prevent esc_url from breaking spaces in urls for image embeds
// Ref: https://core.trac.wordpress.org/ticket/23605
$image = str_replace( ' ', '%20', $image );
// Add responsive image markup if available
if ( $image_srcset && $image_sizes ) {
echo '<img src="' . esc_url( $image ) . '" alt="' . esc_attr( $category->name ) . '" width="' . esc_attr( $dimensions['width'] ) . '" height="' . esc_attr( $dimensions['height'] ) . '" srcset="' . esc_attr( $image_srcset ) . '" sizes="' . esc_attr( $image_sizes ) . '" />';
} else {
echo '<img src="' . esc_url( $image ) . '" alt="' . esc_attr( $category->name ) . '" width="' . esc_attr( $dimensions['width'] ) . '" height="' . esc_attr( $dimensions['height'] ) . '" />';
}
}
}
function woocommerce_get_product_thumbnail( $size = 'shop_catalog', $deprecated1 = 0, $deprecated2 = 0 )
{
global $product;
// $image_size = apply_filters( 'single_product_archive_thumbnail_size', $size );
return $product ? $product->get_image( 'product_thumb' ) : '';
}
it works!
Yes, That is quite possible. Follow these steps -
Add new image size. To do that add following code to your theme's functions.php
add_image_size( 'your-custom-size', 500, 100 );
// You can add multiple image sizes by repeating this line with different values (as per you need)
After this step upload images.
If it is overhead for you to upload images again, you can use this plugin
This will create thumbnails with all your specified sizes.
Now in your theme, whereever you are showing images with function like -
the_post_thumbnail( 'your-custom-size' ) or wp_get_attachment_image( 42, 'your-custom-size' ), pass your image size name as param.
function yourFunctionName()
{
return array(1140, 300,true);
}
add_filter('subcategory_archive_thumbnail_size', 'yourFunctionName');
Works for me
I have some problem in WooCommerce Admin Order menu. I want to add some content in the column but I don't know where I can make it.
This is some example screenshoot about my woocommerce admin order view :
I want to add phone number bellow email address in Order column.
Please help me to do that.
Thank you.
I've had to do this once, i've followed this tutorial :
https://code.tutsplus.com/articles/add-a-custom-column-in-posts-and-custom-post-types-admin-screen--wp-24934
add_action('manage_shop_order_posts_custom_column', 'match_order_woocommerce_custom_order_columns', 2);
function match_order_woocommerce_custom_order_columns( $column ) {
remove_action('manage_shop_order_posts_custom_column', 'woocommerce_custom_order_columns', 2);
global $post, $woocommerce;
$order = new WC_Order( $post->ID );
switch ($column) {
case "order_title" :
if ($order->user_id) $user_info = get_userdata($order->user_id);
if (isset($user_info) && $user_info) :
$user = '<a href="user-edit.php?user_id=' . esc_attr( $user_info->ID ) . '">';
if ($user_info->first_name || $user_info->last_name) $user .= $user_info->first_name.' '.$user_info->last_name;
else $user .= esc_html( $user_info->display_name );
$user .= '</a>';
else :
$user = __('Guest', 'woocommerce');
endif;
echo '<strong>'.sprintf( __('Order %s', 'woocommerce'), $order->get_order_number() ).'</strong> ' . __('made by', 'woocommerce') . ' ' . $user;
if ($order->billing_email) :
echo '<small class="meta">'.__('Email:', 'woocommerce') . ' ' . ''.esc_html( $order->billing_email ).'</small>';
endif;
if ($order->billing_phone) :
echo '<small class="meta">'.__('Tel:', 'woocommerce') . ' ' . esc_html( $order->billing_phone ) . '</small>';
endif;
break;
}
}
Please try this snippet in your active theme's functions.php
I want to remove the nofollow code from the latest posts displayed in the sidebar. I found that the code which adds rel=nofollow tag to latest post is located here
theme folder/example theme/lib/activity/plugin.php.
Here is the exact code:
private function get_latest_posts( $post_count ) {
// Get the latest posts
$latest_posts = get_posts(
array(
'numberposts' => $post_count,
'order' => 'desc',
'orderby' => 'date'
)
);
// Create the markup for the listing
$html = '<div class="tab-pane" id="recent">';
$html .= '<ul class="latest-posts">';
if( count( $latest_posts ) > 0 ) {
foreach( $latest_posts as $post ) {
$html .= '<li class="clearfix">';
// Add the small featured image
if( has_post_thumbnail( $post->ID ) ) {
$html .= '<a class="latest-post-tn fademe" href="' . get_permalink( $post->ID ) . '" rel="nofollow">';
$html .= get_the_post_thumbnail( $post->ID, array( 50, 50 ) );
$html .= '</a>';
} // end if
$html .='<div class="latest-meta">';
// Add the title
$html .= '<a href="' . get_permalink( $post->ID ) . '" rel="nofollow">';
$html .= get_the_title( $post->ID );
$html .= '</a>';
// Add date posted
// If there's no title, then we need to turn the date into the link
if( strlen( get_the_title( $post->ID ) ) == 0 ) {
$html .= '<a href="' . get_permalink( $post->ID ) . '" rel="nofollow">';
} // end if
$html .= '<span class="latest-date">';
$html .= get_the_time( get_option( 'date_format' ), $post->ID );
$html .= '</span>';
// Close the anchor
if(strlen( get_the_title( $post->ID ) ) == 0 ) {
$html .= '</a>';
} // end if
$html .='</div>';
$html .= '</li>';
} // end foreach
} else {
$html .= '<li>';
$html .= '<p class="no-posts">' . __( "You have no recent posts.", 'standard' ) . '</p>';
$html .= '</li>';
} // end if/else
$html .= '</ul>';
$html .= '</div>';
return $html;
} // end get_latest_posts
Now please tell me how to remove the nofollow tag from this code using the child theme?
Since you have control of the child theme, you can wrap the call to display the widget zone for that widget with something that grabs the output, performs a regex search/replace on it, and outputs the result. I wrote a blog post about that recently:
Filtering the output of WordPress widgets
The basics are that you have a function that replaces dynamic_sidebar() with your own function, like this:
function theme_dynamic_sidebar($index = 1) {
// capture output from the widgets
ob_start();
$result = dynamic_sidebar($index);
$out = ob_get_clean();
// do regex search/replace on $out
echo $out;
return $result;
}
Seems that you are out of luck.
That's a private function and no filter hooks are offered by the theme author.
You may try to override the include('path/to/plugin.php'); and include your own modified version.