Okay
  Public Ticket #1221718
Instagram import
Closed

Comments

  • Ronan started the conversation

    I would like to be able to import instagram post based on a hashtag rather than only the latest.

    For example:

    - Home page: last instagram post

    - Food page: last instagram post with hashtag #food

    - Any page: last instagram post with specific hashtag

    How can I achieve that ?

  •  234
    Elena replied

    Hi Ronan,

    Unfortunately there's no built-in option for that, I am sorry, but thanks for your feedback. We'll consider your request in a next major update. For any other question, don't hesitate to ask

    Cheers, P.

  • Ronan replied

    In connexion with my other ticket, it would be nice to be able to choose the number of columns for the instagram import. 

    => For example, I would like to be able to have a single line with a lot of small images rather than semi large images.

  •  234
    Elena replied

    Thanks for the feedback, but unfortunately we haven't any plan to introduce such an option. Let's say we add an option to show 7 thumbnails: the instagram strip would look unbalanced and it wouldn't be tall enough to contain a title in the first block. Hope that makes sense. 

    Cheers

  • Ronan replied

    Hello Pasquale

    I do not understand your answer: the instagram import allows to choose how many post should be imported: 3, 7 or 11. For now is is displayed as a block of 4 columns, with the first reserved for title. Pictures are therfore rather big.

    What I expect is to be able to choose how many pictures are imported AND have an option to display them as a single line. This would give more control on the design, the same way ot can be done with galleries (especially with your fix in v1.3.9). Of course, use should adapt the title size accordingly.

    Regards,

    Ronan

  •  234
    Elena replied

    Hi again,

    I understand your POV but please let me show you another example: let's say you have an option to display the latest 5 instagram shots, here's how the block will look like

    As you can see, that's not going to work so great across breakpoints and that's the reason we have no plans to add such feature at the moment. Hope that makes sense

    Cheers, P.

  • Ronan replied

    Well, I understand your position as a developper of the theme which should work properly for all users. I am mostly speaking for myself. 

    I would like to do that myself then. I am a qualified PHP developper, even if not a WP expert.

    => Can you give me directions on which files handle the display of the instagram post ? One in the right file, I should handle the customization myself. 

    Regards,

    Ronan

  •  234
    Elena replied

    Thanks for understanding. Well, in that case you should look at the  template-composer.php file, line 320: the second argument ($instagram_images) is the one controlling the number of images to be parsed.

    Then you should also edit the column classes on line 322 (is-3-desktop is-6-tablet) in order to show a different number of columns.

    Hope that helps.

    Cheers, P.

  • Ronan replied

    OK - found where to do.

    Please note that I had to change template-tags.php file, where hemma_get_instagram function is located, since it handles the display of the instagram pictures (even if I would expect this to be handled in the template-composer.php file).

    I also had to add a "height: 100%" to .block.block-strip .block-strip-thumb in style.css to handle correctly the text overlay.

    You were right that handling the title might get tricy with small screens...

    I still got 1 issue: I tried to add a is-4-mobile class to title and picture columns. But it does not work as expected: the size is OK, but column do not stack one next each other, but stack vertically. I am used to bootstrap column logic, I guess it is different here ?

    You may look at the result here at the bottom of this page: http://www.labastideperchee.fr/

    Ronan

  •  234
    Elena replied

    That looks good

    Yeah, logic is different than Bootstrap. For example, is-2-* means 2/12.

  •  234
    Elena replied

    P.S. I guess a further CSS tweaks is needed when window width is less than 768px.