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-using-javascript

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

[Jaycee_Lewis]

Thank you, @MatthiasWeber

[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