Add a counter to a text widget

[LDouglas8]

I have a text widget and I'd like to add a counter that updates in real time with the number of characters typed. This is a widget by Hubspot.

{{ module.text_field }}

 Is there a way of doing this? 

[Jaycee_Lewis]

Hi, @LDouglas8 👋 Thanks for reaching out! I wonder if we can accomplish this using some JavaScript? Hey, @MatthiasWeber @Oezcan, do you have any experience here? 

Best,

Jaycee

[MatthiasWeber]

Hi  ,Hi  , 

with the magic of JavaScript everything is possible 🪄

$('textarea').keyup(updateCount);
$('textarea').keydown(updateCount);

function updateCount() {
    var cs = $(this).val().length;
    $('#characters').text(cs);
}

source: https://stackoverflow.com/questions/9767521/count-and-display-number-of-characters-in-a-textbox-usin...

What do you think?

Gemeinsam für digitales Unternehmenswachstum! Wir glauben an Human Centric, Online-Marketing mit Inbound und Digitale Geschäftsprozesse. Sie wollen mit Ihrem Unternehmen weiter kommen? Mit den Digital-Webern wird der Weg einfacher!

@Jaycee_Lewis

[emmyobonyo]

Thanks, @MatthiasWeber. The challenge though is that I'm trying to add the counter to the Hubspot Landing page text editor. I don't have access to it via javascript, so I can't access it. That text editor is part of my Hubspot landing page sidebar (Where I can edit content for the main page). 

[MatthiasWeber]

understood  . Do you have the options "settings" in the landing page. There should be additional options, where you can add Header-HTML direct. Maybe that helps.  

I attach here a german based screenshot, this should help finding it:

Can you add here your JavaScripts?

Gemeinsam für digitales Unternehmenswachstum! Wir glauben an Human Centric, Online-Marketing mit Inbound und Digitale Geschäftsprozesse. Sie wollen mit Ihrem Unternehmen weiter kommen? Mit den Digital-Webern wird der Weg einfacher!

@emmyobonyo

[Jaycee_Lewis]

Thank you, @MatthiasWeber 🙌