Skip to main content

LinkAndVideo Plugin

The LinkAndVideo plugin enhances the On-Codemerge editor by adding capabilities to insert and manage links and embedded videos.

on-CodeMerge

A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product. This intuitive tool for developers of all skill levels.
Result:
Preview:

Integration​

To use the LinkAndVideo plugin, you need to import and register it with the EditorCore. The integration process is as follows:

Initialize and Register LinkAndVideo
import EditorCore from 'on-codemerge';
import { LinkAndVideo } from 'on-codemerge/linkAndVideo';

document.addEventListener('DOMContentLoaded', () => {
  const appElement = document.getElementById('app');
  if (appElement) {
    const editor = new EditorCore(appElement);
    editor.registerModule(new LinkAndVideo());
  }
});

Features​

  • Link Insertion: Enables users to insert hyperlinks into the editor's content.
  • Video Embedding: Allows for the embedding of videos via iframe elements.
  • Modal Interface: Utilizes a modal dialog for inputting and editing link or video details.
  • Interactive Management: Provides interactive elements to modify or update existing links and videos.

How it Works​

When the link or video button is clicked, it triggers a modal where users can input URL and other related information. Once confirmed, the link or video is inserted into the editor's content.