1) The messed up layout
It looks like you’re missing one closing </div>
in your markup. Adding it on a line between <?php endif; ?>
and <?php get_sidebar(); ?>
should do the trick.
As a side note, you have h3
nested inside a h4
which is invalid markup.
2) Adding styling to your site
In WordPress the proper way of adding styles is to use the theme’s stylesheet instead of hard coding the style
tags to your templates. So just remove the style
tag from your template and move the css to your (child) theme’s styles.css file.
Do the same thing for the style
tag that can be seen before the doctype
declaration in your page source code.
You can read more about adding styles to your site here, https://developer.wordpress.org/themes/basics/including-css-javascript/#stylesheets
3) Comment count
In your loop you can use comments_number
to “Display the language string for the number of comments the current post has.” Refer to the code reference to see the parameters you can pass to the function. For example,
<span class="comments"><?php comments_number(); ?></span>
4) Post tags
In your loop you can use the_tags()
template function to display the post tags. This function too takes some parameters, which are described in the code reference.
<p><?php the_tags(); ?></p>
Or if you want to have more control on the tag output html, then you can use get_the_tags()
instead in your loop. Simplified example,
$post_tags = get_the_tags();
if ( $post_tags ) {
foreach( $post_tags as $tag ) {
echo $tag->name . ', ';
}
}