Fix html inside a for loop [closed]

Question

I want to get the right link format for the second link, i tried many time to move the a open tag but no way the result is as the image below.

foreach( $terms as $term ) : 

    echo '<div class="one_half last">';

    $customposts = new WP_Query( "taxonomy=$taxonomy&term=$term->slug&posts_per_page=2" );

    echo '<ul>';
    if( $customposts->have_posts() ): while( $customposts->have_posts() ) : $customposts->the_post();
        echo '<li>';
        echo '<a href="'.the_permalink().'">'.the_title_attribute(); // The problem
        endwhile;  endif;
        echo '</a></li>';
    echo '</ul>';
    echo '</div>';
endforeach;

Thanks

Answer 1

First of all you have the PHP syntax all messed up. Second, you misused some WordPress template tags - you already echo the entire link like so you need to return post permalink and title, but right now the_permalink and the_title_attribute functions echo the code.

Here's your code fixed:

foreach( $terms as $term ) :

    $customposts = new WP_Query( "taxonomy=$taxonomy&term=$term->slug&posts_per_page=2" );

    if( $customposts->have_posts() ):

        echo '<div class="one_half last">';
        echo '<ul>';

        while( $customposts->have_posts() ) : $customposts->the_post();
            echo '<li>';
            echo '<a href="' . get_permalink() . '">' . get_the_title(); // The problem
            echo '</a></li>';
        endwhile;

        echo '</ul>';
        echo '</div>';

    endif;

endforeach;