header部に「jquery.min.js」、「jquery.bxslider.min.js」及び「jquery.bxslider.min.css」を呼び込む記載をします。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.15/jquery.bxslider.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bxslider/4.2.15/jquery.bxslider.min.css" rel="stylesheet" />
HTML
<div class="bxslider">
<div><img src="0.png"></div>
<div><img src="1.png"></div>
<div><img src="2.png"></div>
<div><img src="3.png"></div>
<div><img src="4.png"></div>
<div><img src="5.png"></div>
</div>
jQuery
$(function() {
$('.bxslider').bxSlider({
auto: true,
autoControls: true,
speed:500,
stopAutoOnClick: true,
pager: true,
});
});