I added the woocommerce Cart Widget to my sidebar and due to some customization of the theme and woocommerce behavior I added this line of code to my themes functions.php:
remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20 );
When this line is active no cart contents are shown, just the widget title. When I comment out this line the items in the cart are shown on the single products page and on the shop page. See markup:
<div id="secondary" class="widget-area" role="complementary">
<aside id="woocommerce_widget_cart-12" class="widget woocommerce widget_shopping_cart">
<h3 class="widget-title">Winkelmand</h3>
<div class="widget_shopping_cart_content">
<ul class="cart_list product_list_widget ">
<li>
<a href="http://localhost/?product=flying-ninja">
<img width="600" height="600" src="//localhost/wp-content/uploads/2013/06/poster_2_up-600x600.jpg" class="attachment-shop_thumbnail wp-post-image" alt="poster_2_up">Flying Ninja </a>
<span class="quantity">1 × <span class="amount">€12,00</span></span>
</li>
<li>
<a href="http://localhost/?product=patient-ninja">
<img width="600" height="600" src="//localhost/wp-content/uploads/2013/06/hoodie_3_front-600x600.jpg" class="attachment-shop_thumbnail wp-post-image" alt="hoodie_3_front">Patient Ninja </a>
<span class="quantity">1 × <span class="amount">€35,00</span></span>
</li>
<li>
<a href="http://localhost/?product=photo-3">
<img width="399" height="600" src="//localhost/wp-content/uploads/2014/12/DSC07870-399x600.jpg" class="attachment-shop_thumbnail wp-post-image" alt="SONY DSC">Photo 3 </a>
<span class="quantity">1 × <span class="amount">€15,00</span></span>
</li>
</ul><!-- end product list -->
<p class="total"><strong>Subtotaal:</strong> <span class="amount">€62,00</span></p>
<p class="buttons">
<a href="http://localhost/?page_id=334" class="button wc-forward">Winkelmand bekijken</a>
<a href="http://localhost/?page_id=335" class="button checkout wc-forward">Afrekenen</a>
</p>
</div>
</aside>
</div>
As you can see all thre products are shown and the buttons appears as well. However they are not shown on all the other pages. On those pages only the widget title appears. on those pages the markup looks like this:
<div id="secondary" class="widget-area" role="complementary">
<aside id="woocommerce_widget_cart-12" class="widget woocommerce widget_shopping_cart">
<h3 class="widget-title">Winkelmand</h3>
<div class="widget_shopping_cart_content">
</div>
</aside>
</div>
The questions I have are:
Why is the remove_action line of code interfering with the contents of the cart widget?
Why is the div class="widget_shopping_cart_content">empty on the other pages, no matter if the remove_action line is commented out or not.
I figured out that it has something to do with my customization. When I use the standard twentytwelve theme (on wicht my child theme is build) it works fine.
EDIT
Of course I'm searching myself to and was able to narrow it further down. The cause is in this function in my theme's function.php but I don't know what is wrong with it and what I should do about it.
function twentytwelve_child_masonry() {
if (!is_admin()) {
wp_enqueue_script('masonry');
add_action('wp_footer', 'twentytwelve_child_add_masonry');
function twentytwelve_child_add_masonry() { ?>
<script>
(function( $ ) {
"use strict";
$(function() {
//set the container that Masonry will be inside of in a var
var container = document.querySelector('.products');
//create empty var msnry
var msnry;
// initialize Masonry after all images have loaded
imagesLoaded( container, function() {
msnry = new Masonry( container, {
itemSelector: '.product',
isAnimated: true
});
});
});
}(jQuery));
</script>
<?php
}
}
}
add_action('init', 'twentytwelve_child_masonry');
I'm pulling my hair out..... I'm trying for a week now to solve this problem. Please help!?
EDIT 2
I got this message when I try to debug the project:
TypeError: 'null' is not an object (evaluating 'a.length') (15:45:27:306 | error, javascript)
at f (http://localhost/wp-includes/js/masonry.min.js?ver=3.1.2:1:28901)
at g (http://localhost/wp-includes/js/masonry.min.js?ver=3.1.2:1:29105)
at g (http://localhost/wp-includes/js/masonry.min.js?ver=3.1.2:1:29031)
at (anonymous function) (http://localhost/?product=happy-ninja:262:40)
at j (http://localhost/wp-includes/js/jquery/jquery.js?ver=1.11.1:2:27248)
at fireWith (http://localhost/wp-includes/js/jquery/jquery.js?ver=1.11.1:2:28057)
at ready (http://localhost/wp-includes/js/jquery/jquery.js?ver=1.11.1:2:29901)
at J (http://localhost/wp-includes/js/jquery/jquery.js?ver=1.11.1:2:30261)
>
