[Resolved] Add caret symbol below container

[Max]

Hi there!

I’m trying to add a caret symbol below a container with a testimonial, pointing at the person’s picture. What would be the best way to do this in GeneratePress?

– What I have on my old website: https://jmp.sh/tBqwFrp
– How it looks now with GeneratePress: https://jmp.sh/TG223nH

It’s probably very simple, but I can only come op with weird workarounds.

Thanks for the help!

[Ying]

Hi Max,

The login doesn’t work for me, so I can’t log in and take screenshots to show you.

I’ll try to describe it the solution below.

1. Go to the page editor, select the 3 gb containers that contain the testimonial texts, add an additional CSS class, eg. testimonial.
https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/

2. Go to customizer > additional CSS, add this CSS:

.gb-container.testimonial >.gb-inside-container {
    position: relative;
}
.gb-container.testimonial >.gb-inside-container:before {
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #fff;
    content: '';
    position: absolute;
    bottom: -15px;
    left: 10px;
}

[Max]

Thanks Ying, much appreciated! That worked like a champ!

[Ying]

Glad to hear that 🙂

[Author]

Posts