Image slideshows with Drupal 7
07 June 2012
We are frequently tasked with creating custom image slideshows for Drupal sites.
We work mainly in Drupal 7, and for simple home page sliders we like to use this combination;
- New content type called Slide
- Use Link Image Field and add that as a field in your Slide content type. Allow for unlimited images. This will allow you to link your slides to custom URLs and add titles, rel attributes etc.
- A View (using Views) showing all results for nodes of type "Slide". Use fields display in combination with Nivo or Slideshow.
- Try either Views Nivo Slider or Views Slideshow. We have had more luck with Views Slideshow.
- If using Views Slideshow, also consider Views Slideshow Configurable Controls, which enables next/pause/previous icons instead of just text links.
- Create a new Slide node - let's call it "Home Slides". Add as many pictures as you need, and provide links for them as needed (thanks to Link Image Field). Save.
- Edit your view and add a new display page or block. Add a filter for "nid" and restrict it to only the node ID of the "Home Slides" node you just created. Since we are including multiple images within a single node, we do not need to show multiple nodes. In the image field's settings make sure to NOT have it show multiple field results in a single row. We want them as separate rows so each photo will be separate.
- Add sorting as needed. Nodequeue isn't an option here, but you don't need it since you can drag and drop the images when editing the node.
- Your node is now essentially an image gallery exposed to Views. You could now also theme your Slide nodes to show thumbnail images in a gallery format, but you don't need to display the node. We only need it for Views.
