$conf, $runtime; function_exists('chdir') AND chdir(APP_PATH); $r = 'mysql' == $conf['cache']['type'] ? website_set('runtime', $runtime) : cache_set('runtime', $runtime); } function runtime_truncate() { global $conf; 'mysql' == $conf['cache']['type'] ? website_set('runtime', '') : cache_delete('runtime'); } register_shutdown_function('runtime_save'); ?>filters - get_post() containing gallery is outputting an unmatched closing div at the end of the content|Programmer puzzle solving

Programmer puzzle solving

    最新消息：Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)
    你的位置： HOME>matter>filters - get_post() containing gallery is outputting an unmatched closing div at the end of the content

    filters - get_post() containing gallery is outputting an unmatched closing div at the end of the content

    matteradmin9PV0评论

    I have created a custom page with fetches content from various posts using get_post(id).

    I fetch the posts using this function:-

    function get_my_post($id){ 
    $get_post = get_post($id);
    $content = apply_filters('the_content', $get_post->post_content);
    echo $content;
}

    However, the output seemed to be breaking the DOM. After some investigation, I realized the posts containing a gallery shortcode had a lone closing div at the end of the content, without a matching opening div. For example, the echoed output from one of the posts containing a gallery looks like this:-

    <figure class='gallery-item'>
    <div class='gallery-icon landscape'>
        <img width="700" height="469" src=".jpg" class="attachment-medium size-medium" alt="" srcset=".jpg 700w, .jpg 768w, .jpg 1000w, .jpg 400w, .jpg 1600w" sizes="(max-width: 700px) 100vw, 700px" />
    </div>
</figure>
<figure class='gallery-item'> 
    <div class='gallery-icon landscape'> 
        <img width="700" height="469" src=".jpg" class="attachment-medium size-medium" alt="" srcset=".jpg 700w, .jpg 768w, .jpg 1000w, .jpg 400w, .jpg 1600w" sizes="(max-width: 700px) 100vw, 700px" /> 
    </div>
</figure>
<figure class='gallery-item'> 
    <div class='gallery-icon landscape'> 
        <img width="700" height="469" src=".jpg" class="attachment-medium size-medium" alt="" srcset=".jpg 700w, .jpg 768w, .jpg 1000w, .jpg 400w, .jpg 1600w" sizes="(max-width: 700px) 100vw, 700px" /> 
    </div>
</figure> 
</div>

    As you can see, there is an unmatched closing div at the end that shouldn't be there - which messes up the DOM.

    Here is the content of the post that outputs the above:-

    [gallery link="none" size="medium" columns="3" ids="79,78,75"]

    If I remove the gallery shortcodes, all other types of content work fine. And if I echo the content raw without the_content filter, that works - although obviously this echos the gallery shortcode unrendered. But applying the filter to the gallery gives me this lone div.

    Does anybody have any ideas as to what might be happening?

    Thanks for your time

    I have created a custom page with fetches content from various posts using get_post(id).

    I fetch the posts using this function:-

    function get_my_post($id){ 
    $get_post = get_post($id);
    $content = apply_filters('the_content', $get_post->post_content);
    echo $content;
}

    However, the output seemed to be breaking the DOM. After some investigation, I realized the posts containing a gallery shortcode had a lone closing div at the end of the content, without a matching opening div. For example, the echoed output from one of the posts containing a gallery looks like this:-

    <figure class='gallery-item'>
    <div class='gallery-icon landscape'>
        <img width="700" height="469" src="https://testsite/wp-content/uploads/DSC_0668-700x469.jpg" class="attachment-medium size-medium" alt="" srcset="https://testsite/wp-content/uploads/DSC_0668-700x469.jpg 700w, https://testsite/wp-content/uploads/DSC_0668-768x514.jpg 768w, https://testsite/wp-content/uploads/DSC_0668-1000x669.jpg 1000w, https://testsite/wp-content/uploads/DSC_0668-400x268.jpg 400w, https://testsite/wp-content/uploads/DSC_0668.jpg 1600w" sizes="(max-width: 700px) 100vw, 700px" />
    </div>
</figure>
<figure class='gallery-item'> 
    <div class='gallery-icon landscape'> 
        <img width="700" height="469" src="https://testsite/wp-content/uploads/DSC_0251-700x469.jpg" class="attachment-medium size-medium" alt="" srcset="https://testsite/wp-content/uploads/DSC_0251-700x469.jpg 700w, https://testsite/wp-content/uploads/DSC_0251-768x514.jpg 768w, https://testsite/wp-content/uploads/DSC_0251-1000x669.jpg 1000w, https://testsite/wp-content/uploads/DSC_0251-400x268.jpg 400w, https://testsite/wp-content/uploads/DSC_0251.jpg 1600w" sizes="(max-width: 700px) 100vw, 700px" /> 
    </div>
</figure>
<figure class='gallery-item'> 
    <div class='gallery-icon landscape'> 
        <img width="700" height="469" src="https://testsite/wp-content/uploads/DSC_0192-700x469.jpg" class="attachment-medium size-medium" alt="" srcset="https://testsite/wp-content/uploads/DSC_0192-700x469.jpg 700w, https://testsite/wp-content/uploads/DSC_0192-768x514.jpg 768w, https://testsite/wp-content/uploads/DSC_0192-1000x669.jpg 1000w, https://testsite/wp-content/uploads/DSC_0192-400x268.jpg 400w, https://testsite/wp-content/uploads/DSC_0192.jpg 1600w" sizes="(max-width: 700px) 100vw, 700px" /> 
    </div>
</figure> 
</div>

    As you can see, there is an unmatched closing div at the end that shouldn't be there - which messes up the DOM.

    Here is the content of the post that outputs the above:-

    [gallery link="none" size="medium" columns="3" ids="79,78,75"]

    If I remove the gallery shortcodes, all other types of content work fine. And if I echo the content raw without the_content filter, that works - although obviously this echos the gallery shortcode unrendered. But applying the filter to the gallery gives me this lone div.

    Does anybody have any ideas as to what might be happening?

    Thanks for your time

    • filters
    • gallery
    • the-content
    Share Improve this question edited Jan 21, 2019 at 18:48 Michae Pavlos Michael asked Jan 21, 2019 at 18:31 Michae Pavlos MichaelMichae Pavlos Michael 691 silver badge12 bronze badges
    Add a comment  | 

    1 Answer 1

    Reset to default 2

    If you look at the gallery shortcode function the opening div (to match that closer you're missing) looks like this:

    $gallery_div = "<div id='$selector' class='gallery galleryid-{$id} gallery-columns-{$columns} gallery-size-{$size_class}'>";

    then this filter is run

    $output = apply_filters( 'gallery_style', $gallery_style . $gallery_div );

    More than likely there's code somewhere in your theme or a plugin that's messing with the gallery_style filter and that's your culprit.

    Here's the proper way to remove the gallery styles. Directly above the previous code is this:

    /**
     * Filters whether to print default gallery styles.
     *
     * @since 3.1.0
     *
     * @param bool $print Whether to print default gallery styles.
     *                    Defaults to false if the theme supports HTML5 galleries.
     *                    Otherwise, defaults to true.
     */
    if ( apply_filters( 'use_default_gallery_style', ! $html5 ) ) {
        $gallery_style = "

    So you just need to force that filter to return false, like so:

    add_filter( 'use_default_gallery_style', '__return_false');

    then get rid of the filter function your theme is adding that wipes out the styles and the opening div.

    Articles related to this article

    Post a comment

    comment list (0)

    1. No comments so far