Hey cwfeldmann,
Unfortunately the Instagram api will only send the posts from newest to oldest. You would have to load all of the posts in the feed to get to the very last post.
I have an idea for your specific request, however. You could create an Instagram account with just the one post that your client wants to show up first and then combine the two feeds with some javascript.
Here’s how it would work:
1) Use these two shortcodes in the area you want to display the feed:
[instagram-feed class=”sbdonorfeed” id=46785481 num=1]
[instagram-feed class=”sbmainfeed” id=28902942 num=7]
2) Change the bolded ids to whatever ids you would need to use. The first one being the id of the new account with the single “sticky post”.
3) Add this javascript on the Settings page, “Customize” tab, “Custom Javascript” area:
var sbdonor = jQuery('.sbdonorfeed').find('.sbi_item');
jQuery('.sbmainfeed').find('#sbi_images').prepend(sbdonor);
jQuery('.sbdonorfeed').remove();
You can adjust the numbers and columns to get the feed looking like you would need to. This example works for two rows of 4 posts.
Let me know if you have any questions about this. Hopefully this will work for you!
Craig’s idea would work, but I wanted to throw out an alternative suggestion which wouldn’t require you to create a separate Instagram account. You could download the image from Instagram, upload it to your website, and then add a custom post to the beginning of the feed which uses that image.
To do this, just add the following to our plugin’s Custom JavaScript section:
$('#sbi_images').prepend('<div class="sbi_item"><a class="sbi_photo" href="https://www.instagram.com/linktopost" target="_blank" style="opacity: 1;"><img src="http://yoursite.com/linktoimage.jpg"></a></div>');
You’d need to change the link URL to go to the correct post on Instagram, and the image URL to link to the image.
Hope you’re having a happy Easter weekend!
John
Used the second method. Works like a charm. Thank you both for the two suggestions.
For others interested in further testing on this, the second method can be repeated it seems as many times as you need it to set any number of constant images at the top.
As I’m not a paying member, I’m unable to comment on the Lightbox functionality of this method but I do hope to test this out someday with a client in the future.
Great Plugin SmashBalloon, keep it up. Cheers and hope your Easter went well also.
Whoops! I just noticed that every time “Load More” is hit, it duplicates the creation of the specified image.
Working on a CSS workaround to hide it.
Okay so I change the Code from what you had provided to:
$('#sbi_images').prepend('<div class="sbi_item niceguys_constant1"><a class="sbi_photo" href="https://www.instagram.com/linktopost" target="_blank" style="opacity: 1;"><img src="http://yoursite.com/linktoimage.jpg"></a></div>');
The key was in the DIV CLASS=”ski_item niceguys_constant1“
After adding that class I was able to use CSS to hide the extra images by stating:
.niceguys_constant1{
display:none !important;
}
.niceguys_constant1:first-of-type{
display:inline-block !important;
}
Cheers
Awesome, glad to hear that solution worked for you, and thanks for sharing the CSS fix you used to solve the replication problem. I’ll make a note of this in case anyone else wants the same functionality in future.
No obligation of course, but if you like the plugin and support you received and feel like leaving a super-quick review then it’s always hugely appreciated!
Let us know if you have any other questions, and I hope you have a good week.
John
