CODEWITHSUNDEEP
phpwordpressvariables
Mark Lee
Mark Lee

Reputation: 335

How do I execute php code within a variable containing html

I assembled a Wordpress shortcode but it throws an error in the block editor: "Updating failed. The response is not a valid JSON response." Notwithstanding, the edits are saved. I've been told the reason I get the error is my "shortcode handler function is generating output. Such functions must collect all output into a variable which is returned."

Below are (1) the code that works but causes the error message and (2) my pseudo code to fix the problem by assigning the 'a href' to a variable $html, but doesn't.

(1)

function make_header() {
$args = array(
    'posts_per_page' => 1,
    'category_name' => 'headlines',
);
$q = new WP_Query( $args);

if ( $q->have_posts() ) {
    while ( $q->have_posts() ) {
    $q->the_post();        
    $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'full');
    ?>
    <a href="<?php the_permalink() ?>">
    <div><img src="<?php echo $featured_img_url; ?>" width="100%" /></div>
    <h2>
    <?php the_title(); ?>
    </h2></a>
<?php
    }
    wp_reset_postdata();
}
}
add_shortcode('make_header', 'make_header');

(2)

$html = '
<a href="<?php the_permalink() ?>">
    <div><img src="<?php echo $featured_img_url; ?>" width="100%" /></div>
    <h2>
    <?php
        the_title(); ?> </h2></a>';
    }
    wp_reset_postdata();
    return $html;

Thanks for your help.

Upvotes: 0

Views: 199

Answers (2)

benada002
benada002

Reputation: 281

You could to use concatenation like so:

$html = '<a href="' . esc_url(get_the_permalink()) . '">';
$html .= '<div>';
$html .= '<img src="' . $featured_img_url . '" width="100%" />';
$html .= '</div>';
$html .= '<h2>' . get_the_title() . '</h2></a>';

Also, use get_the_permalink() and get_the_title() as these functions are returning their result instead of outputting it.

The full code would then look something like this:

function make_header() {
    $html = '';
    $args = array(
        'posts_per_page' => 1,
        'category_name' => 'headlines',
    );
    $q = new WP_Query( $args);
    
    if ( $q->have_posts() ) {
        while ( $q->have_posts() ) {
            $q->the_post();
            $featured_img_url = esc_url(get_the_post_thumbnail_url(get_the_ID(),'full'));

            $html = '<a href="' . esc_url(get_the_permalink()) . '">';
            $html .= '<div>';
            $html .= '<img src="' . $featured_img_url . '" width="100%" />';
            $html .= '</div>';
            $html .= '<h2>' . get_the_title() . '</h2></a>';
        }
        wp_reset_postdata();
    }

    return $html;
}
add_shortcode('make_header', 'make_header');

Upvotes: 0

Vicky
Vicky

Reputation: 83

Try below code

$html = ' <a href="'.the_permalink() .'"> <div><img src="'. echo $featured_img_url .'" width="100%" /></div> <h2>'. the_title().' </h2></a>';

the concatenation operator (‘.‘), which returns the concatenation of its right and left arguments. 

Upvotes: 1

Related Questions