Animated Headline Plugin

Support
#1

Hi There,

I’m trying to use the Animated Headline plugin, however it doesn’t seem to work… Instead of animating the word, it just shows all variables on top of each other at once and is static.

Can you tell me if this plugin - https://en-gb.wordpress.org/plugins/animated-headline/ is compatible with X Theme, and if not, is there a way of doing similar animations that is.

I would like to have a headline where one word changes to another, then back again.

Thanks,

Steven

#2

Hey Steven,

Thanks for writing in. Regretfully, we have not tested such a plugin. It would best to contact the plugin author to notify him that the plugin does not work so he could fix it. Moreover, we do not have support for third party plugin conflicts.

Thanks.

#3

Hi Christian,

Thanks for replying, it looks like it’s quite a neglected plugin to be honest… Do you know of anything within X where I could achieve this effect - https://codyhouse.co/demo/animated-headlines/index.html

It looks like this has been done with CSS/JS but I had no luck trying to implement the scripts.

Thanks very much,

Steven

#4

Basically, you would just need to copy the HTML in a Raw Content element, the CSS in the Content CSS and JS in the Content JS. Please watch the screencast below. Please note that not all JS will work in the builder.

Also, the implementation and troubleshooting of issues coming from custom code are beyond the scope of our support because they require custom work. What I’ve showed you serves only as a guide to help you get started.

Hope that helps and thank you for understanding.

#5

Thank you so much for that! I almost had it, and just got tripped up on JS as I’ve never touched it before.

But now I have it in and it’s working!

Feel free to say “work it out yourself” but there’s one last thing that’s troubling me, and that’s that the headline isn’t showing with the site-wide style, it’s a different font and size, but I can’t find anything to change in that code. I’ve tried changing the H1 tags in the html snippet but not sure what else to do.

Thank you again, best support ever!

#6

Hi @bluebanditmedia,

Are you still referring to the same headline? You can add the CSS in Theme Options > CSS to make it global in case you added it within the builder’s JS.

Or are you referring to the builder’s headline element styling?

Thanks!

#7

Hey @Rad
Thanks for replying.

Yeah the same headline, I’ve managed to get the animation I want working, but it isn’t taking on the global styling of my theme. Are you saying to add the animation CSS to the theme options rather than the page CSS to make sure it does?

Thanks!

#8

If you’re looking to use the animation globally, you should add it in Global CSS and JS or in Theme Options > CSS and Theme Options > JS. The Content CSS and Content JS only works per page. I recommended that for performance reasons. Loading it site-wide when you’re not using it for other pages will only add bloat to your site.

Thanks.

#9

Ah OK, I do actually want to use it on each page as a CTA, so glad this has come up! And hopefully that will solve the styling issue too.

Thank you!!!

#10

You’re welcome and hope that works.

#11

I’ve managed to get it on multiple pages, but still having the problem of the font being different to the other headers. I’m really not sure why as I can’t even find any styling options in the CSS that would be making it something else.

Will keep plugging away at it though.

Thanks!

#12

Hi There,

In that case, please provide us the direct page URL where we can see the headline. I believe your site is in under construction mode, you can either provide us login credentials in a secure note or deactivate your under construction plugin for a while so we can take a closer look.

Thanks,

#13

Looking at it, the font is right, and the colour, however the styling is different, and everything I’ve tried to change the font size/weight hasn’t worked. Ideally, I just want to reduce the size so it’s all on one line. If you could have a look that would be great! Login details attached

#14

Hey @bluebanditmedia,

The font size is coming from the stylesheet of the custom plugin. Please contact the plugin author to learn how to modify the text or you can learn how to use the browser’s developer tools to know what rule is taking effect and where it’s coming from. Here’s the documentation for Chrome: https://developers.google.com/web/tools/chrome-devtools/

We appreciate your kind words about our support service but this is really outside the scope of our support. If I’ll modify the third party plugin for you, it would mean that I would also allow other users to request modification to any third party plugin. That is not good for the support forum because what we cover and focus here is product support. This case is veering into third party plugin support. Please see our Terms.

Thank you for understanding.

#15

I totally understand you guys have gone above and beyond. Thank you for all the help advice!

#16

You’re welcome and we’re glad that we’re able to offer some advice.

#17

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.