[Resolved] archive issue with GP and elementor

[dasigna]

hi guys,

currently running into a serious problem with generatepress and elementor which appears to be a bug – but not sure on which side.

case:
i’ve set up blog and blog archive via gp – archive to be shown as three columns, featured post and masonry.
everything works well.
so as i wanted to have a different layout for search results, i’ve set up an custom archive template with elementor and according, also a single view for that. everythings fine so far.

problem:
now choosing post widget in elementor to show the search results in the custom template, and the single posts dont take the full space they’re given – no matter how many columns set to show.
when setting to show only one column, the posts dont take the full width as expected but stripped down to 66% for first result and 33% for the rest of them (remember the customizer settings…).
inspecting further it seems that some unsemantic grid css-classes (e.g. grid-33 and grid-66) do interfere with the post widget css of elementor and prevent them from taking up the given space… ?

quite obviously these interfering classes are according to gp blog archive settings in customizer. if i choose not to show the blog archive in columns, everything is fine in elementor post widget for search results archive.

so if i am not completely dead wrong this is kind of incompatibility between gp and elementor which should be solved and not be done via possible workaround on client (my) side 🙂

please have a look into this and maybe theres a way to solve asap?

credentials for dev-site to investigate are already given via mail. if you need further information or alike please tell me.

thanks in advance.

[David]

Hi there,

can you send through the link / login again please.

[dasigna]

have sent credentials again via mail.

edit:
to investigate please choose term “test” within navigation search and you’ll see the result / what is meant. they normally should take up full width – according to settings within elementor post widget (one column) …

[David]

Hi there,

try this CSS:

.elementor-default article[class*="grid-"] {
    width: 100% !important;
}

I am not sure if Elementor have fixed this yet but when you align the thumbnail to the left there is no tablet / mobile option for them to stack so the content falls off the screen. If not fixed, this CSS will help:

@media (max-width: 768px) {
    .elementor-posts .elementor-post {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }
    .elementor-post__thumbnail__link {
        margin-bottom: 1em;
    }
}

[dasigna]

sorry to say, but:
the first sniplet fixes the search results template to be one column full width, but disturbes the blog archive (‘aktuelles’) appearance to be full width too …
so problem now: just the other way round – search results ok but blog archive not :/

second snipplet obviously is not necessary, the stacking seems to work as expected.

[dasigna]

just an upgrade:

if i am replacing the ‘elementor-default’ part with the particular elementor-element-id(number) it works and does not interfere with gp settings for blog posts archive.

but that may be just a temporary workaround because thats no global solution and may occur again with any other possible archive…

so any better idea?? (btw: gp or elementor issue now? …)

[Tom]

What if you just did this?:

.elementor-post {
    width: auto;
}

Ideally, Elementor should add that little bit of CSS to their CSS. They’re using CSS Grid, so anything that has a width defined (columns at 50% etc..) will conflict with CSS Grid.

Alternatively, you can turn off columns within search results:

add_filter( 'generate_blog_columns', function( $columns ) {
    if ( is_search() ) {
        return false;
    }

    return $columns;
} );

[dasigna]

hi tom,

the css addition did the trick! no glitches encountered so far. just great.
will hand it over to elementor guys, maybe they’ll jump on board.

no need for php tweaking at this point and far better to keep all options open.

thanks for helping again. you guys rock 🙂

[Tom]

Glad we could help 🙂

[Author]

Posts