I've added the "WooCommerce Products Filter" plugin on my ebook store wordpress theme. I've prepared a custom page for my shop page and built the sidebar with the filter with the WP Bakery Page Builder plugin. Everything works but the images of the books and the columns. Take a look to the URL: https://www.editorialufv.es/prova-maledetta/ Here a screenshot of the WP editor Screenshot

As you can see I've used the shortcode of the plugin. All the shortcodes are here: https://www.woocommerce-filter.com/shortcode/woof_products/

Why the image is so enormous and why the books aren't on columns? Any clue. I'm completely lost. Here the file page.php that is using my theme in this shop custom page:

<?php get_header(); ?>

<div class="content">
    <!-- Sidebar With Content Section -->
    $ebookstore_content_raw = json_decode( ebookstore_decode_stopbackslashes( get_post_meta( get_the_ID(), 'ebookstore_content', true ) ), true );

    $ebookstore_content_raw = ( empty( $ebookstore_content_raw ) ) ? array() : $ebookstore_content_raw;

    $ebookstore_theme_option = get_option( 'ebookstore_admin_option',array() );

    if (isset( $ebookstore_theme_option['book-search-style'] ) && $ebookstore_theme_option['book-search-style'] == 0) {

    } else {

        echo '<div class="margin-minus-50-top">';

        echo ebookstore_get_search_form_result();

        echo '</div>';


    if (!empty( $ebookstore_content_raw )) {

        echo '<div class="vc-wrapper container">';

        while (have_posts()) {

            if (has_shortcode( get_the_content(), 'vc_row' )) {

                echo ebookstore_content_filter( get_the_content(), true );



        echo '</div>';

        echo '<div class="pagebuilder-wrapper">';

        ebookstore_show_page_builder( $ebookstore_content_raw );

        echo '</div>';

    } else {

        echo '<div class="container">';

        $default['show-title'] = 'enable';

        $default['show-content'] = 'enable';

        echo ebookstore_get_default_content_item( $default );

        echo '</div>';

    } ?>

</div><!-- content -->

<?php get_footer(); ?>

1 Answer 1


you are missing any form off styling for your columns woof does not add column styling it relies on your theme woof documentation

and in your css you have no stylings for columnscss

  • This sounds like a bad news. Is there a way to fix this?
    – Stefano
    Dec 21, 2017 at 21:31
  • .product { width: 25%; float: left; padding: 0px 18px; height: 430px; } this css will show your products in a grid Dec 21, 2017 at 21:41
  • this is not the cleanest answer UI wise due to you have some products that have very long titles Dec 21, 2017 at 21:43
  • 1
    It works!!!! Thank you very much Brad! It works perfectly. I've lost so many hours looking for an answer. You've made me really happy. Thanx!
    – Stefano
    Dec 21, 2017 at 21:46
  • no problem, im glad this helped Dec 21, 2017 at 21:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.