Я пытался понять это весь день, но не повезло. Простой ответ - поместить заголовок за пределы сетки, но проблема в том, что внутри сетки находятся 2 catquery, которые отображают 2 отдельные категории внутри сетки, а затем есть следующее:
<main id="main" class="site-main">
Когда Я пытаюсь переместить это или разделить и создать 2 контейнера сетки, рядом с сеткой есть боковая панель (которая отображает избранные сообщения в WP), и боковая панель становится неработающей или сетка нарушается. Я вставил заголовок (HEADER 1) над первой сеткой, которая работает. Но я пытаюсь разместить еще один заголовок над 2-ым catquery сообщений.
Код:
<div id="page" class="site grid-container start-container-head">
<h2>HEADER 1</h2>
<div id="content" class="site-content grid-x grid-padding-x">
<div id="primary" class="content-area large-8 medium-8 small-12 cell fp-blog-grid">
<main id="main" class="site-main">
<?php $catquery = new WP_Query( 'cat=3&posts_per_page=4' ); ?>
<?php while($catquery->have_posts()) : $catquery->the_post(); ?>
<?php
get_template_part( 'template-parts/content', 'excerpt' );
?>
***I NEED TO INSERT THE 2ND HEADER TEXT HERE***
<h2">HEADER 2</h2>
<?php endwhile;
wp_reset_postdata();
?>
<?php $catquery = new WP_Query( 'cat=1&posts_per_page=4' ); ?>
<?php while($catquery->have_posts()) : $catquery->the_post(); ?>
<?php
get_template_part( 'template-parts/content', 'excerpt' );
?>
<?php endwhile;
wp_reset_postdata();
?>
</main><!-- #main -->
</div><!-- #primary -->
<?php
get_sidebar();
get_footer();
Сейчас он думает, что второй заголовок является частью сетки, которую я попытался передвигаться по элементам div или разделить класс сетки на 2 отдельных элемента div и вставить над ним второй заголовок, но он разбил страницу.
Есть идеи, как это можно сделать?
Вот пример того, чего я пытаюсь достичь с помощью скриншота текущего макета: