CODEWITHSUNDEEP
phpwordpresswoocommercethemes
Graphic Detail
Graphic Detail

Reputation: 121

WPBakery Page Builder not rendering shortcodes on WooCommerce Product Category pages

I'm developing quite a complex theme in which I have created custom post types for "Headers" and "Footers" for which I have enabled WPBakery Page Builder (currently using v5.5.5 in Wordpress 4.9.8).

In header.php, the Header post is pulled in and rendered inside the <header> tag, and then in footer.php the Footer post is pulled in and rendered inside the <footer> tag.

It all works perfectly, except when going to a product category page in WooCommerce, then the header and footer just displays as the page builder's raw shortcodes and doesn't parse them. Everything else with WooCommerce is fine; The shop page, individual product pages, the cart, checkout, all fine. It's just the categories for some reason.

Here is the code in header.php:

<?php

$this_page_id = get_queried_object_id();

$gd_page_header = get_post_meta( $this_page_id, 'gd_page_header' );
if(empty($gd_page_header) || count($gd_page_header) == 0 || $gd_page_header[0] == 'default'){
    $header_id = intval(get_option('default_header'));
}else{
    $header_id = $gd_page_header[0];
}
if(!empty($header_id) && $header_id != '' && $header_id != 'none'){
    $post   = get_post( $header_id );
    $transparent_header = get_post_meta( $post->ID, 'transparent_header', true );
    $sticky_header = get_post_meta( $post->ID, 'sticky_header', true );
    $sticky_desktop_only = get_post_meta( $post->ID, 'sticky_desktop_only', true );
    if($sticky_header == '1'){
        $header_class = 'sticky';
        if($sticky_desktop_only == '1'){
            $header_class .= ' dt_only';
        }
    }elseif($transparent_header == '1'){
        $header_class = 'transparent';
    }else{
        $header_class = '';
    }
    $content = $post->post_content;
    $content_css = visual_composer()->parseShortcodesCustomCss( $content );
    if ( ! empty( $content_css ) ) { ?>
         <style type="text/css" data-type="vc_shortcodes-custom-css">
                     <?php echo strip_tags( $content_css ); ?>
         </style>
    <?php } ?>

    <header class="<?php echo($header_class); ?>">
        <div id="container" class="container clearfix">
            <?php echo apply_filters( 'the_content', $content ); ?>
        </div>
    </header>
<?php } ?>

And then here is the code in page.php which WooCommerce is pulling its content into:

<?php get_header(); ?>
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
        <main id="post-<?php the_ID(); ?>">
            <div id="container" class="container clearfix">
                <?php the_content(); ?>
            </div>
        </main>
    <?php endwhile; endif; ?>
<?php get_footer(); ?>

Here is the homepage of my test site: http://sandbox.graphicdetail.co.nz/

As you can see, everything displays nicely there. Everything also displays nicely on the Shop page: http://sandbox.graphicdetail.co.nz/shop/

But when we get to a category page it all falls apart: http://sandbox.graphicdetail.co.nz/product-category/toys/

I know WPBakery Page Builder is still active on this page though because you can see in the header.php code where it has:

$content_css = visual_composer()->parseShortcodesCustomCss( $content );
if ( ! empty( $content_css ) ) { ?>
     <style type="text/css" data-type="vc_shortcodes-custom-css">
                 <?php echo strip_tags( $content_css ); ?>
     </style>
<?php } ?>

... That does appear to be working fine because when I view the page with the inspector I can see the css is populating correctly.

Hopefully someone here might have some idea of where I have gone horribly, horribly wrong?

Upvotes: 1

Views: 5450

Answers (2)

Zolt&#225;n Szab&#243;
Zolt&#225;n Szab&#243;

Reputation: 11

Use this before echoing the content:

WPBMap::addAllMappedShortcodes();
echo apply_filters('the_content', the_content());

Upvotes: 1

Graphic Detail
Graphic Detail

Reputation: 121

For the benefit of anyone else who ever comes across this problem, I finally solved this puzzle, all thanks to this article (particularly the section on "Template Files"):

http://stephanieleary.com/2010/02/using-shortcodes-everywhere/

So I had this code in my header.php file:

<?php $content = $post->post_content; ?>

<header class="<?php echo($header_class); ?>">
    <div id="container" class="container clearfix">
        <?php echo apply_filters( 'the_content', $content ); ?>
    </div>
</header>

I could tell that the content was all being pulled in correctly and the CSS was being parsed correctly, etc, but it's just that WPBakery Page Builder's shortcodes weren't being parsed for some reason.

So then, after reading Stephanie Leary's article, I decided to try this:

<?php
    $content = $post->post_content;
    $content = apply_filters( 'the_content', $content );
?>

<header class="<?php echo($header_class); ?>">
    <div id="container" class="container clearfix">
        <?php echo do_shortcode($content); ?>
    </div>
</header>

So, instead of just trying to echo the apply_filters, I've populated the $content variable with the apply_filters and then parsed $content as a shortcode and whalah! It worked!

Upvotes: 1

Related Questions