- This topic has 10 replies, 2 voices, and was last updated 4 months ago by
Leo.
-
AuthorPosts
-
September 18, 2020 at 5:59 pm #1449408
Martin
When I add images using the image block, they appear perfectly circular when previewed in wp-admin — however, when I view the images on the live site they are not circular. Why might this be?
September 18, 2020 at 6:04 pm #1449412Leo
StaffCustomer SupportHi there,
Are you using any sort of caching plugins or server cache?
If so can you disable it for us to take a look?
When something works in the back end but not on the live site, it’s generally a caching issue.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 18, 2020 at 6:05 pm #1449413Martin
No cache or plugins installed.
September 18, 2020 at 6:08 pm #1449416Leo
StaffCustomer SupportAny chance you can disable all plugins except GP Premium and GenerateBlocks for us to take a look?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 18, 2020 at 6:12 pm #1449419Martin
All plugins except GP Premium and GenerateBlocks have now been deactivated.
September 18, 2020 at 6:27 pm #1449427Leo
StaffCustomer SupportAhh ok I see the issue.
Can you try adding this CSS?
.wp-block-image.is-style-rounded img { height: 200px; }
Adding CSS: https://docs.generatepress.com/article/adding-css/
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 18, 2020 at 7:16 pm #1449441Martin
That CSS snippet does seem to resolve the issue — but shouldn’t the images appear circular without having to customize the CSS?
September 18, 2020 at 8:46 pm #1449484Leo
StaffCustomer SupportIt should – looks like a small issue with the theme’s CSS.
We will take a closer look. Thanks 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 18, 2020 at 9:04 pm #1449494Leo
StaffCustomer SupportIf I could make a recommendation…
You should notice that the images are out of ratio as you are using the resizer to make the images square at 200px by 200px.
The better solution would be to make sure the original image is already square/1 to 1 ratio, then the Rounded option would work without the CSS I’ve provided and images would not be out of ratio.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/September 21, 2020 at 2:10 pm #1452942Martin
I was aware of that, but the issue is having the client remember to always upload (and create) a perfectly square image! This is easier said than done!
Since the images appear perfectly circular in the admin panel, I am really confused as to why they don’t appear correctly on the live site?
September 21, 2020 at 2:11 pm #1452947Leo
StaffCustomer SupportBecause the theme is adding this CSS to make sure the images stay in ratio when cropped:
height: auto;
Generally that’s what we want.
That CSS doesn’t reflect in the customizer.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.