Image block not working

GenerateBlocks
#1

Hi all,

I’ve been trying using the GB pro Image Block but it never seems to work on my website (with GeneratePress pro as theme).

For example on this page À propos de l'auteur du site Electroportatif.net the first image is a WP image block and the second one is a GB Pro image block.

I’ve set the WP image as round and the CSS is applied.

However on the GB Pro image block which I set a border radius of 999 on all 4 sides, the image doesn’t have the border radius applied.

Both images are the same with a 350 px width.

I’m trying to use the GB Pro image block as the WP image block doesn’t let me reduce the image width on mobile so it appears full screen which is not great desgin wise.

I’ve added this CSS to have all my images on full width on mobile except for AAWP, but even when I remove it, the GB Pro image block doesn’t apply the border radius.

Here’s the CSS :

/* Wide Image on Mobile */

@media (max-width:768px) {

#main .entry-content img:not(.aawp-product__image), #main .featured-image img:not(.aawp-product__image) {

margin-left: -30px;

margin-right: -30px;

max-width: 100vw !important;
}
}

@media (max-width:768px) {
#main .entry-content .noforcing img {
display: block;
max-width: 90%!important;
margin: auto;
}
}

If someone could tell me why I’m having this issue, I’d be very grateful :innocent:

Thanks all and have a great day !

Fred

#2

Hi @Kuenfred,

That’s odd. Can you try recreating that GB Image Block from scratch to test?

#3

Hi Fernando !

Thanks for your reply :slight_smile:

I’ve just recreated the same GB image block, same image, centered, border radius at 999 px on 4 sides.

The GB image block is showing correctly on WP editor but not on the front end.

Just to let you know that I’ve been using GB pro for a lot of different complex designs on many websites and it works fine. So I’m used to creating designs with a lot of different blocks but each time I’m trying the GB image block (on different websites), it never works. The spacing, margin, and all other settings don’t apply correctly.

#4

I see. That’s odd. To test, if you change the CSS Print method in GenerateBlocks > Settings, does it fix the issue?

#5

Hi Fernando !

I’ve tried what you suggested by changing the CSS Print method from external file to inline CSS on both GB Pro and GP Premium but it doesn’t change anything…

Well, I guess I’ll have to do with the WP image block.

Thanks a lot for your help anyway and have a great day !

1 Like
#6

I see. You’re welcome and have a great day as well!