-
How do I add a shadow or border on my featured image here? https://staging.learnplanting.com/soil-care/fertilizer/oak-trees/
It Is a dynamic image within the container…
-
Hi Heathery,
I’m not seeing the Featured image. Did you remove it? If so, can you add it back?
-
No It should still be there – take a look here: https://staging.learnplanting.com/soil-care/fertilizer/oak-trees/
-
I see. So one way is to replace that WP Image Block with a GB Image Block and use GenerateBlocks Pro Effects feature. Reference: https://docs.generateblocks.com/article/effects-overview/#box-shadow
The other way is through custom CSS. We can point you in the direction you need to go with here. For instance, try this CSS:
.page-id-14815 img.dynamic-featured-image.wp-post-image { box-shadow: 3px 3px 3px #000000; } -
I think I’d like to keep the image I have now and insert the CSS – can you point me in the direction of where specifically I insert that CSS? I tried it in the block for the container in the “Additional CSS Class(es)” and that didn’t do anything ha
-
It should work there.
Can you double-check if there are any syntax errors on your Additional CSS?
There are various CSS syntax error checkers online such as this one: http://csslint.net/
-
I copied your code exactly and inserted it in here:
IS there any way I’m putting it in the wrong spot?
-
It’s not that it’s in the wrong spot. There could be a syntax error somewhere in your previous codes. This is what I’m suggesting for you to check.
Try adding the code I provided at the very top.
-
there’s nothing in that box besides the code I copied exactly – would you mind logging in and taking a look?
-
Oh. I see where you placed it. Sorry, I misunderstood. Remove where you added it.
Add it to Appearance > Customize > Additional CSS in your Admin dashboard.
-
Thank you so much I see when I added it a black shade came up. Here was the code I had before I believe to shadow my featured image – I tried to add this to your code b/c I like the specs of it…but it didn’t work. Could you help me adjust the code? Last thing and we can close this out! Thank you!!
.shadow1 {box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important}
-
Try this:
.page-id-14815 img.dynamic-featured-image.wp-post-image { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important } -
Amazing – it worked!!! THANK YOU so much
-
You’re welcome, Heathery!
- You must be logged in to reply to this topic.