child theme woocommerce-functions not getting priority

[choskins-godaddy]

I want to modify a function in the woocommerce-functions.php file so in my child theme I made a /woocommerce/woocommerce-functions.php and put the override there but it isn't taking affect. I changed mt-2 to mt-5. Since this did not work for me, I modified the bootscore parent theme but I know I'll forget to change it back next time I upgrade.

Help please?

This is what my woocommerce-functions.php looks like:

<?php

/**
 * Woocommerce functions and definitions
 *
 * @package Bootscore
 */

// WooCommerce Breadcrumb
if (!function_exists('bs_woocommerce_breadcrumbs')) :
  add_filter('woocommerce_breadcrumb_defaults', 'bs_woocommerce_breadcrumbs');
  function bs_woocommerce_breadcrumbs() {
    return array(
      'delimiter'   => ' &nbsp;&#47;&nbsp; ',
      'wrap_before' => '<nav class="breadcrumb mb-4 mt-5 bg-light py-2 px-3 small rounded" itemprop="breadcrumb">',
      'wrap_after'  => '</nav>',
      'before'      => '',
      'after'       => '',
      'home'        => _x('Home', 'breadcrumb', 'woocommerce'),
    );
  }
endif;
// WooCommerce Breadcrumb End```

[crftwrk]

woocommerce-functions.php isn‘t a template file and you cannot override it that way. All functions there are pluggable and you can override them by copy the function between the if… and endif to your child‘s functions.php. Please check here how to edit functions https://bootscore.me/documentation/functions/.

[choskins-godaddy]

Got it. Thanks.

[crftwrk]

👍 You're welcome.

BTW I see that you just want to change the breadcrumb divider, correct? In this case you can simply change divider by CSS instead overriding the function:

:root {
  --bs-breadcrumb-divider: '»';
}

[choskins-godaddy]

Actually, no, I didn't want to change the divider but instead, I wanted to increase the margin so I could actually see the breadcrumbs. I guess my top menu is bigger than the default.

Would the ":root..." css you wrote above go into my child theme's style.css ?

[choskins-godaddy]

-----------------NEVER MIND. IT STARTED WORKING!! MAYBE THE PAGE WAS CACHED?--------------------

OK, since I upgraded to 5.2.3.1, this problem has cropped up again. That tells me I forgot to "undo" my changes to the parent (bootscore-main).

Let me quickly restate the problem: I need the breadcrumb section to have a healthy amount of space at the top because my header is taller than the default. Instead of mt-2, I need mt-5.

Here's what I have inside of my /bootcommerce-child/functions.php (no longer works):

add_filter('woocommerce_breadcrumb_defaults', 'bs_woocommerce_breadcrumbs');
function bs_woocommerce_breadcrumbs() {
  return array(
    'delimiter'   => '',
    'wrap_before' => "<nav aria-label='breadcrumb' class='wc-breadcrumb breadcrumb-scroller mb-4 mt-5 py-2 px-3 bg-light rounded'>
    <ol class='breadcrumb mb-0'>",
    'wrap_after'  => '</ol>
    </nav>',
    'before'      => '<li class="breadcrumb-item">',
    'after'       => '</li>',
    'home'        => _x('Home', 'breadcrumb', 'woocommerce'),
    );
  }

Inside of /bootscore-main/woocommerce/woocommerce-functions.php, we have almost the same thing except we have mt-2 instead of mt-5:

// WooCommerce Breadcrumb
if (!function_exists('bs_woocommerce_breadcrumbs')) :
  add_filter('woocommerce_breadcrumb_defaults', 'bs_woocommerce_breadcrumbs');
  function bs_woocommerce_breadcrumbs() {
    return array(
      'delimiter'   => '',
      'wrap_before' => "<nav aria-label='breadcrumb' class='wc-breadcrumb breadcrumb-scroller mb-4 mt-2 py-2 px-3 bg-light rounded'>
      <ol class='breadcrumb mb-0'>",
      'wrap_after'  => '</ol>
      </nav>',
      'before'      => '<li class="breadcrumb-item">',
      'after'       => '</li>',
      'home'        => _x('Home', 'breadcrumb', 'woocommerce'),
    );
  }
endif;
// WooCommerce Breadcrumb End

Now, here is something interesting I see in /bootscore-main/functions.php:

// Breadcrumb
if (!function_exists('the_breadcrumb')) :
function the_breadcrumb() {

  if (!is_home()) {
    echo '<nav aria-label="breadcrumb" class="breadcrumb-scroller mb-4 mt-2 py-2 px-3 bg-light rounded">';
    echo '<ol class="breadcrumb mb-0">';
    echo '<li class="breadcrumb-item"><a href="' . home_url() . '">' . '<i class="fa-solid fa-house"></i>' . '</a></li>';
    // display parent category names with links
    if (is_category() || is_single()) {
      $cat_IDs = wp_get_post_categories(get_the_ID());
      foreach ($cat_IDs as $cat_ID) {
        $cat = get_category($cat_ID);
        echo '<li class="breadcrumb-item"><a href="' . get_term_link($cat->term_id) . '">' . $cat->name . '</a></li>';
      }
    }
    // display current page name
    if (is_page() || is_single()) {
      echo '<li class="breadcrumb-item active" aria-current="page">' . get_the_title() . '</li>';
    }
    echo '</ol>';
    echo '</nav>';
    echo '</nav>';
  }
}
add_filter('breadcrumbs', 'breadcrumbs');
endif;
// Breadcrumb END

I copied that whole section above into my functions.php and made the mt-2 into mt-5. It didn't work!

What to do now?

[crftwrk]

This are two different breadcrumbs. The one in functions.php is the breadcrumb for posts. The one in woocommerce-functions.php is the breadcrumb for Woo shop pages.

BTW to override them correct do not copy the complete function. According to https://bootscore.me/documentation/functions/ copy only code between the if (!function_exists('the_breadcrumb')) : and endif; wrapper.

[finalwebsites]

Nice to know, there are two different breadcrumbs :)
Since I want to remove them entirely I use this snippet in my functions.php:
function bs_woocommerce_breadcrumbs() { return array(); } add_filter('woocommerce_breadcrumb_defaults', 'bs_woocommerce_breadcrumbs');
But doing this only the markup disappears. How get rid of home, shop, product name etc (without changing all the theme files)
Thanks!

[crftwrk]

For the default post breadcrumb, you can use the empty function to remove the breadcrumb:

// Empty function to remove the breadcrumb
function the_breadcrumb() {

}

We use a filter to add classes to the WooCommerce breadcrumb and it's possible to remove the filter. But this does not remove the WC breadcrumb itself. Something like this seems not to work:

// Remove WooCommerce breadcrumbs
add_action('init', 'remove_woocommerce_breadcrumbs');

function remove_woocommerce_breadcrumbs() {
  remove_action('woocommerce_before_main_content', 'woocommerce_breadcrumb', 20);
}

Not the best way, but you can simply remove <?php woocommerce_breadcrumb(); ?> in woocommerce.php or add a single line of CSS:

.wc-breadcrumb {
  display: none;
}

[finalwebsites]

Right the action hook suggested by WooCommerce doesn't work because the woo breadcrums are included via the theme file and not via a hook. You could start adding your own hooks, for example before and after the content?

For now I fixed to overwrite the breadcrumbs template from WooCommerce. This is not the best way to do it, but I don't expect they will change it within the next time (so no version warnings after Woo updates). I will follow your suggestion at the moment that I need to modify the woocommerce.php file for another reason.

Thanks Bastian!