how to change woocommerce shop page details? - wordpress

I've used a snippet to display the weight of jewellery in shop page of woocommerce. I've inserted the snippet in function.php file. But its displaying the weight below add to cart button. It must be displayed above the button.
here is the snippet
add_action( 'woocommerce_after_shop_loop_item', 'bbloomer_show_product_dimensions_loop', 20 );
function bbloomer_show_product_dimensions_loop() {
global $product;
$dimensions = $product->get_dimensions();
if ( ! empty( $dimensions ) ) {
echo '<div class="dimensions">';
echo '<br><b>Weight:</b> ' . $product->get_weight() . get_option( 'woocommerce_weight_unit' );
echo '</div>';
}
}
the weight must be printed above the add to cart button, what i've to change here.

add_filter( 'woocommerce_loop_add_to_cart_link', 'bbloomer_show_product_dimensions_loop', 10, 2 );
function bbloomer_show_product_dimensions_loop( $html, $product ) {
$weight = '';
$dimensions = $product->get_dimensions();
if ( ! empty( $dimensions ) ) {
$weight .= '<div class="dimensions">';
$weight .= '<br><b>Weight:</b> ' . $product->get_weight() .
esc_html( get_option( 'woocommerce_weight_unit' ) );
$weight .= '</div>';
}
return $weight . $html;
}
You have to use the filter tag woocommerce_loop_add_to_cart_link and prepend your weight component HTML like this. Since it's filter hook no need to echo the output just return the output HTML the tag woocommerce_loop_add_to_cart_link will handle that.
Based on my own blog tutorial: How To Add Quantity Input In Shop Page
Visit source code if you want to learn how this filter woocommerce_loop_add_to_cart_link works internally.

You can take the help of flex css for example:
.itemxyz{display: flex;flex-direction: column;}
.itemxyz .desc{order: 1;}
.itemxyz .price{order: 2;}
.itemxyz .btn{ order: 4;}
.itemxyz .weight{ order: 3;}

Related

How to display some attributes directly on (single) shop page/product page in Woocommerce?

I'm trying to display some attributes directly on the shop page. The attributes are all collected in the database. To make it easier to show, I made a screenshot so you can get a better idea. the thing is now, with which code I can do that. the attributes, there are always 4, should be display centered under the block with the pictures and the buy button. I would be very happy if we could find a way to do this. Thanks very much
Ok, i've found some code here on stackoverflow... the good news are, i get the results/attributes i want, the bad news are, on the wrong page (shop page instead of shop page single).
this is the code:
add_action('woocommerce_after_shop_loop_item_title', 'display_custom_product_attributes_on_loop', 5 );
function display_custom_product_attributes_on_loop() {
global $product;
// Settings: Here below set your product attribute label names
$attributes_names = array('alter', 'bausteine', 'publicationdate', 'sku');
$attributes_data = array(); // Initializing
// Loop through product attribute settings array
foreach ( $attributes_names as $attribute_name ) {
if ( $value = $product->get_attribute($attribute_name) ) {
$attributes_data[] = $attribute_name . ': ' . $value;
}
}
if ( ! empty($attributes_data) ) {
echo '<div class="items" style="color: red;"><p>' . implode( '<br>', $attributes_data ) . '</p></div>';
}
}
this code shows me the attributes and the results on the shoppage, but i need it on the single shop page/product page.
Thank you!
Change the hook name and then check
add_action('woocommerce_single_product_summary', 'display_custom_product_attributes_on_loop', 5 );
function display_custom_product_attributes_on_loop() {
global $product;
// Settings: Here below set your product attribute label names
$attributes_names = array('alter', 'bausteine', 'publicationdate', 'sku');
$attributes_data = array(); // Initializing
// Loop through product attribute settings array
foreach ( $attributes_names as $attribute_name ) {
if ( $value = $product->get_attribute($attribute_name) ) {
$attributes_data[] = $attribute_name . ': ' . $value;
}
}
if ( ! empty($attributes_data) ) {
echo '<div class="items" style="color: red;"><p>' . implode( '<br>', $attributes_data ) . '</p></div>';
}
}

WooCommerce Shop page thumbnail wrap

I am looking at this: https://www.businessbloomer.com/woocommerce-visual-hook-guide-archiveshopcat-page/
I would like to wrap thumb in shop page into another div.
If I use following code I could achieve something, but the problem is many themes remove or dont use woocommerce_before_shop_loop_item_title and use some different code and I cannot effectively do my action.
remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10 );
add_action( 'woocommerce_before_shop_loop_item_title', 'my_woocommerce_before_shop_loop_item_title', 10 );
function my_woocommerce_before_shop_loop_item_title() {
global $product;
$post_id = $product->get_id();
$html = woocommerce_get_product_thumbnail('woocommerce_thumbnail');
echo '<div class="my">' . $html . '</div>';
}
Is there action or hook that processes product thumbnail to which I could do my own action? Regardless of what is happening before and after that?
Please try to implement in this way.
//replace the functionprefix with your functions prefix
function functionprefix_wrap_loop_product_image() {
if ( ! class_exists( 'WooCommerce' ) ) return; //* exit if WooCommerce not active
add_action( 'woocommerce_before_shop_loop_item_title' , 'functionprefix_product_loop_image_wrapper_open', 10 );
add_action( 'woocommerce_shop_loop_item_title' , 'functionprefix_product_loop_image_wrapper_close', 10 );
}
add_action( 'woocommerce_before_shop_loop' , 'functionprefix_wrap_loop_product_image', 3 );
//replace the functionprefix with your functions prefix
function functionprefix_product_loop_image_wrapper_open() {
echo '<div class="image-wraper">';
}
function functionprefix_product_loop_image_wrapper_close() {
echo '</div>';
}

Edit my Add to cart button for variable product

I have three versions of this code in my site to product 3 buttons ( 1x quantity, 3x quantity and 10x quantity). My products are variable. The code didn't work until I removed this line if( ! $product->is_type('simple') ) return; . With this line removed, should it be replaced with something else for variable products to ensure the code is complete properly?
add_action( 'woocommerce_after_add_to_cart_button', 'additional_simple_add_to_cart_10', 20 );
function additional_simple_add_to_cart_10() {
global $product;
// Only for simple product type
if( ! $product->is_type('simple') ) return; // Removed this line
$href = '?add-to-cart=' . esc_attr( $product->get_id() ) . '&quantity=10';
$class = 'ingle_add_to_cart_button-10 button alt';
$style = 'display: inline-block; margin-top: 12px;';
$button_text = __( "10 Tickets", "woocommerce" );
// Output
echo '<br><a rel="no-follow" href="'.$href.'" class="'.$class.'" style="'.$style.'">'.$button_text.'</a>';
}
// Redirect to checkout after add to basket
add_filter( 'woocommerce_add_to_cart_redirect', 'misha_skip_cart_redirect_checkout' );
function misha_skip_cart_redirect_checkout( $url ) {
return wc_get_checkout_url();
}

How-to get a menu label via $post-> or $page->ID

Entirely Revised Please Reread
Hello,
The theme I am using displays the page's title as opposed to it's menu label in the breadcrumbs. I am trying to get the breadcrumbs to instead display the associated menu label if it is available and if not then default to the page_title.
I have come up with some code that I think is close. Line 4/// $menu_items = wp_get_nav_menu_items( $slug ); returns null and it should return the nav item that contains $slug of the current post. Obviously, there is something I do not understand.
What I am attempting to do is get the slug of the current post, then using the slug get the nav item post. Then extract the title of the nav item and use that in place of the page title in the breadcrumbs. If the page was not in the nav system then it should default to the page title, as might be the case for a ppc campaign landing page.
if ( is_page() && !$post->post_parent ) {
$title = null;
$slug = mpactMEDIA_get_the_slug( get_the_ID() );
$menu_items = wp_get_nav_menu_items( $slug );
//var_dump((array)$menu_items);
foreach ( (array)$menu_items as $key => $menu_item ) {
$title = $menu_item->post_title;
}
if ( $title ) { echo $delimiter . ' ' . $before . $title . $after; }
else { echo $delimiter . ' ' . $before . get_the_title() . $after; }
}
I'm my functions.php file I have the following function
function mpactMEDIA_get_the_slug( $id=null ){
if( empty($id) ) global $post;
if( empty($post) ) return '';
$id = $post->ID;
endif;
$slug = basename( get_permalink($id) );
return $slug;
}
Thank you in advance,
Tim
I read the question a few times, I got here searching for an answer, ended up making my own.
function get_menu_label_by_post_id($post_id, $menu) {
$menu_title = '';
$nav = wp_get_nav_menu_items($menu);
foreach ( $nav as $item ) {
if ( $post_id == $item->object_id ) {
$menu_title = $item->post_title;
break;
}
}
return ($menu_title !== '') ? $menu_title : get_the_title($post_id);
}
Example usage:
echo get_menu_label_by_post_id($post->ID, 'Primary Nav');
This will return what the menu label is if it finds it, otherwise just the title of the post ID.
Check the documentation for wp_get_nav_menu_items. It doesn't take a page slug as a parameter at all.
If you want to list child pages of a given page, use wp_list_pages and pass a child_of parameter to it.
Also, as a side note, if you know the $post and want the slug, it's just $post->post_name

Wordpress remove shortcode and save for use elsewhere

Trying to remove the gallery shortcode from the post content and save in a variable for use elsewhere in the template. The new Wordpress gallery tool is great for selecting which images they want and assigning captions, hoping to use this to create the gallery, but then pull it out of the content on the front-end.
So this little snipped works just fine for removing the gallery and reapplying formatting... however I want to save that gallery shortcode.
$content = strip_shortcodes( get_the_content() );
$content = apply_filters('the_content', $content);
echo $content;
Hoping to save the shortcode so it can be parsed into an array and used to recreate a custom gallery setup on the front-end. An example of this shortcode I'm trying to save is...
[gallery ids="1079,1073,1074,1075,1078"]
Any suggestions would be greatly appreciated.
Function to grab First Gallery shortcode from post content:
// Return first gallery shortcode
function get_shortcode_gallery ( $post = 0 ) {
if ( $post = get_post($post) ) {
$post_gallery = get_post_gallery($post, false);
if ( ! empty($post_gallery) ) {
$shortcode = "[gallery";
foreach ( $post_gallery as $att => $val ) {
if ( $att !== 'src') {
if ( $att === 'size') $val = "full"; // Set custom attribute value
$shortcode .= " ". $att .'="'. $val .'"'; // Add attribute name and value ( attribute="value")
}
}
$shortcode .= "]";
return $shortcode;
}
}
}
// Example of how to use:
echo do_shortcode( get_shortcode_gallery() );
Function to delete First gallery shortcode from Post content:
// Deletes first gallery shortcode and returns content
function strip_shortcode_gallery( $content ) {
preg_match_all( '/'. get_shortcode_regex() .'/s', $content, $matches, PREG_SET_ORDER );
if ( ! empty( $matches ) ) {
foreach ( $matches as $shortcode ) {
if ( 'gallery' === $shortcode[2] ) {
$pos = strpos( $content, $shortcode[0] );
if ($pos !== false)
return substr_replace( $content, '', $pos, strlen($shortcode[0]) );
}
}
}
return $content;
}
// Example of how to use:
$content = strip_shortcode_gallery( get_the_content() ); // Delete first gallery shortcode from post content
$content = str_replace( ']]>', ']]>', apply_filters( 'the_content', $content ) ); // Apply filter to achieve the same output that the_content() returns
echo $content;
just use the get_shortcode_regex():
<?php
$pattern = get_shortcode_regex();
preg_match_all('/'.$pattern.'/s', $post->post_content, $shortcodes);
?>
that will return an array of all the shortcodes in your content, which you can then output wherever you feel, like so:
<?php
echo do_shortcode($shortcodes[0][1]);
?>
similarly, you could use the array entries to check for shortcodes in your content and remove them with str_replace():
<?php
$content = $post->post_content;
$content = str_replace($shortcodes[0][1],'',$content);
?>
Something like $gallery = do_shortcode('[gallery]'); might work.

Resources