Elementor - Title does not show below shortcode

[adamrobinson]

Hi all,

I have a site that has been built using the Job Box theme. I have an issue and trying to get support from the theme vendor is proving difficult.

On the page there is short code widget that pulls in a job search and listings. However in the elementor design I have a title widget that displays on the back end but not on the front end?

Would anyone be able to assist at all. I would appreciate it.

Here you can see the structure of the page.

This is the title that should display on the below the job search/listing and above the footer.

Any. help would be appreciated.

 

[adamrobinson]

Site is staging.fulltimesolutions.co.uk/jobvacancies/

 

[Community]

I suspect its due to this CSS class making it invisible ( see on the bottom right hand side )

I've seen this happen before when an element has some kind of animation attached to it, often a scroll animation and it cant trigger to be visible because you've ran out of scroll offset ( because you are already at the bottom with a very small footer )

Try removing all animations from the element and its child elements

 

[adamrobinson]

Thanks for your reply - if I remove the 'Bounce In' animation then it appears but the text is white so you cant see it unless you highlight it and it has no box or formatting..

 

[Community]

You'd just need to put it in a container, limit the containers width and then put a background and some nice padding on the container so it looks similar to how you had it in the screenshot.

You shouldnt be relying on an animation for that kind of redundancy of a block of text being visible.

 

[adamrobinson]

Even doing that, it still appears as white text with no background...

This is from the front end and is just me highlighting the text so you can see it.

 

[Community]

It looks as if you're theme has overriding CSS, that element seems to have its own html class:

<h4 class="control-heading-title text-white m-0">

Which that "text-white" class then adds the white CSS text. Is there any custom classes in your elementor heading ? in the advanced part.

 

[adamrobinson]

The title itself has a css class of m-0 but thats on the content section, nothing in the advanced part.

The m-0 class is on the same title element that is on other pages such as about us and displays OK. Definitely seems to be something to do with it being at the bottom of that page as if I move it above the job search box it appears fine.

 

[Community]

Yeah teh m-0 class is just margin zero. Its the text white class that is causing you the problem which must be being pulled from somewhere, if its not in the heading element class, then it must be being dynamically added some how by the theme for H4's .

Does it do the same if you change the heading to H3 or something else ?

 

[adamrobinson]

If I change it to H3 its still the same, but the text is slightly bigger of course, but still white text on a white background with no background etc.

Unfortunately the theme vendor have gone radio silent!

 

[Community]

Ok so looking at your HTML, the heading you've used isnt an Elementor heading by the looks of things.

<h3 class="control-heading-title text-white m-0">

That isnt an elementor heading widget. So does the theme you are using use its own widgets ? or is there any plugins generating its own widgets ?

As the an elementor Heading looks like this :

<h2 class="elementor-heading-title elementor-size-default">

 

[adamrobinson]

Yes sorry it is a title element from the theme itself

 

[Community]

Thats the problem as it has predefined styling. If you use an elementor heading widget you should be fine

 

[adamrobinson]

Ive got added a elementor heading widget, but it displays the text only, even though its in a container with the background settings etc..

 

[Community]

So what you see on the front end is different to what you are seeing in the editor on the backend ?

Does your setup or host have any caching ? If so clear all caches etc As i currently don't see any container stying on the front end so could be cache

 

[adamrobinson]

I have purged the cache.. so will allow that a bit of time, but yes on the back end I see this, the elementor header and the theme title elements.

On the front end I see the element header element with no styling or background etc.

 

[Community]

That certainly does seem like cache now you've got the Elementor heading in place and styled the container.

Normally when i see that its a combination of DNS/server/hosting caches and onsite plugin cache. All needs to be cleared typically if there is more than once instance of cache ( which normally on staging sites, caches are normally disabled to prevent problems like this )

 

[adamrobinson]

Ill give it a bit of time - thanks for your help