scrolling text in an announcement bar option would be great - especially useful for mobile phone views
1 Like
Hi there @Khush_Jabble 
You’d like to display the text in one line and have a horizontal scroll, am I right?
yes - absolutely - a 1 line scrolling banner is a great idea
1 Like
Got it!
This code should do the trick:
@media screen and (max-width: 550px) {
[class*="bar-elements__ElementsWrapper-sc"] {
justify-content: flex-start;
}
[class*="bar-elements__ElementsWrapper-sc"] * {
white-space: nowrap;
}
.es-announcement-bar-opened {
max-width: 100vw;
overflow-x: scroll;
}
[class*="bar-elements__Wrapper"] {
width: fit-content;
}
}
Just add it to the Custom CSS field on the Style tab of your widget’s settings and let me know if you like the result 
Hi – it doesn’t work for me
What am I doing wrong?
1 Like
I’ve double-checked the code and it’s working fine on mobile view:
Could you please check it once again?
As I said – it doesn’t work for me
All I get is one line of text that is not scrolling buddy – looks like the attached STATIC
1 Like
Hi there @Khush_Jabble
If you try to move the bar, the scroll will appear:
It’s not visible right away because of your website’s settings. If you want to show the scroll before moving the announcement bar, just let me know. Our devs will be happy to do this for you
I dont understand - what do you mean by move the bar?
1 Like
Right now, the scroll bar isn’t visible by default, which might make it seem like the announcement bar isn’t scrollable, as you pointed out in your screenshot.
The good news is that your Announcement Bar widget does have a scrollbar. It will become visible if you swipe it to the side (like in the screenshot from my previous message).
If you prefer to have the scrollbar appear right away without needing to swipe, just let me know, and we’ll be happy to help
ok - I think I have not explained my self - scrolling text - means text that moves from right to left if there is too much text to display on one line - nobody wants a scroll bar lol
1 Like
Ah, I see this! Sorry for misunderstanding!
I’ll discuss it with the devs and let you know if it’s feasible
Please add this code next to your widget’s installation code and let me know how it worked:
<style>
@keyframes marquee {
0% {
transform: translate(0, 0);
}
50% {
transform: translate(-50%, 0);
}
100% {
transform: translate(0, 0);
}
}
@media screen and (max-width: 550px) {
[class*='message__TextHTML-sc'] {
animation: marquee 15s linear infinite;
}
}
</style>
it still does not work lol
1 Like
I’ve checked your page and don’t see the code added there:
However, our devs adjusted the code for the Custom JS section on the Settings tab of your widget’s settings and added it there instead:
const style = document.createElement('style');
style.innerHTML = `
@keyframes marquee {
0% {
transform: translate(0, 0);
}
50% {
transform: translate(-50%, 0);
}
100% {
transform: translate(0, 0);
}
}
@media screen and (max-width: 550px) {
[class*='message__TextHTML-sc'] {
animation: marquee 15s linear infinite;
}
}
`;
document.body.append(style);
Please check your website and let me know if you like the result
Looks perfect now – thanks – I didn’t realise that the mobile banner had different settings too lol
1 Like
Great! If anything else comes up, we are always here to help
Hii Max
I have now implemented 13 apps into my website and they are all working perfectly
The latest one is the Social Media Icons – previously we have generated our own and there are a couple of different styles on our site – so I wanted to join things up and use your elfsight social icons only on my website – is there any chance that I could have the following icons as stand alone image files please so I can place them where they need to be placed
Youtube
X
As per the attached
1 Like
Hi there, @Khush_Jabble
Apologies for the delayed response!
I see that you’ve already found a Custom icon option and added your icons through the links.
If you have any questions left, please let me know. I’ll be delighted to help
I would like to use YOUR icons throughout my site if that’s possible
1 Like