on my instagram feed widget - there are posts missing - they appear as white boxes - any idea why please?
THANKS
on my instagram feed widget - there are posts missing - they appear as white boxes - any idea why please?
THANKS
Hi there, @Khush_Jabble
I am sorry about this issue!
It’s fixed now. Please check your widget and let me know if all posts are displayed on your end
Hi Max
I have a little request – not urgent – but on my ANNOUNCEMENT BAR – you added some code so that the text scrolled – the scrolling clips the edges off and also the scrolling doesn’t really work on a desktop or iPad – only mobile – is there any way to fix this please?
Hi there, @Khush_Jabble
I’ve checked the widget on mobile and couldn’t see the issue with the clipped edges. Could you please share a screenshot of what you mean?
As for the animation script, the text is quite short for the desktop animation in the bar.
If we implement this feature, there will be much empty space on one of the sides when scrolling. Is it fine for you?
Hi Max
As you reduce a windows width – the text simply goes on to numerous lines rather than scrolling
Secondly – if you view it on a mobile – when it scrolls to the ends of the text – it would be nice if there was space before and after the text snippet so that you can read the edges – but it scrolls too quick when it gets to the end lol
Got you!
I’ve passed your request on to the dev team. I’ll report back once I have their response
No stress no rush
Hey Max – hope you are well – my IG widget is not updating – what am I doing wrong lol
Hi there, @Khush_Jabble
The new posts aren’t showing up in the feed right away because of the cache. Our widget actually uses a cache system to make everything load faster and reduce the server load. So the posts are updated every 48 hours.
If it’s been more than 48 hours, please let me know. I’ll be happy to look into this
Regarding the customization of your Announcement Bar, our devs are still working on it. I’ll let you know once the solution is ready!
Aha
No problem – is there anyway to set up LIVE feeds
PS – the announcement bar now looks great!
Yeah, our devs have added the code to make it scroll when reducing the size of the window on the desktop:
const style = document.createElement('style');
style.innerHTML = `
.elfsight-ab-animation [class*="message__TextHTML-sc"] {
justify-content: flex-start;
}
.elfsight-ab-animation [class*="message__TextHTML-sc"] div {
animation: marquee 30s linear infinite;
}
[class*="message__TextHTML-sc"] {
overflow: hidden;
white-space: nowrap;
}
[class*="message__TextHTML-sc"] div {
width: fit-content;
}
@keyframes marquee {
0% {
transform: translate(0, 0);
}
50% {
transform: translate(-50%, 0);
}
100% {
transform: translate(0, 0);
}
}
`;
document.body.append(style);
const waitForElement = (selector, root = document) => new Promise(res => {
let i = 0;
const check = () => {
const component = root.querySelector(selector);
if (component) {
res(component);
} else if (i !== 50) {
setTimeout(check, 100);
i++;
}
};
check();
});
let isAnimated;
function callback() {
setTimeout(() => {
const textContainer = document.querySelector('.eapps-announcement-bar-9ea4867d-8adf-4e23-bc7d-0e2ce78032cf-custom-css-root');
const text = textContainer.querySelector('[class*="message__TextHTML-sc"]');
if (!text) {
return;
}
if ((isAnimated === false || typeof isAnimated === 'undefined') &&
text.scrollWidth > text.clientWidth) {
textContainer.classList.add('elfsight-ab-animation');
isAnimated = true;
} else if ((isAnimated === true || typeof isAnimated === 'undefined') &&
text.scrollWidth <= text.clientWidth) {
textContainer.classList.remove('elfsight-ab-animation');
isAnimated = false;
}
}, 100);
}
const observer = new ResizeObserver(callback);
waitForElement('[class*="message__TextHTML-sc"]')
.then(() => {
const textContainer = document.querySelector('.eapps-announcement-bar-9ea4867d-8adf-4e23-bc7d-0e2ce78032cf-custom-css-root');
observer.observe(textContainer);
});
This code was added to the Custom JS section on the Settings tab of your widget’s settings.
Also, you’ve asked to add some side paddings on mobile to properly see the whole text during the animation. However, now I see that you’ve changed the text and it’s greatly visible without side paddings.
Do I understand right that you don’t need side paddings on mobile anymore?
Regarding the live updates in the feed, it’s impossible at the moment, but we have this idea on the Wishlist. Feel free to upvote it - Remove or reduce cache time
It still doesn’t work properly on my mobile (iphone with chrome)
It seems to stop scrolling and missing off the min order = 1 text
What am I doing wrong
Ah, I see this! This code worked fine for the previous text, but it should be adjusted for the new one.
I’ve shared it with the devs and let you once I have their response
Could you just specify whether you still need the code to add side padding on mobile?
Hi Max – I think the padding is important so that customers see ALL the text
Hi Max
Sorry to be a pain
I have just DUPLICATED an announcement bar – now called HTC ANNOUNCEMENT BAR – apart from the custom text EVERYTHING is the same as the one I copied from that works nicely and in the new bar – nothing scrolls – what am I doing wrong please
Its being used on our new business website – www.hollytreecottage.co.uk
Hi Max
Sorry to be a pain
I have just DUPLICATED an announcement bar – now called HTC ANNOUNCEMENT BAR – apart from the custom text EVERYTHING is the same as the one I copied from that works nicely and in the new bar – nothing scrolls – what am I doing wrong please
Hi there, @Khush_Jabble
The thing is that the duplicated widget has a different ID, and it should be replaced in the code. I’ve already done it and now the animation is working there too
As for your previous request, now all texts are displayed during the animation and we’ve added this code to the Custom CSS field to add paddings:
[class*="message__TextHTML-sc"] div {
padding: 0 20px;
}
Also, we are making some final adjustments to make it work perfectly. I’ll let you know once everything is done
Hey Max
BUTTON – what code do I need to write to get it to justify LEFT?
https://dash.elfsight.com/widget/e8cdde37-d8a7-4a6c-837e-2dd4df6d1738
STORE LOCATOR – I want to set the opening hours as ALWAYS OPEN AND is there any way to alter the exact location on the map as our location is not quite right!
https://dash.elfsight.com/widget/dd84e547-93a4-4219-a63b-16884b0a650c
Is there any way to add more buttons to my account – they are great!
Hi there, @Khush_Jabble
Here is the solution to align the Button widget to the left - Align emdedded button to the left.
If you’d love to have more Button widgets in your account, you should upgrade your subscription to a higher plan. If you’re facing difficulties with it, please contact our Support Team at support@elfsight.com. They’ll be happy to assist
As for the Store Locator widget, you can change the address in the Address field of the Contacts section:
It’s impossible to set the opening hours as always open, and we have such a request on the Wishlist - Make it possible to set 24/7 working hours.
Just in case, I’d like to note that you can make the working hours almost 24/7 by manually adding the time instead of choosing from the dropdown. For example, 12:00 a.m - 11:59 p.m:
By the way, we’ve made the final adjustments to your Announcement Bar widget and now the animation is working great on mobile. Feel free to check it out
Can you not hide opening times altogether?