WordPress.org

Ready to get started?Download WordPress

Forums

Instagram for WordPress
Only 1 instagram photo is displaying. (20 posts)

  1. kmc212
    Member
    Posted 1 year ago #

    Only 1 instagram photo is displaying. The config is set to display 12 photos. What can be done to fix the issue? My web site with the issue http://nycfreeconcerts.com"

    http://wordpress.org/extend/plugins/instagram-for-wordpress/

  2. somnaom
    Member
    Posted 1 year ago #

    I have the same problem. I can see you solved it. How?

  3. Theme 7 dot net
    Member
    Posted 1 year ago #

    I have the same issue, I think it is something to do with 3.4 :)

  4. jjtien
    Member
    Posted 1 year ago #

    I had the same issue, stuck on 1 image, I randomly installed this plugin for another instagram plugin and it started working again! It adds Highslide for image enlargements, and creates slideshows of attached images using the Cycle plugin for jQuery.

    http://wordpress.org/extend/plugins/highcycle/

  5. bmspsi
    Member
    Posted 1 year ago #

    I'm having the same issue.. Its starts working but after a while it stops. Tried several installations, different hosts and everything. One of my themes seems to work better with it (arras) the others jam within a time frame.

    Good to know you are working on it, this is by far the best instagram plugin and I use it a lot! If its possible I would like to make a donation to help its development. (I can't afford much, but at least might buy you a lunch or something =))

  6. bholloman
    Member
    Posted 1 year ago #

    stopped working for me too on 2 of the sites i use it on. just doesn't show up. pretty sure it was the wp 3.4 update. any help would be great!

  7. thelimericklane
    Member
    Posted 1 year ago #

    I am having the same problem and the highcycle plugin didn't work for me.

  8. dino golman
    Member
    Posted 1 year ago #

    haha :) that's funny.

    wp-content/plugins/instagram-for-wordpress/wpinstagram.css:

    ul.wpinstagram li{
    	display: none;
    }
    ul.wpinstagram li:first-child {
    	display: block;
    }

    That means, it displays only one image. Just remove these lines and everthing will work out just fine

    And you may want to remove width and height limitation, because it's not flexible for custom sizes:

    wp-content/plugins/instagram-for-wordpress/wpinstagram.php (line 141):

    from

    echo '<ul class="wpinstagram" style="width: '.$imagesize.'px; height: '.$imagesize.'px;">';

    to

    echo '<ul class="wpinstagram">';
  9. dino golman
    Member
    Posted 1 year ago #

    I was wrong with my last post. I think problem is about other javascript codes. Just check your browser console if any JS code gives error.

    I hope this helps

  10. rafa-bsb
    Member
    Posted 1 year ago #

    Hi,
    I just installed the plugin, and only 1 image is showing.
    None of the previous tips worked.

    Did someone find a solution for this??
    I'm using the latest version of the plugin.

    Thanks!

  11. bsfajardo
    Member
    Posted 1 year ago #

    I had the same issue (only one Instagram picture was shown), and I resolved with these two simple lines in my CSS file:

    .wpinstagram { height: auto !important; width: 100% !important; }
    .wpinstagram li { display: inline-block !important; }

    I hope that helps!

  12. jimolina
    Member
    Posted 1 year ago #

    Change the CSS does not work, because the error is not in the styles. It's on the way to invoke the cycle function and its assignment to the element you want to animate.

    They should change this:

    jQuery(document).ready(function($) {
    	$("#<?php echo $this->id; ?> ul").cycle({fx: "fade", timeout: <?php echo $cycletimeout; ?>});
    });

    By this:

    jQuery(document).ready(function($) {
    	$(".wpinstagram").cycle({fx: "fade", timeout: <?php echo $cycletimeout; ?>});
    });
  13. bsfajardo
    Member
    Posted 1 year ago #

    Oh, now I can see your point, jimolina.

    But what I was trying to do was to show more than one picture at the same time, like a small gallery. I didn't want to show one picture at a time with the cycle / fade animation.

    Anyway, I think both solutions are fine for their purposes :)

  14. jimolina
    Member
    Posted 1 year ago #

    Jeje that is right bsfajardo, if you dont want animation, with only change the CSS is enough.

  15. new2dascene
    Member
    Posted 11 months ago #

    @bsfajardo Would you be able to tell me where in the code did you add those two lines to? Trying to resolve this issue but i cant find the lines im supposed to replace with the ones youve fixed.

    thanks.

  16. new2dascene
    Member
    Posted 11 months ago #

    hopefully you can remember after 4 months lol

  17. bsfajardo
    Member
    Posted 11 months ago #

    Hi, @new2dascene!

    These lines must be added to your theme's style.css file. Don't need to replace any line of code, just insert these two lines at the end of your stylesheet.

    Cheers!

  18. liloubond
    Member
    Posted 11 months ago #

    Hi !

    I try solution of @bsfajardo and @jimolina :
    CSS + wpinstagram.php

    My animation doesn't work.

    One image is showing.

    Please help... :)

    http://www.queen-s.com/

  19. bsfajardo
    Member
    Posted 11 months ago #

    Hi, @liloubond.

    For some reason (maybe instagram plugin configuration) all of your instagram
    <li> elements (representing each individual photo) is using absolute positioning, and a lot of them is hidden (display: none).

    I don't know why your gallery is showing like that, but take a look at this site where the same plugin was used, showing several photos at the same time: http://www.chamomila.com.br/

    I hope that helps!

  20. seetiggergo
    Member
    Posted 10 months ago #

    You have to do a few things to make this work...

    Lets start with the wpinstagram.php file:

    Step 1: Comment out or delete the following (This is the cycle effect javascript and the one that uses absolute positioning on the list item elements)...

    wp_enqueue_script("jquery.cycle", $this->wpinstagram_path."js/jquery.cycle.lite-1.5.min.js", Array('jquery'), null);

    Step 2: Change this...

    echo '<ul class="'.$cls .'" style="width: '.$imagesize.'px; height: '.$imagesize.'px;">';

    To This (This removes the sizing from the element and allows to go full width and height...

    echo '<ul class="'.$cls .'">';

    Step 3: Comment out or remove this function (It is not needed since we are removing the cycle effect...

    <script>
    jQuery(document).ready(function($) {
    	$("#<?php echo $this->id; ?> ul").cycle({fx: "fade", timeout: <?php echo $cycletimeout; ?>});
    });
    </script>

    Now on to the wpinstagram.css file:

    Replace the ul.wpinstagram li class with the following. (Tweak as needed for your application.)

    ul.wpinstagram li{
    	width: 75px;
    	height: 75px;
    	float: left;
    	clear: right;
    	padding: 5px !important;
    }

    That should do it. Now the images should display in a grid rather than a single image with the fade in/out effect.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic