[LeFrancLouis]

Could you please tell me how social media feed footer works ? I can’t see my instagram picture.
I did this : http://thegoodby.com/wp-content/uploads/2016/06/Capture-d’écran-2016-06-23-à-19.41.58.png
Even if I tried “https://www.instagram.com/_bylouis/”, it does not work.

Thanks !

[serkan]

Hi LeFrancLouis,
You can check out this related topic for Instagram;
http://www.pixelwars.org/forums/topic/widgetized-sidebar-complete-site-change/
You can run that plugin and use those custom css codes, if you have any issue, i can provide you extra custom css code.
Thanks

[LeFrancLouis]

Hi, I just see you have a new instagram widget that I love. (6 pics aligned in footer) How to enable it ? Do I have to do an update ?

With the fix you gave in the related topic you indicated me, I was able to do that (check the footer in my blog : thegoodby.com)

Thanks !

[serkan]

Hi LeFrancLouis,
If you want to use that widget in the footer, you can use the custom css code like this;
You set the 3 images in a column if you want to increase the number then you can check the plugin’s settings.

.null-instagram-feed ul li { display: inline-block; }

Thanks

[LeFrancLouis]

Hi serkan,

Sorry but I don’t understand. If I sum up, refering to your 1st answer
I installed wp-instagram-widget plugin
In the widget I set 6 photos and thumbnail size
I wrote this custom CSS :


.null-instagram-feed ul li { display: inline-block;
.null-instagram-feed ul {
padding: 0; margin: 0; overflow: auto;
}
.null-instagram-feed ul li {
width: 33%; float: left; padding-right: 0px;
}


But it still not the same results as your demo page. (link : thegoodby.com)

Thanks a lot for your help !

[serkan]

Hi LeFrancLouis,
You can add this custom css code as well.

.footer-instagram ul li { width: 16%; display: inline-block; }

Thanks

[LeFrancLouis]

Serkan,

Thank you for your quick reply but still not working. I add the whole following code :

.null-instagram-feed ul li { display: inline-block;
.null-instagram-feed ul {
padding: 0; margin: 0; overflow: auto;
}
.null-instagram-feed ul li {
width: 33%; float: left; padding-right: 0px;
}
.footer-instagram ul li { width: 16%; display: inline-block; }

[serkan]

.null-instagram-feed ul li { display: inline-block;

where is the close mark ?

If you don’t close the code then below codes won’t work =)
It should be like this;
.null-instagram-feed ul li { display: inline-block; }

[LeFrancLouis]

Haha thanks a lot, I did not know that. So i closed it but this was not aligned so I changed “left” by “center” and there was no margin so I tried “5px” after “padding-right” and it works ! But now, there is a last thing, your pics are more smaller than mine :) How to do that ?

My code:
.null-instagram-feed ul li { display: inline-block; }
.null-instagram-feed ul {
padding: 0; margin: 0; overflow: auto;
}
.null-instagram-feed ul li {
width: 33%; float: center; padding-right: 5px;
}
.footer-instagram ul li { width: 16%; display: inline-block; }

[serkan]

Our images 144px and yours 145px. I guess it is not a big problem =) You just gave the 5px padding that is why size looks different for you. We should live it like this. What do you thnik ?

[LeFrancLouis]

Serkan,

From my computer it is not about 1px, mines are way bigger. I did a screenshot to show you : http://thegoodby.com/wp-content/uploads/2016/06/header-difference.png

I would like to have my image the same size than yours :/ I thought that it would me more easy, that you just had to get me the same code you have on your demo but it should more complicated.

Thanks a lot for your help !

[LeFrancLouis]

I solved the problem ! It was width, 11% is good ;) Thanks a lot

[serkan]

Ah okay, good luck =)