Her siteye takılanücretsiz metin editörü.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/viveeditor@x.y.z/dist/viveeditor.css" />
<script src="https://cdn.jsdelivr.net/npm/viveeditor@x.y.z/dist/viveeditor.classic.iife.js"></script>

<form method="post">
  <label for="body">Makale</label>
  <textarea id="body" name="body" data-editor required></textarea>
</form>

import { Editor } from '@viveeditor/core'
import { basicExtensions } from '@viveeditor/ext-basic'
import { listExtensions } from '@viveeditor/ext-list'

const editor = await Editor.create(document.querySelector('#editor'), {
  extensions: [...basicExtensions, ...listExtensions],
  content: '<p>Hello <strong>world</strong></p>',
  label: 'Makale metni',
})

editor.on('change', () => console.log(editor.getHTML()))

import { ViveEditor } from '@viveeditor/react'
import 'viveeditor/style.css'

<ViveEditor value={html} onChange={setHtml} locale="tr" label="Makale metni" />

<script setup>
import { ViveEditor } from '@viveeditor/vue'
import 'viveeditor/style.css'
</script>

<template>
  <ViveEditor v-model="html" locale="tr" label="Makale metni" />
</template>

<script>
  import { ViveEditor } from '@viveeditor/svelte'
  import 'viveeditor/style.css'
  let html = $state('')
</script>

<ViveEditor bind:value={html} locale="tr" label="Makale metni" />

import { ViveEditorComponent } from '@viveeditor/angular'

@Component({
  imports: [ViveEditorComponent, ReactiveFormsModule],
  template: `<vive-ng-editor [formControl]="body" locale="tr" label="Makale metni" />`,
})
class ArticleForm {
  body = new FormControl('')
}

<script type="module">
  import '@viveeditor/element/define'
</script>
<form>
  <vive-editor name="body" required locale="tr" label="Makale metni"></vive-editor>
</form>

composer require viveeditor/laravel
php artisan vendor:publish --tag=viveeditor-assets

<head>
  @viveeditorScripts
</head>

<x-viveeditor::editor name="body" id="body" :value="old('body', $post->body)" required />

<article>@viveHtml($post->body)</article>