I'm trying to code a custom theme for my wordpress site. I'm trying to output 5 of my posts and I want to wrap them into a link. However when I foreach()
through the posts and want to wrap my html in an <a>
tag with the permalink it won't work.
The code I wrote:
<?php
global $post;
$myposts = get_posts( array(
'posts_per_page' => 5,
) );
if ( $myposts ) {
foreach ( $myposts as $post ) :
setup_postdata( $post ); ?>
<div class="container-fluid">
<a class="post-link" href="<?php echo the_permalink();?>">
<div class="post-post p-5">
<div class="row">
<div class="col-md-12">
<?php the_category('<p></p>'); ?>
</div>
</div>
<div class="row">
<div class="col-md-12">
<h3><?php the_title(); ?></h3>
</div>
</div>
<div class="row">
<div class="col-md-12">
<small><?php the_author(); ?></small>
</div>
</div>
</div>
</a>
</div>
<?php
endforeach;
wp_reset_postdata();
}
?>
But the code which ends up on the site is complete junk and it closes the <a>
tag before the next div. what did I do wrong?
The code that lands on the site:
<div class="container-fluid">
<a class="post-link" href="http://localhost/wptheme/index.php/2021/01/11/oeoeoeoeoeoe/">
</a>
<div class="post-post p-5">
<a class="post-link" href="http://localhost/wptheme/index.php/2021/01/11/oeoeoeoeoeoe/">
</a>
<div class="row">
<a class="post-link" href="http://localhost/wptheme/index.php/2021/01/11/oeoeoeoeoeoe/">
</a>
<div class="col-md-12">
<a class="post-link" href="http://localhost/wptheme/index.php/2021/01/11/oeoeoeoeoeoe/">
</a>
<a href="http://localhost/wptheme/index.php/category/allgemein/" rel="category tag">Allgemein</a> </div>
</div>
<div class="row">
<div class="col-md-12">
<h3>öööööö</h3>
</div>
</div>
<div class="row">
<div class="col-md-12">
<small>root</small>
</div>
</div>
</div>
</div>
WordPress' the_permalink() function prints the link with the tags.
Use get_the_permalink()
function instead of the_permalink() for "echo"ing the link wherever needed.