Bootscore
-
|
On the home page, the sticky posts appear wider than the normal posts on the home page. The right-hand sidebar (where my menu lives) appears below the stick posts, aligning with the "normal" posts. I want to resized the sticky posts container to line up with the normal posts on this page. I know how to resize the div which holds the sticky posts but I cannot figure out how to get the sidebar to align with the top of the sticky posts. I have tried relocating the call to get sidebar ... I end up with the sidebar left justified at the top above the stickyposts or at the bottom after all the posts... Here is the relevant page help.onlineadvantage.com.au (this is using a version 5.2 bootscore.me not on version 6 yet) without intended changes...can someone point me in the right direction ... the main issue being how to reposition the sidebar so that when I change the width of the sticky posts, the sidebar will move up. Attached is a screen shot from a test site (it is locked down) that shows what I want to achieve. I will be very grateful for any insights...Thank you!
|
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 1 reply
-
|
No need to resize the sticky post, because this one has same size as usual posts. Simply move the sticky post item into the Here is the updated <?php
/**
* The main template file
*
* This is the most generic template file in a WordPress theme
* and one of the two required files for a theme (the other being style.css).
* It is used to display a page when nothing more specific matches a query.
* E.g., it puts together the home page when no home.php file exists.
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
*
* @package Bootscore
* @version 6.0.0
*/
// Exit if accessed directly
defined('ABSPATH') || exit;
get_header();
?>
<div id="content" class="site-content <?= apply_filters('bootscore/class/container', 'container', 'index'); ?> <?= apply_filters('bootscore/class/content/spacer', 'pt-4 pb-5', 'index'); ?>">
<div id="primary" class="content-area">
<main id="main" class="site-main">
<!-- Header -->
<div class="p-5 text-center bg-body-tertiary rounded mb-4">
<h1><?php bloginfo('name'); ?></h1>
<p class="lead mb-0"><?php bloginfo('description'); ?></p>
</div>
<!-- Post List -->
<div class="row">
<div class="<?= apply_filters('bootscore/class/main/col', 'col'); ?>">
<!-- Sticky Post -->
<?php if (is_sticky() && is_home() && !is_paged()) : ?>
<div class="row">
<div class="col">
<?php
$args = array(
'posts_per_page' => 2,
'post__in' => get_option('sticky_posts'),
'ignore_sticky_posts' => 2
);
$the_query = new WP_Query($args);
if ($the_query->have_posts()) :
while ($the_query->have_posts()) : $the_query->the_post(); ?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="card horizontal mb-4">
<div class="row g-0">
<?php if (has_post_thumbnail()) : ?>
<div class="col-lg-6 col-xl-5 col-xxl-4">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('medium', array('class' => 'card-img-lg-start')); ?>
</a>
</div>
<?php endif; ?>
<div class="col">
<div class="card-body">
<div class="row">
<div class="col-10">
<?php bootscore_category_badge(); ?>
</div>
<div class="col-2 text-end">
<span class="badge text-bg-danger"><?= apply_filters('bootscore/icon/star', '<i class="fa-solid fa-star"></i>'); ?></span>
</div>
</div>
<a class="text-body text-decoration-none" href="<?php the_permalink(); ?>">
<?php the_title('<h2 class="blog-post-title h5">', '</h2>'); ?>
</a>
<?php if ('post' === get_post_type()) : ?>
<p class="meta small mb-2 text-body-secondary">
<?php
bootscore_date();
bootscore_author();
bootscore_comments();
bootscore_edit();
?>
</p>
<?php endif; ?>
<p class="card-text">
<a class="text-body text-decoration-none" href="<?php the_permalink(); ?>">
<?= strip_tags(get_the_excerpt()); ?>
</a>
</p>
<p class="card-text">
<a class="read-more" href="<?php the_permalink(); ?>">
<?php _e('Read more »', 'bootscore'); ?>
</a>
</p>
<?php bootscore_tags(); ?>
</div>
</div>
</div>
</div>
</article>
<?php
endwhile;
endif;
wp_reset_postdata();
?>
</div>
<!-- col -->
</div>
<!-- row -->
<?php endif; ?>
<!-- Grid Layout -->
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php if (is_sticky()) continue; //ignore sticky posts
?>
<div class="card horizontal mb-4">
<div class="row g-0">
<?php if (has_post_thumbnail()) : ?>
<div class="col-lg-6 col-xl-5 col-xxl-4">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('medium', array('class' => 'card-img-lg-start')); ?>
</a>
</div>
<?php endif; ?>
<div class="col">
<div class="card-body">
<?php bootscore_category_badge(); ?>
<a class="text-body text-decoration-none" href="<?php the_permalink(); ?>">
<?php the_title('<h2 class="blog-post-title h5">', '</h2>'); ?>
</a>
<?php if ('post' === get_post_type()) : ?>
<p class="meta small mb-2 text-body-secondary">
<?php
bootscore_date();
bootscore_author();
bootscore_comments();
bootscore_edit();
?>
</p>
<?php endif; ?>
<p class="card-text">
<a class="text-body text-decoration-none" href="<?php the_permalink(); ?>">
<?= strip_tags(get_the_excerpt()); ?>
</a>
</p>
<p class="card-text">
<a class="read-more" href="<?php the_permalink(); ?>">
<?php _e('Read more »', 'bootscore'); ?>
</a>
</p>
<?php bootscore_tags(); ?>
</div>
</div>
</div>
</div>
<?php endwhile; ?>
<?php endif; ?>
<div class="entry-footer">
<?php bootscore_pagination(); ?>
</div>
</div>
<!-- col -->
<?php get_sidebar(); ?>
</div>
<!-- row -->
</main><!-- #main -->
</div><!-- #primary -->
</div><!-- #content -->
<?php
get_footer();Solved? |
Beta Was this translation helpful? Give feedback.
-
|
Solved! So simple! Thank you. |
Beta Was this translation helpful? Give feedback.
No need to resize the sticky post, because this one has same size as usual posts. Simply move the sticky post item into the
<div class="row"><div class="col">loop.Here is the updated
index.phpfor Bootscore v6: