Support
Still have questions? Message us.
To be used on individual text-based elements, making content within each editable. This is the editable option that you'll be using the most.
block-edit
or -block-edit: true
Use it as close to the copy as possible, outside of bold and italic formatting tags, and outside of a string of text that has a link within it.
Adding variable names to text elements saves their content. Each unique content piece requires its own variable name. Using the same variable name on multiple content pieces will update content for all pieces when one is updated.
data-block="variable-name"
or -block-var: variable-name
<p class="block-edit" data-block="example-text" style="text-align: left">Content</p>
Sets a character limit for content in an element.
block-minchar-#
or -block-minchar: #
block-maxchar-#
or -block-maxchar: #
<div class="block-edit block-maxchar-10">Text copy</div>
Disables option for making text bold.
block-no-bold
or -block-bold: false
Example:
<div class="block-edit block-no-bold">Text copy for an area.</div>
Disables option for making text italic.
block-no-italic
or -block-italic: false
Example:
<div class="block-edit block-no-italic">Text copy for an area.</div>
Disables option for allowing text to be made superscript.
block-no-superscript
or -block-no-superscript: false
Example:
<div class="block-edit block-superscript">Text copy for an area.</div>
Disables option for allowing text to be made subscript.
block-no-subscript
or -block-no-subscript: false
Example:
<div class="block-edit block-subscript">Text copy for an area.</div>
Disables text from being edited in an element. For example, a button that should only have its link updated.
block-no-text
or -block-text: false
Example:
<a href="#" class="block-edit block-no-text">More info</a>
Allows a text area to be removed.
block-remove
or -block-remove: true
Example:
<h1 class="block-edit block-remove">Title</h1>
For text where a link is added, Blocks Edit automatically uses the styling of the immediate text around the link and underlines it.
You can enable link style options to choose from by setting a variable name for them.
Each enabled link will be shown as a style option when a link is edited, as styles numbers, along with the default style as the first one.
Add the data-style attribute with a unique variable name on example links to include the style from.
Example:
<div class="block-edit" data-block="example-name">Text copy <a href="#" data-style="link-standard" style="color: #ff0000">with a link</a>.</div>
Disables option for adding a element around content for linking.
block-no-link
or -block-link: false
Example:
<div class="block-edit block-no-link" data-block="example-name">Text copy for an area.</div>
Still have questions? Message us.