Search the Community
Showing results for tags 'announcement-bar'.
Found 30 results
-
Site URL: https://rafida.org Hey, I'm using the below code in the FOOTER INJECTION to fix the announcement bar and top header upon scroll for our BRINE website. I want to keep the announcement bar fixed on the desktop version, but not fixed in the mobile version I tried to add: mobileannouncementBar: false, But this did not work. Any ideas how to solve this? website: rafida.orgpass: lastphasetesting3 (function() { var settings = { mobileHeader: true, announcementBar: true, mobileannouncementBar: false, desktopHeaderTop: true, desktopHeaderBottom: false, adjustAnchors: true, isScrolledDistance: 400 };
-
Site URL: https://fife-deer-hznw.squarespace.com/ I'm using brine. I've tried a few methods in css to increase the marketing announcement bar's font size. Nothing's working. It's set at 13 and it's too small (I want all the sites fonts to be no smaller than 14px) .sqs-announcement-bar-text {font-size: 1.3rem !important; } seems to increase the font *line-height* but not the actual font *size* I've also tried: @media only screen and (max-width: 640px) .sqs-announcement-bar-text, p { font-size: 14px; !important;} This isn't working either. The "p" is being identified as a syntax error. What am I doing wrong? What gives? -
Site URL: https://cranberry-kale-kent.squarespace.com Hello! I am trying to customize my announcement bar but none of the codes work. I have attached the current code I am trying to use, which is not working. I have tried to change the color and not do animation, and change it to an image, but nothing with the .sqs-announcement-bar code is working at all. I tried to go under site styles and make it transparent and get rid of the original color, but that didn't work either. Help! Website password: thefontparty .sqs-announcement-bar { background: linear-gradient(99deg, #ff6460, #ebeecf); background-size: 400% 400%; -webkit-animation: AnimationName 6s ease infinite; -moz-animation: AnimationName 6s ease infinite; animation: AnimationName 6s ease infinite; @-webkit-keyframes AnimationName { 0%{background-position:0% 51%} 50%{background-position:100% 50%} 100%{background-position:0% 51%} } @-moz-keyframes AnimationName { 0%{background-position:0% 51%} 50%{background-position:100% 50%} 100%{background-position:0% 51%} } @keyframes AnimationName { 0%{background-position:0% 51%} 50%{background-position:100% 50%} 100%{background-position:0% 51%} } @-webkit-keyframes AnimationName { 0%{background-position:0% 49%} 50%{background-position:100% 52%} 100%{background-position:0% 49%} } @-moz-keyframes AnimationName { 0%{background-position:0% 49%} 50%{background-position:100% 52%} 100%{background-position:0% 49%} } @keyframes AnimationName { 0%{background-position:0% 49%} 50%{background-position:100% 52%} 100%{background-position:0% 49%} }}
-
, I have been really wanting a design on my website. The only issue is that sqaurespace doesn't give you the option to do so. So, I came here to see if anyone could help me with some help sharing the code to me. I was wondering if its possible to have a carousel like scrolling announcement bar block in the header of my website. I took a screen shot so that it will give you a better idea. If you can help me please reply back. Thanks!!
-
Site URL: https://mandarin-synthesizer-j5g7.squarespace.com/ Hello, I would like to add a slideshow effect to the announcement bar. For example one frame would say 'call us on xxxxxxx' and then the next frame would say 'or email us at xxxxx'. Is this possible? and if so how would I find the css code for it? Many thanks for your help. Kelly
-
Site URL: http://just-customs.squarespace.com I'm wanting to remove the "x" option to close the announcement bar. Just want it to always be at the top without people being able to close it off.
-
Site URL: https://heartpainter.com/ After I changed the background color of the announcement bar (because black looked kind of harsh), I encountered huge problem in preview modes (tablet and phone) and in real life tests. On tablet, (Samsung Tab A 10.1 S pen), switching from vertical view to landscape view made everything in the design wrecked -- I didn't take a screen shot, but some nav links overlapped others, there was basically no organization among blocks. In mobile, clicking on a menu item did the same even in vertical view. It was just luck, since I'd made a lot of changes today, that I tried changing the announcement bar back first. That fixes it. However...I don't see why...seems as if the background color of the announcement bar should have zero effect like this. Ideas? -
Adding a Second button to the Announcement bar
holgenuine posted a question in Coding and Customization
Good morning, afternoon and evening everyone. I am adding a client login as well as a talk to us button in the Announcement bar of the site I'm working on.I have everything set up and styled, just wondering if anyone has any insight on adding a second button. Any help would be greatly appreciated. Cheers, Alex -
Brine: Fixed announcement bar not clickable anymore
jilliansun posted a question in Coding and Customization
Site URL: https://chihuahua-mayflower-6zj5.squarespace.com/ Hi, I made my announcement bar fixed with my header, however now I'm unable to click through to the page that's linked to the announcement bar. Would appreciate any help/advice! The code I'm using right now: .Header { position: fixed!important; z-index: 1000; width: 100%; padding-top: 30px; padding-bottom: 30px; background-color: rgba(255,255,255,0)!important; } @media screen and (min-width: 641px) { .Index section:first-child:not(.Index-gallery), .Main--page, .Intro, .Main { padding-top: 35px; } .Intro + .Main { padding-top: 0px; } } .sqs-announcement-bar-dropzone { position: fixed; top: 0; left: 0; right: 0; z-index: 999; } PW is: rsp123 Thanks! -
Site URL: https://www.jadoredbyjody.com/ I am trying to add a countdown to free shipping announcement bar. The YOU’RE ONLY $35 AWAY FROM FREE U.S. SHIPPING! I want the $35 to countdown as shoppers add items to their carts.
-
How to keep announcement bar fixed while scrolling?
shume posted a question in Coding and Customization
Hi, How do you keep the announcement bar fixed while scrolling. There seems to be old forum questions along these lines and have all been deleted! Is there CSS code I can add? I tried the below, but it didn't work! .sqs-announcement-bar { position: fixed; top: 0; width: 100%; } Thanks! Template: Hayden Bonus question: And if you know how to remove an underline from a link in announcement bar? -
I'm seeing an issue where my announcement bar is overlapping my site title and navigation icon on mobile. I reached out to support and this is a known issue they're working on but there's no solution yet and I need my announcement bar enabled. Any ideas? -
Site URL: https://www.stevenmcfarlane.design Hey all! I seem to be having trouble with my announcement bar. It seems to be pushing my header down over my content below, is there anyway to have the announcement bar push the whole site down instead instead of just pushing down the heading? Attached some examples showing the issue with and without announcement bar.
-
I am hoping to figure out how the reduce the overall height/size of the announcement bar on the Harris Template. It is really large at default settings but I can't figure out the code to get it to reduce properly. Any help would be much appreciated.
-
Site URL: https://fife-deer-hznw.squarespace.com/ Hi. I have added a fixed header nav, and now I'd like to get the announcement bar to sit just above the header. Right now the announcement bar is overlapping with the header nav. Here's what is in my CSS... what am I doing wrong? .Header.Header--top { position: fixed; top: 0px; z-index:1000; width:100%; -webkit-box-shadow: 0px 3px 15px rgba(100, 100, 100, 0.49); -moz-box-shadow: 0px 3px 15px rgba(100, 100, 100, 0.49); box-shadow: 0px 3px 15px rgba(100, 100, 100, 0.49); } main{ padding-top: 200px; } ajax{ z-index: 9999; } @media only screen and (max-width: 1000px){ main { padding-top: 0px; } } @media screen and (max-width:828px) { .sqs-announcement-bar-dropzone p { font-size: 15px; letter-spacing: .7px; line-height: 180%; } } .sqs-announcement-bar-dropzone { position: -webkit-sticky; position: sticky; top: 0; z-index: 10001; } .show-on-scroll-wrapper.show { display: none; }
-
Can someone provide the specific code for removing announcement bar from specific page in Version 7.0– Aviator family (Aviator template) -
Site URL: https://nightowlcoffeebar.com -
Announcement Bar is enabled but it does not appear on desktop. I have had plenty of websites with no problem but it might be from the fixed header CSS I have on this site. On mobile it appears below the header, is this normal? Also, the Mobile Bar is enabled but it disappears when scrolling down the page. Can this be fixed so when you finish scrolling it pops back into view? Any help or links with more info is greatly appreciated.
-
announcement-bar Rotating Content within Announcement Bar
deandra.olivieri posted a question in Coding and Customization
Site URL: https://www.jenevoymakeupstudio.com/ Hi! Wondering if there's a way to create an announcement bar with content that changes. An example can be seen on this Shopify site. Can anyone let me know if this is possible? Thank you! -
Hello there! I am building a two-language site and I would like to have somthing like a permanent announcement bar but with two small flags at the corner, one Swedish and one English. If you click on one flag, you will get linked to the corresponding language site. How can I do this? It doesn't need to be sticky, only be located at the top of the screen. Thanks in advance!! Adrian -
Diable announcement bar javascript on mobile
AllenMars posted a question in Coding and Customization
I'd like to diable the announment bar javascrip on mobile to increase the loading speed. I know how to do it with css (display:none). But it does not stop the script acutally. -
I need to Right or Left Justify the Announcement Bar Text. Please help! Thank you so much in advance for your CSS wizardry!
- 3 replies
-
- 1
-
-
- announcement-bar
- text
- (and 1 more)
-
I'd like to be able to disable the announcement bar on a single page. Is it possible? I'm guessing that it might be possible via code in the "Page Header Code Injection". However, I have no clue what that code would be. Do you know how?
-
Hey everyone! I've done a little bit of CSS but couldn't figure out why my announcement bar is overlapping my nav. And, on scroll it disappears. Can anyone help? I'm using Bedford family (Hayden template) https://verobranding.com/
-
Remove underline from link text in announcement bar
moessence posted a question in Coding and Customization
I am trying to remove the underline from linked text in an announcement bar. Please help with some CSS! Thank you in advance!
