adrianengine / jquery-spectragram Goto Github PK

i have tried many times but still no success and have no idea it's not showing here is the link for code https://jsfiddle.net/u5waey15/

Hi!!! Help Please!!!

How can use bootstrap with spectragram to change the style of the images on my website?

THANKS for your help!

Apparently this plugin stopped working since Instagram changed their data names.

You now get the error results.data is undefined. Has there been an update/fix for this script yet?

It won't resize on mobile devices. I have a style-mobile.css that resizes everything else accordingly but spectragram stays the same size as if it were being viewed on a desktop. How can I get it to resize if viewed on a mobile device?

Hi there, can anyone imagine why i have instagram images at every 'ul'?
I thought that the $('ul').spectragram … only affects the <ul class="spectragram" …
but at my page it seems that every ul on an page gets instagram images added … same if i use div instad of ul …
Any ideas? Thanks in advance

my code:
$('ul').spectragram('getUserFeed',{
query: 'fuenfseenland.de',
max: 6,
size: 'medium',
wrapEachWith: '

Instagram feed consistently works with new accounts; however, I ran into an issue where the feed often won't be retrieved if the account has undergone a name change. More than 90% of the time the feed retrieval fails in this case.

Expected behavior

Expect to show photos from tibet_water profile.

Actual behavior

Got an error: Error: the username tibet_water does not exist

Steps to reproduce this behavior

Successfully got accessToken and clientID from a new registered Instagram application using redirect URI on my localhost, written this:

$('#instagram').spectragram('getUserFeed', {
    query: 'tibet_water',
    max: 6
})

The issue is that I can show my own photos from grawl profile if I set query: 'grawl', but not other users. Nor 'facebook', nor any other. Just only one profile that I used to register Instagram application.

("#instagram-feed").spectragram("getUserFeed",{query:"madnessband",max:200})
With this is just showing 20 pics from my user feed. is there anyway to load all the pics from that user?

If you weren't aware, your website has a woman exposing her breasts right in the header of the jquery-spectragram website.

I installed the plugin and works fine, but I have a question, could I show the user profile image and name?

You could write me in spanish too.

thanks you

Hi
I am currently employing a theme on GHOST that already has Spectagram pre loaded. I just have to change my Client Id and Access token for my feed to show. Its supposed to be that simple.
I followed the steps mentioned on the instagram API portal, received the details, copied it into the code where client id and access_token have to be copied into, but the feed just doesnt show.

When i revert to the default settings, the theme developers instagram feed is visible. But just not mine.

Any help on this will be appreciated. My blog has been delayed by a week only coz i cant configure the damned instagram widget.

Hi,
Thanks for this cool extension. I tried to use it for a website but I don't get any result. I created the access token and entered also the client ID in the parameters. But I still don't get any instagram image on my website. The access token has been created today, in the instagram BE I see the access for this website. The page is in an subdirectory, might this be the problem or is the URI wildcard for all other pages?
When you open https://www.fab-design.com/genf-autosalon-2017/index_de.html you will see the error in the console.

Thanks,
Florian

I tried and could not make it work. Can you share a full example ?

Hi, thank you for the plugin. It's possible with CSS make a slideshow with autoplay with spectragram? If yes, can you help with this?

Is there a way to fetch the title of the photo from instagram? That way we can add the 'Description' below/above the photo.

Can you provide that feature?

Hi,

I am trying to use multiple methods to display Instagram images from a user with a specific tag, is this possible using Spectragram?

Many thanks in advance,
Lewis.

If a picture's caption is empty this error occurs, because such case is not expected:

results.data[i].caption.text

so if the caption is returned null this error occurs.
Thus may I suggest to put an empty title if such case would happen

Expected behavior

I tried adding the code below:
jQuery.fn.spectragram.accessData = { accessToken: '[your-instagram-access-token]', clientID: '[your-instagram-application-clientID]' };

Actual behavior

The console returns the following error.

Uncaught Error: Method [object Object] does not exist on jQuery.spectragram

Steps to reproduce this behavior

I am using jQuery version 1.13

Do you know what may be wrong?
Thanks in advance.

Hovering over images in the feed displays their title. If the title has an apostrophe the title gets cut short.

Eg: "Don't miss out!" gets displayed as "Don"

i get this

http://prntscr.com/iac8l4

Hi, in the ajax part is there a way to trigger the fetch method after a period of time, so i can performed the instagram effect, fadeIn out on each image after x mins / sec.

This error began happening recently. Was working without an issue for months beforehand.

I searched this error and any solution works for me :(

This is what im doing: https://jsfiddle.net/nbennfw9/

• Spectragram.js is correctly linked
• The accesToken and clientID in the jsfiddle are ficticious but in my real code are OK.

Whats the problem? :(

Hello,

The media of other users is no more working. Is there any workaround for this?

Instagram doesn't allow to access the public_content scope for this usecase.

Expected behavior

Instagram feeds showing on demo site: http://spectragram.js.org

Actual behavior

Instagram feeds not showing due to API change, error 429 for each in console.

Steps to reproduce this behavior

View Demo Site. Also note that after registering a new client ID and Access Token to get past the 429 error in a local install, I'm presented with the following JS error.

Hope this helps in any way mate!

getUserFeed doesn't work with the minified file.
self.accessData.accessToken
should say
t.accessData.accessToken

I have a client uses has an Instagram feed on the front page of their web site and now wants to be able to feed photos from multiple Instagram users. Is this possible?

Expected behavior

Show latest post of our Instagram account augeautogestion.

Actual behavior

Does not show nothing on Chrome (Mozzilla and Safari worked good)
https://imgur.com/a/bjDvb

Steps to reproduce this behavior

Load our page on Chrome augeac.org

I'm sorry, I'm not very familiar with github, maybe this should go elsewhere, but i enhanced the script by new method for getting the photos that the user liked.

I use this with my website's Instagram account, I log-in, like selected photos and that way the gallery on my website is created/updated..

        getUserLikedFeed: function () {
            var self = this,
                getData = '/users/self/media/liked/?access_token=' + self.accessData.accessToken + '';
            self.fetch(getData).done(function (results) {
                if (results.data.length) {
                        self.display(results)
                } else {
                    $.error('Spectagram.js - Error')
                }
            })
        },

Great plugin! I've tried a couple jQuery/Instagram plugins and definitely had the most success with this one. I do have a suggestion for a future enhancement: creating a new method for the /locations/search endpoint. The query would look something like this: query: 'lat=48.858844&lng=2.294351'.

I attempted to do this on my own but my knowledge of js is limited and kept returning an Uncaught TypeError... would be great to see this in a future release.

jQuery.fn.spectragram.accessData = {
    accessToken: '[your-instagram-access-token]',
    clientID: '[your-instagram-application-clientID]'        
};

$('div').spectragram({
    query: 'converse',
    max: 14,
    size: 'big',
    wrapEachWith: '<p></p>'}
});

-- you have to remove one bracket

Also - <script type="text/javascript" src="js/spectragram.js"></script> - you have to include before </head>, not </body>

Hi, is it possible to get pictures from multiple hashtags at the same time?

Ie.

$('ul').spectragram('getRecentTagged',{
query: 'converse','nike','adidas'
});

Thanks!

Will there be support for the new video feature? When I'm pulling images by tag, it stops fetching images if there is a video, then only the images before the video will show. I'm using the tag dehistoriske.

When the dom is ready, this error message occurs.
"Uncaught TypeError: Cannot read property 'length' of undefined " spectagram.js:48

    getRecentTagged: function () {
        var self = this,
            getData = '/tags/' + self.options.query + '/media/recent?client_id=' + self.accessData.clientID + '&access_token=' + self.accessData.accessToken + '';
        self.fetch(getData).done(function (results) {
            if (results.data.length) {
                self.display(results)
            } else {
                $.error('Spectagram.js - Error: the tag ' + self.options.query + ' does not have results.')
            }
        })
    },

Hi,

I am using your plugin (which is awesome btw) for a site I am building. I have seen that people have been asking you about loading more than 20 images at a time but this was about a year a go.

I was wondering if you have an update on this at all?

Thanks.

Hola adrian, excelente el plug con instagram, lo unico q le faltaria es agregarle un "cargar mas fotos" y seria perfecto, como seria la modificacion para llamar al results.pagination.next_url que devolveria en la linea 83/84. ya que te devuelve directamente el proximo url.

Gracias.

I looked to api and stripped .url on rows 114-122 like this:

                    if (setSize == "small") {
                        size = results.data[i].images.thumbnail;
                    }
                    else if (setSize == "medium") {
                        size = results.data[i].images.low_resolution;
                    }
                    else {
                        size = results.data[i].images.standard_resolution;
                    }

Hello,
if I add my username, this plugin show me an other user feed... if I end my username with a . it display my correct feed... but I think this is an error!!! how to fix this?
Thank you!

If a caption is missing, the getUserFeed-method exits with cannot read property "text" of undefined

The plugin has been working brilliantly for a couple of months now. However, all of a sudden today, we're getting the following error:

TypeError: undefined is not an object (evaluating 'n.data.length')
j (jquery.min.js, line 2)
fireWith (jquery.min.js, line 2)
x (jquery.min.js, line 4)
onreadystatechange (jquery.min.js, line 4)

The site that is experiencing the issue is Pretty Little Clippies. I've verified that it is occurring on multiple browsers (Chrome / Safari), and across multiple continents, eliminating any CDN / connectivity issues.

Any idea why this might be happening all of a sudden? Something at Instagram's end blocking API access?

Thank you.

When using the getRecentTagged call it is only returning 4 images with the specified hashtag but the Instagram account has 10 images that use it.

Is there only a set amount of images it will work back through?

I have my code set up like this...

    jQuery.fn.spectragram.accessData = {
        accessToken: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
        clientID: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'
    };

    $('.instafeed').each(function() {
        $(this).children('ul').spectragram('getRecentTagged', {
            query: $(this).attr('data-user-name')
        });
    });

Hi everyone, I have this message:
Uncaught TypeError: Cannot read property 'length' of undefined
at Object. (spectragram.min.js:1)
at j (jquery-1.11.3.min.js:2)
at Object.fireWith [as resolveWith] (jquery-1.11.3.min.js:2)
at x (jquery-1.11.3.min.js:5)
at HTMLScriptElement.b.onload.b.onreadystatechange (jquery-1.11.3.min.js:5)

And I don't know how to fix it, What I have to do? Thks!

Hi,

I'm running the example and I'm getting after done!

`This user account is private or doesn't have any photos.`

and console saying

Error: Spectragram.js - Error: the tag converse does not have results.

code :

/**

• Instagram (v1.0)
• GoToLoop (2018-Jan-17)
• https://Forum.Processing.org/two/discussion/25961/instagram-api-p5js#Item_3
  */

"use strict";

jQuery.fn.spectragram.accessData = {
accessToken: 'token',
clientID: 'id'
};

function setup() {
noCanvas();

$(createElement('ol').elt).spectragram('getPopular');

$(createDiv('').elt).spectragram('getRecentTagged', {
query: 'converse',
max: 14,
size: 'big',
wrapEachWith: '

I get this error in the console:

Uncaught TypeError: Cannot read property 'accessToken' of undefined
i.getUserFeed
(anonymous function)
x.extend.each
x.fn.x.each
jQuery.fn.spectragram
(anonymous function)
c
p.fireWith
x.extend.ready
q

Here is the site:
http://charity-walk.co.uk

Hello,

I receive the below error message:
Uncaught TypeError: Cannot read property 'length' of undefined

Help please :)

http://codepen.io/anon/pen/eWjbxw

spectragram-photos-with-description (1).zip

Hi Adrian!

I try your code, but the "getUserFeed" dont Work =(

File > https://www.dropbox.com/s/pfb56sgax6autg9/demo.html

What is wrong? Thank you for your time.

JD

I wish there was an option to enable, disable or customize the titles of the images.Because if we show these pictures in the side by placing the pointer over an image bar it shows us a title that covers the entire page and looks unsightly

In browser console:

Uncaught Error: Spectragram.js - Error: the tag tbt does not have results.
at Function.error (jquery.js:247)
at Object. (spectragram.min.js:1)
at j (jquery.js:3148)
at Object.fireWith [as resolveWith] (jquery.js:3260)
at x (jquery.js:9314)
at HTMLScriptElement.b.onload.b.onreadystatechange (jquery.js:9829)

My code:

<script type="text/javascript" src="spectragram.min.js"></script>

<script>
    $(document).ready(function() {
        var Spectra = {
          instaToken: '***',
          instaID: ' ***',

          init: function () {
            $.fn.spectragram.accessData = {
              accessToken: this.instaToken,
              clientID: this.instaID
            };

            $('.Feed').spectragram('getRecentTagged',{
              max: 12,
              query: 'tbt',
              wrapEachWith: '<div class="photo">'
            });
          }
        }

        Spectra.init();
    });
</script>

No images are loading from instagram in recently including from your website http://spectragram.js.org/

Kindly check, Please.

Hello,
Is it possible to show more than 20 pics ? I just set the max to 40 but it only shows 20.
Thanks.