Why is the message animation not working? (QAB)


The animation options in the Quick Announcement Bar only applies to the button in the message (if it's enabled).

However, there is a way to make text animate. You essentially place your message in the button and remove the appearance of the button. The trade off is that you will no longer have a button (since you are using it for your message), but your text will animate.


Follow this guide to achieve animated text.

1. Leave your text field blank.

2. In the section "Bar Clickable" select 'Add button to the bar'

3. Enter your announcement message in the Button Text field

4. Place '#' into the link address field (this just makes clicking the message/button do nothing. If you want to link to another page, you can place it here)


Like so:

Screen_Shot_2022-02-17_at_12.17.34_PM.png


5. Reduce padding to a style you like. Since your text is in a button, there will be more space around it. You can reduce this space by reducing the padding. But it's a matter of style and not function.



6. In the custom text box (or in your CSS if on a basic plan), add this code:


<style>

#qab_button{

background-color: transparent !important;

}

</style>


This removes the appearance of the button, so it just looks like normal text.

*If you are placing code in your CSS file, your don't need the <style> tags.


7. Choose an animation

Screen_Shot_2022-02-16_at_10.06.03_PM.png

Now, when you choose an animation, the text will animate.​​

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.