php - how add Slider Slick before top post? -
how add slick slider front page before top article , slick slider tag , 6 post?
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>'; } }
or see full code here link
thanks
are referring slider? if so, documentation pretty thorough. include following in head tag :
<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
add new slick-theme.css if want default styling
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>
then throw in @ end of code (before closing body tag)
<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>
once have have format each slide so:
<div class="your-class"> <div>your content</div> <div>your content</div> <div>your content</div> </div>
finally initialize slider function in script tag
<script> $(document).ready(function(){ $('.your-class').slick({ setting-name: setting-value }); }); </script>
as location create function creates slides , call function wherever need slider kind of this
function slider($slides) { //slides array of arrays contain whatever information need in each slide $slider = ""; $slidercontent = array(); $slidertop = "<div class=\"your-class\">"; $sliderbottom = "</div>"; for($i = 0; $i<count($slides); $i++) { $slidercontent[] = "<div> use content $slides[$i]</div>"; } $slider = (!empty($slidercontent))? $slidertop.implode("",$slidercontent).$sliderbottom: ""; return $slider; }
Comments
Post a Comment