Number counter widget

Ask the Community General Questions
1

Hi,
Please provide a solution for the number counter widget to not wrap to the next line.
Regards,
Mariya

Screenshot 2023-09-13 at 16.16.54|690x254

1 Like
3

Hi @Fleur_Alleman :wave:

Could you please send a link to the webpage where your widget is installed?

4

Here is the link, https://www.fmgroup.fm/en/WorldwideFM .

1 Like
5

Thank you!

Your request is now with our devs. I’ll get back to you once any news come up :slightly_smiling_face:

6

Hi @Fleur_Alleman

We’ve fixed the issue by adding this script to Custom JS field:

const wrapper = document.querySelector('.elfsight-app-225392a6-ab4c-47d1-a2db-03fd2b563e00').closest('div:not([class^="elfsight"]):not(.ceewi-wrap)');
if (wrapper) {
  wrapper.style.display = 'block';
}

Also, we’ve added this code to the Custom CSS field:

[class^='NumberCounter__Title-sc'] {
  margin: 0;
}

Please check your website and let me know if you like what you see :wink:

7

Thank you, now the counter widget looks awesome. I have another question. Is there a way I can reduce the time the widgets take to load?

1 Like
8

Happy to hear that you are fine now :slightly_smiling_face:

In order to make the widget load faster, you can remove the defer attribute from the widget installation code, which makes the widget load only after all other content on the page is loaded. Here’s what the code will look like:

<script src="https://static.elfsight.com/platform/platform.js" data-use-service-core></script>
<div class="elfsight-app-WIDGET-ID"></div>

Another way of making the widget load simultaneously is changing the defer attribute to async. Here is the code:

<script src="https://static.elfsight.com/platform/platform.js" data-use-service-core async></script>
<div class="elfsight-app-WIDGET-ID"></div>

Please replace WIDGET_ID in the codes above with the ID of your own widget and install it on your website :slightly_smiling_face:

9

Thank you!

1 Like
10

No sweat :wink: