Customize for Instagram socials

• 

  lolitasharun · Member · Apr 12, 2017 at 7:06 pm

  • Copy link
  • Add topic to favorites

  How can I change the size of photos at Instagram panel,which is at the bottom of my blog, to make it smaller size but more photos at 1 line? Because for now it’s possible just put 3 big photo at 1 line which is looking quite massive.

  The blog I need help with is: (visible only to logged in users)

• 

  musicdoc1 · Member · Apr 13, 2017 at 6:27 am

  • Copy link

  Hi,

  Is that an Instagram Widget in the footer widget area? If so, then I’ll suggest a couple of simple ways to reduce the width of the displayed images in the widget. I have tested either of these, but I’m quite certain that the first one will work. Not as certain about the second one.

  1. According to the Settings section of the Instagram Widget support page, the number of columns determines the size of the images. From that section:

  Layout: The number of columns to display your images. The higher the number of columns, the smaller the images will be displayed.

  So try setting the number of columns to four at the Layout setting of the widget. Five may not work, since there is a limit of four columns, according to the sentence from the Dyad Theme guide quoted in #2. below.

  2. The Dyad 2 theme guide says:

  Dyad 2 has one dynamic widget area in the footer that will display in up to four columns depending on how many widgets are added.

  So if you were to add another widget, even say a text widget without any content, then presumably the width taken up by the Instagram widget would be cut in half. This may result in images half as wide.

• 

  musicdoc1 · Member · Apr 13, 2017 at 7:37 am

  • Copy link

  Correction:

  I haven’t tested either of these

• 

  dcoleonline · Staff · Apr 13, 2017 at 3:37 pm

  • Copy link

  Hi @lolitasharun,

  So this would only be possible through the use of CSS code. You would need to upgrade your site to WordPress.com Premium or Business to do that.

  If you decide to upgrade, I’d recommend setting the number of images to 16, and then adding this line of CSS via My Site > Customize > CSS:

  .wpcom-instagram-columns-3 img {
      max-width: 10%;
  }

  Here’s how that would look on your site:
  https://cldup.com/6PLSjGv2g1.png

  You could also set the number of images to 8 if you just want a single line of images when using that CSS.