I only need a very simple slider on a single page and so I just want to use Flexslider's most basic HTML options. But I cannot get it to work!

My code is pasted from http://flexslider.woothemes.com/basic-slider-with-custom-direction-nav.html except that I'm using images from my test server. I have triple and quadrupal (pun intended) checked that my styles are correct.

Here is the first bit of HTML:

<div class="flexslider optionset-default">
   <ul class="slides">

I have confirmed that FlexSlider is working by creating a View and adding it as a block.

One clue: My images all disappear on my test page when the flexslider block is active, which suggests to me that the flexslider JS is NOT being loaded normally (I presume it's loading its CSS dynamically).

Without hacking my theme files or adding JQuery code to my theme, is there a way to get FlexSlider to load in this scenario?

2 Answers 2


Just copying HTML-part won't work as the page needs FlexSlider java script. So add it either by calling drupal_add_js() or modifying the html.tpl.php file of your theme.

  • Hmmm. Thing is the JQuery is already loaded (and working). The View I created is working on this page, but the pasted HTML is not. Does the FlexSlider plugin work only in some limited scope?
    – senortim
    Mar 20, 2018 at 21:13
  • Compare the HTML code, especially the lines beginning with <script type="text/javascript", of two pages: one where it is working and the other where it is failing to work. Are the script responsible for flixslider present on both cases or not?
    – AltaGrade
    Mar 20, 2018 at 21:39
  • On a page without a View loaded, there is no FlexSlider JS added. (Although it seems from the FlexSlider Drupal module that it should load on all pages.) When block is present, I get this: <script type="text/javascript" src="http://ipen-test.clients.clerestory.com/sites/all/libraries/flexslider/jquery.flexslider-min.js?p5t7h9"></script> Here are the two DIVs (mine is the first one): <div class="flexslider optionset-default"> <div id="flexslider-1" class="flexslider optionset-default"> Seems like my first one should be working, no?
    – senortim
    Mar 20, 2018 at 22:46
  • Please stick with questions asked. Do not tell whether view is loaded or block is preset or not, because it is confusing. Can you just compare two pages: one which is working and the other which is not working and tell which one has the javascript and which one does not?
    – AltaGrade
    Mar 20, 2018 at 23:02
  • It is the same page. As I said, it is working on one part of the page, and not on the other.
    – senortim
    Mar 22, 2018 at 0:06

I ended up using JS Injector to add the FlexSlider configuration code to my page and a block with a tag to add the FlexSlider library (adding it to the body, Drupal escaped the whole thing).

As I said in my question, I wanted a solution that didn't require modifying the theme. This is clunky, but it worked.

Too bad the Flexslider module doesn't add this simplest implementation. But I'll definitely use it on sites where I have nodes that correspond to slides.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.