Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Craig at Smash Balloon

    (@craig-at-smash-balloon)

    Hey Ching,

    There are a few things that could be the issue. Sometimes themes will set anchor elements to display inline in mobile but our plugin needs them set as inline-block elements.

    There are also situations where other plugin’s javascript interferes or the sb-instagram.js file is not included on the page when in mobile.

    If you sent me a link to your page I could help you figure out exactly what might be going on.

    – Craig

    Thread Starter chingchingching

    (@chingchingching)

    Hi Craig,

    here is my link: https://www.cincinecincin.com

    thank you in advance.

    Ching

    Plugin Author Craig at Smash Balloon

    (@craig-at-smash-balloon)

    Hello again Ching,

    It looks like the problem is that the element that contains the feed is set to be very wide no matter what device is being used. You can try changing this with some custom CSS. Go to the Settings page for Instagram Feed, click on the “Customize” tab, scroll down to the “Custom CSS” area and paste this in:

    #first_footer {
      max-width: 100%;
    }

    That should fix the issue. Let me know if you need any more help with this!

    – Craig

    Thread Starter chingchingching

    (@chingchingching)

    It works perfectly Craig, thank you! But the pictures are very small on mobile, is there any way to make them bigger in image size, or less gap between each image or expand the images to be wider than default footer space on mobile?

    thank you again!
    Ching

    Plugin Author Craig at Smash Balloon

    (@craig-at-smash-balloon)

    Hey Ching,

    There are a few things you can do. It looks like you have disabled our default mobile layout which would change the feed to a single column when the device is small. You can re-enable the mobile layout by going to the “Customize” tab on the settings page and scrolling down to the “Layout” tab and unchecking the “Disable Mobile Layout” box.

    If you would like more than one column, you could go to the “Custom CSS” area on that same tab and paste in this code:

    @media (max-width: 480px) {
    #sb_instagram.sbi_col_6 #sbi_images .sbi_item {
      width: 50%;
    }
    #sb_instagram.sbi_col_6.sbi_disable_mobile #sbi_images .sbi_item {
      width: 50%;
    }
    }

    This will create 2 columns but you can make it into three or more by changing the “50%” to “33%”, “25%”, or so on.

    Thread Starter chingchingching

    (@chingchingching)

    Thank you very much Craig and for the great plugin as well!

    Ching

    Plugin Author Craig at Smash Balloon

    (@craig-at-smash-balloon)

    No problem! I am glad we could get everything working well for you. No obligation, but we always appreciate reviews. Let me know if you need anything else!

    Many thanks,

    Craig

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘not working on mobile version’ is closed to new replies.