To display the product category in WooCommerce breadcrumbs, add the following code to your child theme’s functions.php file:
/**
* Show product categories in WooCommerce breadcrumbs
*/
// Get breadcrumbs on product pages that read: Home > Shop > Product category > Product Name
add_filter( 'woo_breadcrumbs_trail', 'woo_custom_breadcrumbs_trail_add_product_categories', 20 );
function woo_custom_breadcrumbs_trail_add_product_categories ( $trail ) {
if ( ( get_post_type() == 'product' ) && is_singular() ) {
global $post;
$taxonomy = 'product_cat';
$terms = get_the_terms( $post->ID, $taxonomy );
$links = array();
if ( $terms && ! is_wp_error( $terms ) ) {
$count = 0;
foreach ( $terms as $c ) {
$count++;
if ( $count > 1 ) { continue; }
$parents = woo_get_term_parents( $c->term_id, $taxonomy, true, ', ', $c->name, array() );
if ( $parents != '' && ! is_wp_error( $parents ) ) {
$parents_arr = explode( ', ', $parents );
foreach ( $parents_arr as $p ) {
if ( $p != '' ) { $links[] = $p; }
}
}
}
// Add the trail back on to the end.
// $links[] = $trail['trail_end'];
$trail_end = get_the_title($post->ID);
// Add the new links, and the original trail's end, back into the trail.
array_splice( $trail, 2, count( $trail ) - 1, $links );
$trail['trail_end'] = $trail_end;
}
}
return $trail;
}
/**
* Retrieve term parents with separator.
*
* @param int $id Term ID.
* @param string $taxonomy.
* @param bool $link Optional, default is false. Whether to format with link.
* @param string $separator Optional, default is '/'. How to separate terms.
* @param bool $nicename Optional, default is false. Whether to use nice name for display.
* @param array $visited Optional. Already linked to terms to prevent duplicates.
* @return string
*/
if ( ! function_exists( 'woo_get_term_parents' ) ) {
function woo_get_term_parents( $id, $taxonomy, $link = false, $separator = '/', $nicename = false, $visited = array() ) {
$chain = '';
$parent = &get_term( $id, $taxonomy );
if ( is_wp_error( $parent ) )
return $parent;
if ( $nicename ) {
$name = $parent->slug;
} else {
$name = $parent->name;
}
if ( $parent->parent && ( $parent->parent != $parent->term_id ) && !in_array( $parent->parent, $visited ) ) {
$visited[] = $parent->parent;
$chain .= woo_get_term_parents( $parent->parent, $taxonomy, $link, $separator, $nicename, $visited );
}
if ( $link ) {
$chain .= '<a href="' . get_term_link( $parent, $taxonomy ) . '" title="' . esc_attr( sprintf( __( "View all posts in %s" ), $parent->name ) ) . '">'.$parent->name.'</a>' . $separator;
} else {
$chain .= $name.$separator;
}
return $chain;
}
}
For more on breadcrumbs, see Adding Breadcrumbs to WordPress.
The following code displays the link to the “My Account” page on WooCommerce sites. If the user is not logged in, the link will show the text “Login / Register”, otherwise it will show “My Account”.
<?php if ( is_user_logged_in() ) { ?>
<a href="<?php echo get_permalink( get_option('woocommerce_myaccount_page_id') ); ?>" title="<?php _e('My Account','woothemes'); ?>"><?php _e('My Account','woothemes'); ?></a>
<?php }
else { ?>
<a href="<?php echo get_permalink( get_option('woocommerce_myaccount_page_id') ); ?>" title="<?php _e('Login / Register','woothemes'); ?>"><?php _e('Login / Register','woothemes'); ?></a>
<?php } ?>
More information about the My Account page in the post Customizing the My Account page in WooCommerce.
This is a simple example of a basic WooCommerce products loop. If you want to learn more, here is a post about the right way to retrieve WooCommerce products in your theme.
<ul class="products">
<?php
$args = array(
'post_type' => 'product',
'posts_per_page' => 12
);
$loop = new WP_Query( $args );
if ( $loop->have_posts() ) {
while ( $loop->have_posts() ) : $loop->the_post();
wc_get_template_part( 'content', 'product' );
endwhile;
} else {
echo __( 'No products found' );
}
wp_reset_postdata();
?>
</ul><!--/.products-->
When you upload an image using WordPress media and then insert it into the content editor, the image is attached with width and height attributes. These attributes are generally desirable because they help the browser reserve the right space for the image during layout.
But if you want to prevent WordPress from adding these width and height attributes, add the following code to your theme’s functions.php file:
add_filter( 'post_thumbnail_html', 'remove_width_attribute', 10 );
add_filter( 'image_send_to_editor', 'remove_width_attribute', 10 );
function remove_width_attribute( $html ) {
$html = preg_replace( '/(width|height)="d*"s/', "", $html );
return $html;
}
Here is a simple way to redirect a user to a specific page when they remove a WooCommerce coupon from the cart page. Useful for example if you want to show content to users who remove a coupon that was automatically added to the cart. Here is how:
/*
* Redirects user to a specific page upon coupon removal.
*/
function action_woocommerce_removed_coupon( $coupon_code ) {
// Redirection...
wp_redirect( $url ); // Replace $url by your page URL.
exit;
};
// add the action
add_action( 'woocommerce_removed_coupon', 'action_woocommerce_removed_coupon', 10, 1 );
Here is a quick way to disable the Lightbox in WooCommerce 3.0 and above. Add the following code to your functions.php file:
add_action( 'after_setup_theme', 'remove_wc_gallery_lightbox', 100 );
function remove_wc_gallery_lightbox() {
remove_theme_support( 'wc-product-gallery-lightbox' );
}
For more WooCommerce customization, see Mastering WooCommerce Hooks.
In some cases you may want to hide the scrollbars that appear on an element while still allowing the user to scroll. You can do this with the following CSS when the class .element is the element you want to hide scrollbars for:
.element::-webkit-scrollbar {
width: 0;
height: 0
}
.element {
scrollbar-width: none;
}
Say you want to hide the scrollbars that appear for the <html> tag. You can do this with the following CSS:
::-webkit-scrollbar {
width: 0;
height: 0
}
html {
scrollbar-width: none;
}
Note: This will not work in Safari and likely not in Internet Explorer.
For more scrollbar customization, see Style Scrollbars Using CSS.
You may want to prevent the display of the WordPress version you are using that appears automatically in the site header. One reason to do this is securing your WordPress site.
If those trying to breach your site know the version you use by looking at the site source, it can guide them and make their job easier because they can easily check for security vulnerabilities in that version.
// remove version info from head and feeds
function sv_complete_version_removal() {
return '';
}
add_filter('the_generator', 'sv_complete_version_removal');
If your site allows registration to your WordPress site, you may want to redirect new registrants to a specific page after successful registration. For example, a page where they can download a file, or one that shows important information you want that user to see after registration:
function sv_registration_redirect(){
return home_url( '/finished/' );
}
add_filter( 'registration_redirect', 'sv_registration_redirect' );
Information about redirects related to this topic can be found in the post 301 redirects and their importance for SEO.
By default, WordPress does not allow users with the Contributor role to upload images to the media library. Of course you could give that user higher-level permissions, but that would allow them to perform additional actions on the site that you may not want them to be able to perform.
The following code lets Contributor users upload images to posts they wrote without any additional permissions:
function sv_allow_contributor_uploads() {
$contributor = get_role('contributor');
$contributor->add_cap('upload_files');
}
if (current_user_can('contributor') && !current_user_can('upload_files'))
add_action('admin_init', 'sv_allow_contributor_uploads');
For more on file uploads in WordPress, see Enable Additional File Type Uploads.
