All tools in this category Full tool catalog Open full tool page: Word Counter

Guide

Embedding the word counter

Add a compact themed iframe for authors who need quick metrics, or link to the full localized counter when iframe policies block third-party frames.

  • Updated: 2026-05-03
  • Text typed into the embed stays in the browser like the full tool. This page demonstrates multiple iframes for design comparison only.

Paired full tool page

This URL is the embed documentation. The same tool for everyday use (full UI, FAQ, all languages) lives on the public page below.

Word Counter — Open full tool page

This guide (embed docs): /developers/embed/word-counter/ Public tool path: /text/word-counter/

Ways to add the word counter

Ideal for authoring UIs, CMS sidebars, and lesson pages where writers need quick metrics. Metrics stay in-browser; remind users that counts are estimates for non-space languages.

General embedding guide (all tools)

Sidebar iframe

Use compact mode when the iframe sits beside a narrow editor. Light theme pairs well with documentation sites; dark matches authoring tools with dark chrome.

Open full tool page

Link to full counter

Use when you only need occasional counts or when iframe sandboxing policies on your CMS block third-party frames.

Open full tool page

Live previews (themes)

The warning line about estimate counts appears in every theme; verify readability especially on amber and light backgrounds.

On wide viewports we use two columns so each iframe stays readable. The lower pair uses a narrow ~300px column to mimic a documentation sidebar; the upper pair uses the full cell width like a content block or dashboard tile.

Default dark (matches main salamyx look) Default shell for dark portals, admin tools, and dev consoles. (default)
Light paper background, dark text Bright background for public docs, help centers, and light CMS chrome. ?theme=light
Cool slate panels Cool slate beside code samples or neutral product UI. ?theme=slate
Warm dark with amber accent Warm dark with amber accent for blogs and marketing layouts. ?theme=amber

Compact density

Compact mode trims vertical padding so the textarea and metrics fit stacked layouts on tablets.

Theme query parameter

Append ?theme=light|slate|amber (or omit / use dark). Invalid values fall back to the default dark shell.

Styling on your host page

You control border-radius, shadow, and max-width on the iframe element. The embed document only adjusts its internal palette; it cannot inherit your site fonts automatically inside a cross-origin frame.

Example URLs with parameters

Base URL is the embed endpoint. Add query pairs such as ?theme=light&compact=1. Order does not matter.

https://salamyx.com/embed/text/word-counter/
https://salamyx.com/embed/text/word-counter/?theme=light
https://salamyx.com/embed/text/word-counter/?theme=slate&compact=1
https://salamyx.com/embed/text/word-counter/?theme=amber

Privacy And Limitations

Text typed into the embed stays in the browser like the full tool. This page demonstrates multiple iframes for design comparison only.

  • Word and reading-time metrics are practical estimates, especially for languages without spaces.
  • Multiple live previews on this page load several iframes; avoid copying that pattern on production pages with tight performance budgets.
  • Compact mode reduces padding but does not change counting rules.

Related Pages

FAQ

Which theme works for editorial sidebars?

Light or slate often matches CMS chrome. Amber is useful for dark marketing sites; always check contrast on warning text.

Should I use compact mode?

Use compact mode when the iframe shares a column with other controls and vertical space is scarce.

Does the embed upload text?

No. Counting runs locally in the browser, same as the full tool.

Can I embed multiple counters on one page?

Technically yes, but each iframe loads salamyx.com assets. Prefer a single iframe or the full tool link for performance.

Where is the general iframe policy documented?

See /developers/tool-embed/ for framing rules, robots notes, and postMessage details.