Jump to content

How to make an announcement bar have multiple announements?

Recommended Posts

Hey @Molololol

Try pasting this into the code injection area:

Let me know how that goes!

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script>
  $(window).on("load", function() {
    $(".sqs-announcement-bar-text-inner").slick({
      autoplay: true,
      arrows: false,
      autoplaySpeed: 3000
    });
  });
</script>
<style>
  .sqs-announcement-bar-text-inner:not(.slick-initialized) p {
    font-size: 0;
  }
</style>

Official Squarespace Expert  |  Founder @ Winn-Brown & Co. 

👉  Get in Touch

📍 London, UK

Link to comment
  • 1 month later...

Thank you @dwinnbrown I just tried on my site & it worked.

On 10/30/2023 at 11:42 PM, Molololol said:

I can't see a change, I can see the text now when I increase the font size

Maybe you added all text to same line so it doesn't work, you try each text on different line

Something like this

image.png.9c58f61b1efc92583afa4e69ae71222c.png

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 months later...

Hey guys is there any update for this?

When I paste in the CSS it says error on line 4

I'm after a sliding announcement bar with 2 different announcements. Currently they're sitting above or below each other. Is there a way to have them on the same line, sliding left and one then the other?

Screenshot attached

Screenshot 2024-03-28 at 15.50.29.png

Link to comment
On 3/28/2024 at 10:51 PM, GeorgeIrwin said:

Hey guys is there any update for this?

When I paste in the CSS it says error on line 4

I'm after a sliding announcement bar with 2 different announcements. Currently they're sitting above or below each other. Is there a way to have them on the same line, sliding left and one then the other?

Screenshot attached

Screenshot 2024-03-28 at 15.50.29.png

You need to paste code to Code Injection Footer (DO NOT PASTE CODE TO CUSTOM CSS)

Code Injection1 Min

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.