For sure. You can do this with some CSS. You can go to the Settings page, "Customize" tab, and scroll down to the "Custom CSS" area and paste in this code:


/* Media queries */

@media all and (max-width: 640px){

  /* Make 3-6 cols into 2 col */

  #sb_instagram.sbi_col_3 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_4 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_5 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_6 #sbi_images .sbi_item{

    width: 50%;

  }

  /* Make 7-10 cols into 4 col */

  #sb_instagram.sbi_col_7 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_8 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_9 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_10 #sbi_images .sbi_item{

    width: 25%;

  }

}


@media all and (max-width: 480px){

  /* Make all cols into 2 cols */

  #sb_instagram.sbi_col_3 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_4 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_5 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_6 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_7 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_8 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_9 #sbi_images .sbi_item,

  #sb_instagram.sbi_col_10 #sbi_images .sbi_item{

    width: 50%;

  }

}


Sounds like you know how media queries work but the yellow highlighted parts are the breakpoints in width of screen and the red numbers are 100 divided the number of columns you would like (50% makes 2, 33% makes 3, etc...).


You might also need this "Custom Javascript" to set the correct height:


jQuery(window).resize(function(){

  jQuery('#sb_instagram .sbi_photo').css('height', jQuery('#sb_instagram .sbi_photo').eq(0).innerWidth() );

});

setTimeout(function(){

jQuery('#sb_instagram .sbi_photo').css('height', jQuery('#sb_instagram .sbi_photo').eq(0).innerWidth() );

}, 500);



Let me know if you need any help with this!