https://github.com/camwyn/field-length-alert
Warns the user in the post edit page when specified field lengths exceed the configured max character counts.
https://github.com/camwyn/field-length-alert
editor fields wordpress
Last synced: 2 months ago
JSON representation
Warns the user in the post edit page when specified field lengths exceed the configured max character counts.
- Host: GitHub
- URL: https://github.com/camwyn/field-length-alert
- Owner: Camwyn
- License: gpl-2.0
- Created: 2017-04-04T03:24:27.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2017-04-13T14:30:02.000Z (about 9 years ago)
- Last Synced: 2025-06-06T01:12:13.991Z (about 1 year ago)
- Topics: editor, fields, wordpress
- Language: JavaScript
- Homepage:
- Size: 136 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
field-length-alert
=====================
Field Length Alert System
This plugin watches the length of specified fields in the editor and warns the
user via the field length message at the end of the field when the text exceeds
some predefined length. We have two thresholds: `warn_threshold` and `error_threshold`,
each of which can be configured to change the length count to a different color
to warn the writer.
Usage
=============
The warn and error threshold settings are set when calling the
object like this:
```javascript
window.Camwyn.fieldLengthAlert( {
target: '#mayo_link_url', // ID of field container
error_threshold: 22, // The character count to change to a error
warn_threshold: 18, // The character count to change to a warning
direction: 'down' // allows for count down or count up configuration, default is count down.
}, function() {
console.log( 'Amazing callback function!' ); // callback function if needed.
} );
```
Options
=============
_Note: the default counts are arbitrary and easily overridden in the call._
Option | Type | Default | Description
------ | ---- | ------- | -----------
target | string, array | _null_ | The css target used to find the fields. Can accept classes, IDs, etc. Will bind to all instances on the page. You can also pass an array of selectors and fieldLengthAlert will happily iterate over them all (using the same thresholds and direction, if set)
warn_threshold | int | 65 | The character count at which the `-warn` class should be added to the counter - gives the editor warning that they are approaching the limit.
error_threshold | int | 55 | The character count at which the `-error` class should be added to the counter - this is the "hard" limit. Note this plugin does not prevent a longer entry - just lets the editor know they've exceeded the limit and _stuff may break™_
direction | string | "down" | Whether the counter should count "up" (from zero) or "down" (from limit - default).
Styles are overridable in the theme and have been kept as simple as possible to allow for such.
Examples (using title field)
=============
Typical count:

Warning count:

Error count:

Note that the default option (`direction: 'down'`) will show a negative number when you go over the limit - handy for showing how many characters you need to remove! If you really want an incremental count you can set this to `'up'`.
Props
=============
[@borkweb](https://github.com/borkweb) for the [original inspiration](https://github.com/borkweb/go-title-length-alert),
[The 10up Component Library](https://github.com/10up/wp-component-library) that I modeled some of the initial code structure off of.
[@timwright12](https://github.com/timwright12) for code review and suggestions (passing arrays!)
[@bengrace](https://github.com/bengrace) and [@McCallumDillon](https://github.com/McCallumDillon) for design insight.