как добавить Slider Slick перед верхним постом?

Как добавить скользящий слайдер на главную страницу перед верхней статьей и скользкий слайдер с тегом и 6 постами?

if ( have_posts() ){
while ( have_posts() ){
the_post();

if( $i == 0 && $paged == 1 ){

$t_dyn_opt = $dynamic_options;
$t_dyn_opt['modal'] = '13';
$t_thumb = 'large';

$list_out .= '<div class="row">';
$list_out .= '<div class="col-sm-12">';
$list_out .= '<div class="newser-block-grid single-top">';
$list_out .= newser_common_block_grid_generate($t_thumb, $t_dyn_opt);
$list_out .= '</div>';
$list_out .= '</div>';
$list_out .= '</div>';
$i = 1;

}else{

$list_out .= '<div class="row">';
$list_out .= '<div class="col-sm-12">';
$list_out .= '<div class="newser-block-list big-list">';
$list_out .= newser_common_block_big_list_generate($thumb_grid, $dynamic_options);
$list_out .= '</div>';
$list_out .= '</div>';
$list_out .= '</div>';
}
}

или посмотрите полный код здесь ССЫЛКА НА САЙТ

Спасибо

-2

Решение

Вы имеете в виду это ползунок? Если это так, документация довольно тщательная. Просто включите в заголовок тега следующее:

<link rel="stylesheet" type="text/css" href="slick/slick.css"/>

Добавьте новый slick-theme.css, если вы хотите стиль по умолчанию

<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>

Затем добавьте это в конец вашего кода (перед закрывающим тегом тела)

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="slick/slick.min.js"></script>

После этого вам нужно отформатировать каждый слайд следующим образом:

<div class="your-class">
<div>your content</div>
<div>your content</div>
<div>your content</div>
</div>

Наконец, инициализируйте слайдер с этой функцией в теге скрипта

<script>
$(document).ready(function(){
$('.your-class').slick({
setting-name: setting-value
});
});
</script>

Что касается местоположения, я бы создал функцию, которая создает ваши слайды, а затем просто вызываю эту функцию везде, где вам нужен ваш слайдер, вроде этого

function slider($slides) {

//slides is an array of arrays that contain whatever information you need in each slide

$slider = "";
$sliderContent = array();
$sliderTop = "<div class=\"your-class\">";
$sliderBottom = "</div>";
for($i = 0; $i<count($slides); $i++) {
$sliderContent[] = "<div> use the content from $slides[$i]</div>";

}

$slider = (!empty($sliderContent))? $sliderTop.implode("",$sliderContent).$sliderBottom: "";
return $slider;

}
0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]