Вывод миниатюры — картинки не в том месте.

  • bepassersby

    (@bepassersby)


    7 лет, 5 месяцев назад

    Добрый день форумчане! Прошу о совете вас о великие гуру!
    На главной странице сайта выводятся последние записи с миниатюрами. Но вот беда у меня случилась. Миниатюры не в тех местах где нужно. Как попало выводятся но не над самой записью. В итоге черт ногу сломает пока поймешь какая миниатюра к какой записе принадлежит.
    1

    Помогите с кодом. Где и как прописать что бы четко получалось?

    <?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://codex.wordpress.org/Template_Hierarchy
 *
 * @package refur
 */

get_header(); ?>

	<div id="primary" class="content-area col-xs-12">
		<main id="main" class="site-main" role="main">

		<?php if ( have_posts() ) : ?>

			<?php if ( is_home() && ! is_front_page() ) : ?>
				<header>
					<h1 class="page-title screen-reader-text"><?php single_post_title(); ?></h1>
				</header>
			<?php endif; ?>

			<?php /* Start the Loop */ ?>
			<div class="posts-listing">
			<?php while ( have_posts() ) : the_post(); ?>

<?php the_post_thumbnail(); ?>

				<?php
					/*
					 * Include the Post-Format-specific template for the content.
					 * If you want to override this in a child theme, then include a file
					 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
					 */
					get_template_part( 'template-parts/content', get_post_format() );
				?>

			<?php endwhile; ?>
			</div>
			<?php
				the_posts_pagination(
					array(
						'prev_text' => '<i class="fa fa-angle-double-left"></i>',
						'next_text' => '<i class="fa fa-angle-double-right"></i>',
					)
				);
			?>

		<?php else : ?>

			<?php get_template_part( 'template-parts/content', 'none' ); ?>

		<?php endif; ?>

		</main><!-- #main -->
	</div><!-- #primary -->

<?php get_footer(); ?>
Просмотр 7 ответов — с 1 по 7 (всего 7)
  • DS

    (@dosolnce)

    7 лет, 5 месяцев назад

    Верстка на flex, растягивает на три равные части. Можно объединить в один div картинку с article, но, наверное, проще изменить значение на 50 в style.css темы:
    .posts-listing .hentry {width:33.33333%;}

    Автор bepassersby

    (@bepassersby)

    7 лет, 5 месяцев назад

    Спасибо! Не помогло. Подскажи пожалуйста как объединить.
    .posts-listing .hentry {width:33.33333%;} здесь менял на 50 %, но не изменилось.

    DS

    (@dosolnce)

    7 лет, 5 месяцев назад

    Странно, в отладчике браузера все сработало сразу, причем на все брекпойнты.
    Объединить = обернуть в div кусок кода, который отвечает за вывод на данной странице. Грубо говоря, на примере приведенного Вами здесь шаблона, так:

    
<div class="vash-new-class">
			<?php while ( have_posts() ) : the_post(); ?>
            <?php the_post_thumbnail(); ?>
				<?php
					/*
					 * Include the Post-Format-specific template for the content.
					 * If you want to override this in a child theme, then include a file
					 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
					 */
					get_template_part( 'template-parts/content', get_post_format() );
				?>
			<?php endwhile; ?>
<div>

    Но лучше, наверное, подскажут спецы или на форуме темы, я с ней незнаком, с php тоже почти, чтобы быть уверенным, мне надо ставить тему и все это делать самому, но некогда. Так что мой пример основан только на интуиции и правиле «открытый код должен быть закрыт». Что можно еще учесть — в теме жестко задана длина row в px, а не в %, возможно еще какие-то width, не смотрел глубоко, это может косяками вылезти и тогда тоже потребует правки.

    Автор bepassersby

    (@bepassersby)

    7 лет, 5 месяцев назад

    ц
    Спасибо за помощь и за отклик! но миниатюры остались на своем не правильном месте(((

    вот таких вот .posts-listing .hentry {width:33.33333%;} аж 6 в файле style.css их все изменить на 50%?

    DS

    (@dosolnce)

    7 лет, 5 месяцев назад

    И все 6 одинаковые до буковки и знака? Зачем тогда они? 1409 строка.

    UPD Блин, из любопытства скачал тему. Мало того, что только 1 на 1409-й строке, как и сказал выше, так еще и 33.33333% в этом огромном css встречается только единожды.

    А строку <?php the_post_thumbnail(); ?> Вы сами в index.php вставили? В оригинале темы ее нет.

    • Ответ изменён 7 лет, 5 месяцев назад пользователем DS.
    • Ответ изменён 7 лет, 5 месяцев назад пользователем DS.
    • Ответ изменён 7 лет, 5 месяцев назад пользователем DS.
    Автор bepassersby

    (@bepassersby)

    7 лет, 5 месяцев назад

    Очень благодарен ВАМ!!
    1
    но наглость второе счастье)) подскажите реально ли сделать в две колонки вывод записей? Сейчас получилась одна как на картинке.

    DS

    (@dosolnce)

    7 лет, 5 месяцев назад

    Реально, разумеется. Или играться с flex-версткой (вообще с flex не работал, изучайте), или попробовать готовое решение: http://dimox.name/vyvod-lenty-postov-v-2-stolbca/
    Ставил это еще на денвере, работало, снес за неактуальностью пока.

Просмотр 7 ответов — с 1 по 7 (всего 7)
  • Тема «Вывод миниатюры — картинки не в том месте.» закрыта для новых ответов.