Clean Paste

This feature allows you to control how content is pasted into the text editor from external sources, ensuring that unwanted formatting is either removed or retained based on your configuration. This is particularly useful for maintaining a consistent design and avoiding issues that can arise from copying content with conflicting styles.

Configuration

By default, clean pasting is set to “confirm,” where the user is prompted to decide whether to keep all formatting or only basic formatting when pasting content. You can configure the behavior of clean pasting using the unlayer.init() method within the textEditor settings.

Enable Clean Paste

unlayer.init({
  features: {
    textEditor: {
      cleanPaste: true  // Clean pasting is always on, removing all formatting
    }
  }
});

When cleanPaste: true, all formatting is stripped when content is pasted, ensuring that only plain text is inserted.

Disable Clean Paste

unlayer.init({
  features: {
    textEditor: {
      cleanPaste: false  // Disable clean pasting, keep all formatting
    }
  }
});

Setting cleanPaste: false preserves all formatting from the source when content is pasted into the text editor.

Preserving Basic Formatting

unlayer.init({
  features: {
    textEditor: {
      cleanPaste: 'basic'  // Keep structure and basic formatting only
    }
  }
});

When cleanPaste: 'basic', the editor will keep only basic formatting, such as bold, italic, headings, and structure. More complex formatting (such as colors, font sizes, etc.) will be removed.

Prompting the User (Default Behavior)

unlayer.init({
  features: {
    textEditor: {
      cleanPaste: 'confirm'  // Prompt the user to decide whether to clean paste
    }
  }
});

By default, the editor will prompt users when they paste content, asking them whether they want to preserve all formatting or just the basic structure. This gives users more control over the pasted content.

Best Practices

• Consistent Design: Enabling clean paste (true or basic) helps maintain a consistent design by preventing unwanted or conflicting styles from external sources from being pasted into the editor.
• User Control: The default confirm option is useful when you want to give users flexibility over how content is pasted, allowing them to choose whether to keep or remove formatting.
• Prevent Styling Issues: Use clean paste in situations where preserving external formatting could lead to styling issues, particularly when users copy content from word processors or websites with complex styles.

By leveraging this feature, developers can ensure that pasted content is clean and consistent with the intended design while offering flexibility in how formatting is handled.