Reduce comment padding and move post navigation below comments using card template
This commit is contained in:
14
comments.php
14
comments.php
@@ -8,7 +8,7 @@ if (post_password_required()) {
|
|||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
|
|
||||||
<div id="comments" class="comments-area reading-container mt-5">
|
<div id="comments" class="comments-area reading-container mt-3">
|
||||||
|
|
||||||
<?php
|
<?php
|
||||||
// Move the comment form ABOVE the comments thread.
|
// Move the comment form ABOVE the comments thread.
|
||||||
@@ -17,13 +17,13 @@ if (post_password_required()) {
|
|||||||
$html_req = ($req ? " required='required'" : '');
|
$html_req = ($req ? " required='required'" : '');
|
||||||
|
|
||||||
$args = array(
|
$args = array(
|
||||||
'class_form' => 'comment-form mb-5',
|
'class_form' => 'comment-form mb-4',
|
||||||
'class_submit' => 'btn btn-secondary fw-bold text-uppercase mt-4 px-4 py-2',
|
'class_submit' => 'btn btn-secondary fw-bold text-uppercase mt-3 px-4 py-2',
|
||||||
'title_reply_before' => '<h2 id="reply-title" class="comment-reply-title h4 font-sans mb-4 fw-bold">',
|
'title_reply_before' => '<h2 id="reply-title" class="comment-reply-title h4 font-sans mb-3 fw-bold">',
|
||||||
'title_reply_after' => '</h2>',
|
'title_reply_after' => '</h2>',
|
||||||
'comment_field' => '<div class="comment-form-comment mb-4"><label for="comment" class="form-label text-muted small text-uppercase tracking-wider fw-bold">Add a Perspective <span class="text-danger">*</span></label><textarea id="comment" name="comment" cols="45" rows="4" maxlength="65525" required="required" class="form-control border-0" style="background-color: #f1f3f5;"></textarea></div>',
|
'comment_field' => '<div class="comment-form-comment mb-3"><label for="comment" class="form-label text-muted small text-uppercase tracking-wider fw-bold">Add a Perspective <span class="text-danger">*</span></label><textarea id="comment" name="comment" cols="45" rows="4" maxlength="65525" required="required" class="form-control border-0" style="background-color: #f1f3f5;"></textarea></div>',
|
||||||
'fields' => array(
|
'fields' => array(
|
||||||
'author' => '<div class="row g-3 mb-3"><div class="col-md-6 comment-form-author"><label for="author" class="form-label small fw-bold">Name ' . ($req ? '<span class="text-danger">*</span>' : '') . '</label><input id="author" name="author" type="text" value="' . esc_attr($commenter['comment_author']) . '" size="30" maxlength="245"' . $html_req . ' class="form-control bg-white" /></div>',
|
'author' => '<div class="row g-3 mb-2"><div class="col-md-6 comment-form-author"><label for="author" class="form-label small fw-bold">Name ' . ($req ? '<span class="text-danger">*</span>' : '') . '</label><input id="author" name="author" type="text" value="' . esc_attr($commenter['comment_author']) . '" size="30" maxlength="245"' . $html_req . ' class="form-control bg-white" /></div>',
|
||||||
'email' => '<div class="col-md-6 comment-form-email"><label for="email" class="form-label small fw-bold">Email ' . ($req ? '<span class="text-danger">*</span>' : '') . '</label><input id="email" name="email" type="email" value="' . esc_attr($commenter['comment_author_email']) . '" size="30" maxlength="100" aria-describedby="email-notes"' . $html_req . ' class="form-control bg-white" /></div></div>',
|
'email' => '<div class="col-md-6 comment-form-email"><label for="email" class="form-label small fw-bold">Email ' . ($req ? '<span class="text-danger">*</span>' : '') . '</label><input id="email" name="email" type="email" value="' . esc_attr($commenter['comment_author_email']) . '" size="30" maxlength="100" aria-describedby="email-notes"' . $html_req . ' class="form-control bg-white" /></div></div>',
|
||||||
'url' => '<div class="comment-form-url mb-4"><label for="url" class="form-label small fw-bold">Website</label><input id="url" name="url" type="url" value="' . esc_attr($commenter['comment_author_url']) . '" size="30" maxlength="200" class="form-control bg-white" /></div>',
|
'url' => '<div class="comment-form-url mb-4"><label for="url" class="form-label small fw-bold">Website</label><input id="url" name="url" type="url" value="' . esc_attr($commenter['comment_author_url']) . '" size="30" maxlength="200" class="form-control bg-white" /></div>',
|
||||||
),
|
),
|
||||||
@@ -32,7 +32,7 @@ if (post_password_required()) {
|
|||||||
?>
|
?>
|
||||||
|
|
||||||
<?php if (have_comments()): ?>
|
<?php if (have_comments()): ?>
|
||||||
<h2 class="comments-title mt-5 h5 font-sans border-bottom pb-3 mb-4">
|
<h2 class="comments-title mt-4 h5 font-sans border-bottom pb-2 mb-3">
|
||||||
<?php
|
<?php
|
||||||
$comment_count = get_comments_number();
|
$comment_count = get_comments_number();
|
||||||
if ('1' === $comment_count) {
|
if ('1' === $comment_count) {
|
||||||
|
|||||||
87
single.php
87
single.php
@@ -69,59 +69,46 @@ get_header(); ?>
|
|||||||
?>
|
?>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- .entry-footer -->
|
</footer><!-- .entry-footer -->
|
||||||
</article><!-- #post-<?php the_ID(); ?> -->
|
<div class="mx-auto px-3 mb-3" style="max-width: 680px;">
|
||||||
|
<?php
|
||||||
<div class="mx-auto px-3" style="max-width: 680px;">
|
// If comments are open or we have at least one comment, load up the comment template inside the constrained column.
|
||||||
<nav class="navigation post-navigation mt-5 border-top border-bottom py-4" aria-label="Posts">
|
if (comments_open() || get_comments_number()):
|
||||||
<div class="row justify-content-between g-4">
|
comments_template();
|
||||||
<div class="col-md-6 text-start">
|
endif;
|
||||||
<?php
|
?>
|
||||||
$prev_post = get_previous_post();
|
</div>
|
||||||
if (!empty($prev_post)):
|
|
||||||
?>
|
|
||||||
<a href="<?php echo esc_url(get_permalink($prev_post->ID)); ?>"
|
|
||||||
class="text-decoration-none d-flex align-items-center gap-3">
|
|
||||||
<?php if (has_post_thumbnail($prev_post->ID)): ?>
|
|
||||||
<?php echo get_the_post_thumbnail($prev_post->ID, 'thumbnail', array('class' => 'post-nav-thumbnail shadow-sm')); ?>
|
|
||||||
<?php endif; ?>
|
|
||||||
<div>
|
|
||||||
<div class="text-muted small fw-bold mb-1 text-uppercase tracking-wider">Previous</div>
|
|
||||||
<div class="fw-bold text-dark lh-sm"><?php echo esc_html($prev_post->post_title); ?>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<?php endif; ?>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6 text-end">
|
|
||||||
<?php
|
|
||||||
$next_post = get_next_post();
|
|
||||||
if (!empty($next_post)):
|
|
||||||
?>
|
|
||||||
<a href="<?php echo esc_url(get_permalink($next_post->ID)); ?>"
|
|
||||||
class="text-decoration-none d-flex align-items-center justify-content-end gap-3 text-end">
|
|
||||||
<div>
|
|
||||||
<div class="text-muted small fw-bold mb-1 text-uppercase tracking-wider">Next</div>
|
|
||||||
<div class="fw-bold text-dark lh-sm"><?php echo esc_html($next_post->post_title); ?>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<?php if (has_post_thumbnail($next_post->ID)): ?>
|
|
||||||
<?php echo get_the_post_thumbnail($next_post->ID, 'thumbnail', array('class' => 'post-nav-thumbnail shadow-sm')); ?>
|
|
||||||
<?php endif; ?>
|
|
||||||
</a>
|
|
||||||
<?php endif; ?>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
<?php
|
<?php
|
||||||
// If comments are open or we have at least one comment, load up the comment template inside the constrained column.
|
$prev_post = get_previous_post();
|
||||||
if (comments_open() || get_comments_number()):
|
$next_post = get_next_post();
|
||||||
comments_template();
|
if (!empty($prev_post) || !empty($next_post)):
|
||||||
endif;
|
?>
|
||||||
?>
|
<div class="mt-5 pt-5 border-top">
|
||||||
</div>
|
<h3 class="h4 font-serif fw-bold mb-4 text-center">More Articles</h3>
|
||||||
|
<div class="row justify-content-center gx-4 gy-4">
|
||||||
|
<?php
|
||||||
|
global $post;
|
||||||
|
$original_post = $post;
|
||||||
|
|
||||||
<?php endwhile; // End of the loop. ?>
|
if (!empty($prev_post)) {
|
||||||
|
$post = $prev_post;
|
||||||
|
setup_postdata($post);
|
||||||
|
get_template_part('template-parts/content', 'card');
|
||||||
|
}
|
||||||
|
if (!empty($next_post)) {
|
||||||
|
$post = $next_post;
|
||||||
|
setup_postdata($post);
|
||||||
|
get_template_part('template-parts/content', 'card');
|
||||||
|
}
|
||||||
|
|
||||||
|
$post = $original_post;
|
||||||
|
wp_reset_postdata();
|
||||||
|
?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php endwhile; // End of the loop. ?>
|
||||||
</main><!-- #main -->
|
</main><!-- #main -->
|
||||||
|
|
||||||
<?php
|
<?php
|
||||||
|
|||||||
Reference in New Issue
Block a user