Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Missing explicit CSS class in GB 2.0 Grid

  • Hello,
    The problem is that Ezoic ad placements often appear in a grid, overlapping the content and breaking the layout.

    To avoid this, it is possible to set filters for CSS classes in Ezoic to exclude from ads.

    The old GB grid has the class gb-grid-wrapper which can be filtered, while the new GB2.0 grid has random classes that start with .gb-element- followed by a random string. Its impossible to set filters for each of these.

    How can I add a unique CSS class to identify the GB2.0 grid?

  • Hi there,

    There isn’t a way to add a class only for Grid, unfortunately!

    In GB 2.0, the Grid block is the same as a container block; the only difference is that the Grid block’s display is set to grid, while the default container block’s display is set to block.

    You might have to manually add a class to each of the Grid blocks used on the site.

  • Hi there,

    adding the gb-container class (or similar) to all 2.0 grids and containers would also be fine.

  • GB container and grid both have gb-element-xxxxxxxx class, so try adding [class^="gb-element-"] to the ads exclusion list.

    Let me know if this works!

  • The Ezoic plugin allows to insert Elements, Classes and IDs as filters. Inserting the string does not work and I tried also gb-element-, gb-element-* and gb-element* without success.

  • Hi there,

    If you need a unique class, you’ll have to add it manually to the Grid block—there’s currently no way to add it via a filter or automatically.

    The simplest approach is to create a Global Style class for it. You don’t need to assign any styling to the Global Style—just create the class. Then you can add this class to all Grid blocks manually. This is easier than adding it through Advanced > Additional CSS Classes for each block.

  • Hi there,
    That’s a problem. I discovered the issue with the ads covering the content rather by accident and initially thought it was an Ezoic problem with their new JavaScript. But now it turns out that in GB 2.0, the containers don’t have a unique CSS class.

    Everyone who monetizes with automatic placements will have this problem. Has no one noticed this yet?

    If one knows in advance, one can do this with global styles. However, nine months after the introduction of the new version, how is this supposed to work?

  • Sorry, but there isn’t an automatic way, unfortunately!

    I’m also surprised that you just noticed this issue after 9 months of using GB blocks.

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