By using Elementorforum.com’s services you agree to our Cookies Use and Data Transfer outside the EU.
We and our partners operate globally and use cookies, including for analytics, personalisation, ads and Newsletters.

  • Join the Best Wordpress and Elementor Support forum

    Provide or get advice on everything Elementor and Wordpress, ask questions, gain confirmation or just become apart of a friendly, like minded community who love Wordpress and Elementor


    Join us!

Elementor - Title does not show below shortcode

A

adamrobinson

New Member
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.

Screenshot 2025-02-27 at 16.44.28.png


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

Screenshot 2025-02-27 at 16.44.32.png


Any. help would be appreciated.
 
A

adamrobinson

New Member
Site is staging.fulltimesolutions.co.uk/jobvacancies/
 
Community

Community

Administrator
Staff member
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
Screenshot 2025-02-27 191734.png
 
A

adamrobinson

New Member
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

Community

Administrator
Staff member
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.
 
A

adamrobinson

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

Screenshot 2025-02-27 at 19.41.58.png


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

Screenshot 2025-02-27 at 19.42.45.png
 
Community

Community

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

HTML:
<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.
 
A

adamrobinson

New Member
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

Community

Administrator
Staff member
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 ?
 
A

adamrobinson

New Member
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

Community

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

HTML:
<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 :

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

adamrobinson

New Member
Yes sorry it is a title element from the theme itself
 
Community

Community

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

adamrobinson

New Member
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

Community

Administrator
Staff member
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
 
A

adamrobinson

New Member
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.

Screenshot 2025-02-27 at 20.19.07.png


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

Screenshot 2025-02-27 at 20.19.14.png
 
Community

Community

Administrator
Staff member
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 )
 
Elementor Services Elementor Services

Latest posts

Latest Resources

Other Elementor Resources

elementor official
Top