topic Re: Add a counter to a text widget in CMS Development

Add a counter to a text widget

LDouglas8 — Mon, 09 Jan 2023 08:24:54 GMT

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.

Is there a way of doing this?

Re: Add a counter to a text widget

Jaycee_Lewis — Mon, 09 Jan 2023 19:07:39 GMT

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

Re: Add a counter to a text widget

MatthiasWeber — Tue, 10 Jan 2023 17:32:16 GMT

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

Re: Add a counter to a text widget

Jaycee_Lewis — Wed, 11 Jan 2023 17:13:30 GMT

Thank you, @MatthiasWeber 🙌

Re: Add a counter to a text widget

emmyobonyo — Thu, 12 Jan 2023 14:26:01 GMT

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).

Re: Add a counter to a text widget

MatthiasWeber — Fri, 13 Jan 2023 06:35:28 GMT

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