To install BX Slider on WordPress requires 3 stages:
1. Create the bxslider.js file and add to Gulp Script Compiler
- Get the js file from the BX Slider GitHub project source
- Copy and paste to a new file in src/js/bxslider.js
- Open gulpfile.js
- add new path to the scripts variable under gulp.task( ‘scripts’ … paths.dev + ‘/js/bxslider.js’
2. Add CSS
- Get CSS from source. Copy and paste to new file sass/assets/bx-slider.scss
- Find and replace all instances of images/ with the name of your images folder (ie img)
- Edit sass/child-theme.scss to include the bx-slider Sass
3. Copy images to Image folder
- Save bx-loader.gif and controls.png from Project source to your images folder
Edit your custom js to trigger
- Add the jQuery code:
$("#testimonial-slider").bxSlider({
adaptiveHeight: true,
auto: true,
pause: 8000,
mode: "fade",
pager: false,
controls: false
});