Как вывести каждый пост в отдельный слайд WordPress?

Question

[barsecky]

Добрый день!
Нужна ваша помощь.
На сайте есть слайдер в который должны выводится посты, для каждого поста отдельный слайд.
У меня получилось вывести все посты, но в каждый слайд (т.е. в каждом слайдере все посты) (((
Помогите пожалуйста изменит код что бы все заработало как надо, в PHP не силен от слова совсем
Сайт собран на Elementor, по этомы вывожу слайдер шортккодом.

function wpc_elementor_shortcode( $atts ) {	
		?>
			<div class="owl-menu owl-carousel  custom-owl-carousel owl-theme">
				<div class="item-slider">
					<div class="item-menu">

					<?php		
						global $post;
						$myposts = get_posts([ 
							'numberposts' => 10,
							'category'    => 5,
						]);
						if( $myposts ){
							foreach( $myposts as $post ){
								setup_postdata( $post );
								?>

								<p>Статьи / <?php the_date(); ?></p>
									<h3><?php the_title(); ?></h3>
									<a class="box-post_link" href="<?php echo get_permalink(); ?>">Читать дальше </a>
						<?php 
									}
								} else {
					     	// Постов не найдено
						}
					wp_reset_postdata(); // Сбрасываем $post								
					?>
				</div>
			</div>
		</div>
	<?php 
}
add_shortcode( 'my_elementor_php_output', 'wpc_elementor_shortcode');

Comments

[Антон Литвиненко]

очевидно, что перенести разметку одного слайда внутрь цикла

[barsecky]

Антон Литвиненко,
Блин, как я не заметил этого)) мозг уже не соображает
Спасибо! не могу ваш комментарий отметить решением((((

Может еще подскажите как сделать что бы в каждом слайде было по 2 поста?

[Антон Литвиненко]

barsecky, завести перед циклом счетчик, и выводить открывающий тег слайда и закрывающий на каждой второй итерации. С головы не готов написать прям как должно быть, но идею должны понять

<?php

$myposts = get_posts([ 
	'numberposts' => 10,
	'post_type'=> 'team'
]);

$ir = 0;

?>

<?php foreach( $myposts as $post ) :
	setup_postdata( $post );
?>

	<?php if ($ir % 2 == 0) : ?>
		<div class="slide">
	<?php endif; ?>

		<div class="post">
			<h3><?php the_title(); ?></h3>
			<a class="box-post_link" href="<?php echo get_permalink(); ?>">Читать дальше </a>
		</div>

	<?php if ($ir % 2 !== 0) : ?>
		</div >
	<?php endif; $ir++; ?>
<?php endforeach; ?>

<?php wp_reset_postdata(); ?>

[barsecky]

Антон Литвиненко, к сожалению не работает((
я в программировании не особо силен, а php для меня собще темный лес(((

[Антон Литвиненко]

barsecky, проверил у себя и поправил код. вам из него нужно только поставить счетчик примерно как у меня и в проверках поставить открывающие и закрывающие теги, тогда они будут заворачивать по два поста. ну один пост по хорошему обернуть одним дивом и это должен быть не тег одного слайда

[barsecky]

Антон Литвиненко, Добрый день, спасибо за помощь!!
попытался периписать код по ваш, и все получилось))))
Спасибо вам еще раз!!!!!!!!!!!

function wpc_elementor_shortcode( $atts ) {	
					?>
					<div class="owl-menu owl-carousel  custom-owl-carousel owl-theme">
						

					<?php		
						global $post;
						$myposts = get_posts([ 
							'numberposts' => 100,
							'category'    => 5,
						]);
						
						$ir = 0;
						?>

						<?php foreach( $myposts as $post ) :
							setup_postdata( $post );
						?>
						
						<?php if ($ir % 2 == 0) : ?>
							<div class="item-slider">
						<?php endif; ?>

									<div class="item-menu">
										<p>Статьи / <?php the_date(); ?></p>
										<h3><?php the_title(); ?></h3>
										<p><?php the_excerpt( '' );  ?></p>
										<a class="box-post_link" href="<?php echo get_permalink(); ?>">Читать дальше </a>
									</div>
									
						<?php if ($ir % 2 !== 0) : ?>			
							</div>
						<?php endif; $ir++; ?>
					<?php endforeach; ?>

					<?php wp_reset_postdata(); ?>
								
						
					</div>
					<?php 
}
add_shortcode( 'my_elementor_php_output', 'wpc_elementor_shortcode');

[Антон Литвиненко]

barsecky, перед add_shortcode еще одну закрывающую скобку. и убрать лишний открывающий тег слайдера

Answer 1

[Никита Гуреенков]

Попробуйте цикл запустить не в <div class="item-menu">, а на уровень выше.
Попробуйте следующий код:

function wpc_elementor_shortcode( $atts ) {	
    ?>
      <div class="owl-menu owl-carousel  custom-owl-carousel owl-theme">
        <div class="item-slider">
          

          <?php		
            global $post;
            $myposts = get_posts([ 
              'numberposts' => 10,
              'category'    => 5,
            ]);
            if( $myposts ){
              foreach( $myposts as $post ){
                setup_postdata( $post );
                ?>
                <div class="item-menu">
                  <p>Статьи / <?php the_date(); ?></p>
                    <h3><?php the_title(); ?></h3>
                    <a class="box-post_link" href="<?php echo get_permalink(); ?>">Читать дальше </a>
                </div>
                <?php 
                  }
                } else {
               	// Постов не найдено
            }
          wp_reset_postdata(); // Сбрасываем $post								
          ?>
        
      </div>
    </div>
  <?php 
}
add_shortcode( 'my_elementor_php_output', 'wpc_elementor_shortcode');

Если не сработает, то вот так:

function wpc_elementor_shortcode( $atts ) {	
    ?>
      <div class="owl-menu owl-carousel  custom-owl-carousel owl-theme">
        
          

          <?php		
            global $post;
            $myposts = get_posts([ 
              'numberposts' => 10,
              'category'    => 5,
            ]);
            if( $myposts ){
              foreach( $myposts as $post ){
                setup_postdata( $post );
                ?>
                <div class="item-slider">
                  <div class="item-menu">
                    <p>Статьи / <?php the_date(); ?></p>
                    <h3><?php the_title(); ?></h3>
                    <a class="box-post_link" href="<?php echo get_permalink(); ?>">Читать дальше </a>
                  </div>
                </div>
                <?php 
                  }
                } else {
               	// Постов не найдено
            }
          wp_reset_postdata(); // Сбрасываем $post								
          ?>
        
      
    </div>
  <?php 
}
add_shortcode( 'my_elementor_php_output', 'wpc_elementor_shortcode');

Answer 2

[Артем Золин]

Шорткод должен возвращать return, а не выводить echo

function owl_slider_shortcode( $atts ) {	

	// белый список параметров и значения по умолчанию для шорткода
	$atts = shortcode_atts( array(
		'category' => '',
		'numberposts' => 10,
	), $atts );

	$html = '';

	$myposts = get_posts([ 
		'numberposts' => $atts['numberposts'],
		'category'    => $atts['category'],
	]);

	if ( $myposts ) {

	$html .= '<div class="owl-menu owl-carousel custom-owl-carousel owl-theme">';
		$html .= '<div class="item-slider">';
			$html .= '<div class="item-menu">';

				foreach ( $myposts as $post ) {
					setup_postdata( $post );

					$html .= '<span class="post-date">' . get_the_date() . '</span>';
					$html .= '<h3 class="post-title">' . get_the_title() . '</h3>';
					$html .= '<a class="box-post_link" href="' . get_permalink() . '">Читать дальше</a>';

				}

				wp_reset_postdata(); // сбрасываем $post

				$html .= '</div>';
			$html .= '</div>';
		$html .= '</div>';

	}

	return $html;

}
add_shortcode( 'owl-slider', 'owl_slider_shortcode');

Использовать: [owl-slider category="5"]