This video demonstrates how to scale the slideshow block to fit the visible slide

Scale the slideshow block to fit its contents

This time, I'll edit the block display. If we go back to the homepage, you'll notice that the block containing the images is taller than some of the images it is displaying. This is because we checked the box "Make the slide window height fit the largest slide" in the Advanced Action Options. Let's change that and see what happens.

  • Go to "Structure => Views => Featured Content" (admin/structure/views/view/featured_content)
  • Select the "Block" display
  • In the Format section, click "Settings" next to "Slideshow"
  • Scroll down and check the box next to "View Action Advanced Options"
  • Uncheck the box next to "Make the slide window height fit the largest slide"
  • Apply the settings
  • Save the view

Now, when we go back home, the "Featured Content" block will scale larger and smaller to fit the content of the block. Keep this option in mind when you're creating your slideshows, as one option may be more appropriate than the other for your particular use case.

I'm going to go ahead and change this back for now, so that I can more easily demonstrate top and bottom pagers.

Display pager above or below the slides

Right now with don't actually have pager because there are only 5 pieces of content. So we'll go ahead and add a couple more pieces of content.

  • Click on the Configuration => Development => Generate Menu
  • Under Content types uncheck 'Article.Comments: Open
  • And also uncheck 'Basic page. Comments: Hidden
  • Put 5 on number of nodes to like to generate

And now when I go back in the editor view, click 'Block' and you'll see the Pager at the bottom.

The current pager is the standard one created by views. If we click the "2" we'll actually see images 6-10 in our slideshow. A standard slideshow pager will move to the second slide when you click the number 2, not the second set of slides. Let's configure that behavior. Also if you're block is fitting to the largest slide, having the pager at the bottom means that sometimes, there is a good bit of empty space between the slides and the pager. One way to get around this is to display the pager above the slideshow instead of below. So, we'll set it using the "Above" widgets.