Home Forums Themes Support Gecko Instagram fixed size

Topic Resolution: Resolved

Tagged: 

Viewing 12 reply threads
  • Author
    Posts
    • #31492

      Hi,

      With the Instagram widget there are fixed sized to chose from. But in the flow allows bigger pictures, i.e. pictures posted with other sizes than 1×1. (see image below)

      How do I fix the sized on the webpage so that it overrides the picture size when other on Instagram?

      + Are you planning to add a feature where I can chose # to show in the instagram flow?

      Image where the sizes are not fixed to 1x1

    • #31493

      Hi SA,

      1. Please try add below code to JanStudio > Theme Option > General Layout > Custom CSS

      @media only screen and (min-width: 1025px) {
      .jas-sc-instagram .slick-slide img {
      	max-width: inherit;
      	height: 300px;
      	width: auto;
      }}

      2. Could you please explain about “Are you planning to add a feature where I can chose # to show in the instagram flow”

      Thanks

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #31494

      Hi,

      1. The code worked to force 1×1. But it added margins in a very strange way (see below image)

      2. I’d like to add an instagram feed based on one or several hashtags, e.g. in our instagram feed we post with various hashtags related to each product i.e. #lårskav for one product and #skoskav for another. I’d like to be able to add just the post related to for instance #lårskav to the landing page that promotes products for lårskav.

      After CSS change

    • #31497

      Hi,

      Could you send me the link where show your Instagram Feed.

      Thanks

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

      • #31498
        This reply has been marked as private.
    • #31499

      Could you send me login credential and set as private reply. We will update the fix.

      Thanks

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #31500
      This reply has been marked as private.
    • #31501

      I tried this account but can’t access, could you check and send me again.

      Thanks

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #31502

      I re-wrote the password. And I’ve logged in with the credentials. So now I know for sure it works.

    • #31505

      Hi,

      please change prev code to

      @media only screen and (min-width: 1025px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 320px;
      }}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #31506

      Perfect! Thanks a lot 🙂

      Always a pleasure to get help from you!

    • #31509

      You’re welcome.

      Have a great day!

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

      • #31529

        Hi,

        I’ve working on another computer today (yesterday an iMac 22″ and today MacBook Air 13″). And on the MacBook the pictures have their orgin sizes (the problem that initiated this topic), i.e. it’s not fixed to 1×1.

        I’ve done to changes to the css-code you made yesterday.

        What can I do?

        Regards,
        Anna

    • #31531

      Hi SA,

      Please try change prev code to

      @media only screen and (max-width: 1920px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 320px;
      }}
      @media only screen and (max-width: 1440px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 245px;
      }}
      @media only screen and (max-width: 1366px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 233px;
      }}
      @media only screen and (max-width: 1280px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 219px;
      }}
      @media only screen and (max-width: 1024px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 176px;
      }}
      @media only screen and (max-width: 800px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 277px;
      }}
      @media only screen and (max-width: 768px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 266px;
      }}
      @media only screen and (max-width: 480px) {
      .jas-sc-instagram .slick-slide img {
      	max-height: 100%;
      }}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #31546

      Thanks! Now it looks great even om my 13″ 😀

Viewing 12 reply threads

You must be logged in to reply to this topic.