@mvr1976
Учу html, css, js

Как вывести такую HTML-разметку слайдера?

Добрый день всем!
Хочу вывести slick - слайдер без помощи плагина вордпресс.
Нужна такая разметка:
<div class="wood-slider slider-for">
                      <div class="wood-slide"><img src="assets/img/120-5.JPG" alt="#"></div>
                      <div class="wood-slide"><img src="assets/img/120-1.JPG" alt="#"></div>
                      <div class="wood-slide"><img src="assets/img/120-2.JPG" alt="#"></div>                  
                </div>

                <div class="wood-slider slider-nav">
                      <div class="wood-slide"><img src="assets/img/120-5.JPG" alt="#"></div>
                      <div class="wood-slide"><img src="assets/img/120-1.JPG" alt="#"></div>
                      <div class="wood-slide"><img src="assets/img/120-2.JPG" alt="#"></div>                  
                </div>

Пытаюсь ее вывести таким образом:
function gallery_inner($attr, $text=''){	
	$img_src = explode(",", $attr['ids']);	
	$return = '<div class="wood-slider slider-for">';	
	foreach($img_src as $item){		
		$img_url = wp_get_attachment_image($item, 'full');
		$return .= '<div class="wood-slide">' .$img_url. '</div>';
		$return .= '</div>';
	}
	echo $return;

	$return_tiny = '<div class="wood-slider slider-nav">';
	foreach($img_src as $item){
		$img_url = wp_get_attachment_image($item, 'full');
		$return_tiny .= '<div class="wood-slide">' .$img_url. '</div>';
		$return_tiny .= '</div>';
	}	
	echo $return_tiny;

}
add_shortcode('slider_120', 'gallery_inner');

В результате картинки выводятся, но разметка неверная и слайдер не работает, пробовал все переменные обработать в одном цикле, но тоже без толку.
Подскажите, как сделать, заранее благодарен!
  • Вопрос задан
  • 570 просмотров
Пригласить эксперта
Ответы на вопрос 1
@niceandriyanov
Ошибка в коде:
function gallery_inner($attr, $text=''){	
  $img_src = explode(",", $attr['ids']);	
  $return = '<div class="wood-slider slider-for">';	
  foreach($img_src as $item){		
    $img_url = wp_get_attachment_image($item, 'full');
    $return .= '<div class="wood-slide">' .$img_url. '</div>';
  }
  $return .= '</div>';
  echo $return;

  $return_tiny = '<div class="wood-slider slider-nav">';
  foreach($img_src as $item){
    $img_url = wp_get_attachment_image($item, 'full');
    $return_tiny .= '<div class="wood-slide">' .$img_url. '</div>';
  }	
  $return_tiny .= '</div>';
  echo $return_tiny;

}
add_shortcode('slider_120', 'gallery_inner');


В цикле у тебя появлялось много закрывающих </div>
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы