Support » Theme: Tracks » tiled galleries problem

  • Hi there,
    I am sorry to post so many different questions, but there is one of the last issues I have to find a solution for.

    For some reason I I made my XAMPP installation a private network one. The result was that the Jetpack plugin pack is not working (no idea how to change to public network…). Since I had a large number of tiled galeries (Jetpack) in my blog, I looked for a solution to reproduce them and found Easy Image Collage, which worked out well.

    The problem is that these image collages display not in full column width when the browser is full screen. I first have to reduce the browser window and to resize it to full size to have the collages displayed in full size. I reconfigurated my blog post with Elementor and customized usually enlarged the body width to between 900 and 1200 px. This problem occurs in Chrome, Firefox and Edge.

    Any idea how to solve this? Either make Jetpack working or make Easy Image Collage display correctly?

    Thank you so much!

Viewing 11 replies - 1 through 11 (of 11 total)
  • Theme Author Ben Sibley

    (@bensibley)

    Hmm I can’t say for sure what the issue is without a link to an example.

    I know that many users have used the Jetpack tiled galleries successfully with Tracks, so if it is an option to wait until you can work on your live site then I would recommend that. Otherwise, if you can find a way to share a link with me I’ll give it a look.

    uniterra

    (@uniterra)

    Hi Ben,
    I am still encountering the display problems described earlier. Since I have not put my blog online yet, I will attach some screenshots and code, if possible. I am using “easy image collage”, have set the width of the tiled gallery to 1050px and the width of the column, in which it is inserted to 1000px. Iam working with Google Chrome

    Here you will find screenshots and code: https://wordpress.com/post/ainanani.wordpress.com/5734

    the password is: pageforben

    Would be really great, if you were able to help once again!!!

    Theme Author Ben Sibley

    (@bensibley)

    I’m getting a white screen when visiting that URL. Can you double-check it?

    I played around with the Easy Image Collage plugin and might have some CSS that will work. Try adding this to the Additional CSS section in the Customizer:

    .eic-frame {
      width: 100%;
    }
    uniterra

    (@uniterra)

    Please try this URL: https://ainanani.wordpress.com/2018/03/23/test-page/

    I will check the CSS

    uniterra

    (@uniterra)

    The CSS has no effect… I inserted it into the custom CSS of the theme and also tried inserting it into an individual post’s CSS (using Elementor).

    Also checked with different browsers. Same phenomenon with Firefox amd IE, both latest editions…

    A pity, but thanks a lot anyway!

    Theme Author Ben Sibley

    (@bensibley)

    Thank you – the new link worked well for me.

    I’m still having trouble figuring out exactly why it’s not sizing properly, but the previous CSS may work if we try forcing it to apply with an !important tag and more specific selector, like this:

    .eic-container .eic-frame {
      width: 100% !important;
    }

    When using the gallery, I see that the container element always fills the full width, so if the “frame” is forced to be 100% wide it should also occupy the complete width. Hopefully, the plugin’s Javascript will use the new dimensions and size the images appropriately for the space available.

    uniterra

    (@uniterra)

    This CSS had a rather strange effect… I have added two new screenshots to the test page…

    Please do not spend too much time on trying to solve this issue. Maybe the website will act differently when online and not in alocal environment that does not allow jetpack to operate (localhost).

    Thanks a lot!

    uniterra

    (@uniterra)

    Is it possible that the problem lies in the fact that I have widened the column using Elementor? I am using different widths for many of my post. So I did not change the templates or added custom CSS. Elementor lets you easily set the margins for every individual post, but this might in some way interfere with the general theme setting. At least it seems that the galleries are fitted into the original width as set by the theme, isn’t it? What do you think?

    Theme Author Ben Sibley

    (@bensibley)

    Hmm okay I may have to wait until there’s a live URL I can inspect to get a final solution.

    I think that it is probably related to Elementor since the image sizing seems to work with the default post width in Tracks.

    Maybe I could try playing around with the default post width a bit in the meantime. How can I set this default to – let’s say – 1000 px? I did not find how to do this among the CSS sippets…
    Thanks a lot!

    Theme Author Ben Sibley

    (@bensibley)

    Would you be okay with a relative size instead of a fixed size? This CSS will make the content area much wider:

    .entry-container {
      padding: 0 5%
    }

    The 5% value can be increased to make the space narrower.

Viewing 11 replies - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.