بررسی کلی وبسایت رسمی
Quilljs یک انتخابگر تاریخ و زمان سبک و قدرتمند است.
ویرایشگر برفی#
از شناسه snow-editor برای تنظیم ویرایشگر برفی استفاده کنید.
سلام دنیا!
این یک ناحیه ویرایشپذیر ساده است.
- متنی را انتخاب کنید تا نوار ابزار نمایان شود.
- مدارک غنی را بهصورت زنده ویرایش کنید، بسیار انعطافپذیر!
پایان ناحیه ساده
<!-- ویرایشگران Quill -->
<div id="snow-editor" style="height: 300px;">
<h3><span class="ql-size-large">سلام دنیا!</span></h3>
<p><br></p>
<h3>این یک ناحیه ویرایشپذیر ساده است.</h3>
<p><br></p>
<ul>
<li>متنی را انتخاب کنید تا نوار ابزار نمایان شود.</li>
<li>مدارک غنی را بهصورت زنده ویرایش کنید، بسیار انعطافپذیر!</li>
</ul>
<p><br></p>
<p>پایان ناحیه ساده</p>
</div>
// تم برفی
var quill = new Quill('#snow-editor', {
theme: 'snow',
modules: {
'toolbar': [[{ 'font': [] }, { 'size': [] }], ['bold', 'italic', 'underline', 'strike'], [{ 'color': [] }, { 'background': [] }], [{ 'script': 'super' }, { 'script': 'sub' }], [{ 'header': [false, 1, 2, 3, 4, 5, 6] }, 'blockquote', 'code-block'], [{ 'list': 'ordered' }, { 'list': 'bullet' }, { 'indent': '-1' }, { 'indent': '+1' }], ['direction', { 'align': [] }], ['link', 'image', 'video'], ['clean']]
},
});
ویرایشگر حبابی#
از شناسه bubble-editor برای تنظیم ویرایشگر حبابی استفاده کنید.
سلام دنیا!
این یک ناحیه ویرایشپذیر ساده است.
- متنی را انتخاب کنید تا نوار ابزار نمایان شود.
- مدارک غنی را بهصورت زنده ویرایش کنید، بسیار انعطافپذیر!
پایان ناحیه ساده
<!-- ویرایشگران حبابی -->
<div id="bubble-editor" style="height: 300px;">
<h3><span class="ql-size-large">سلام دنیا!</span></h3>
<p><br></p>
<h3>این یک ناحیه ویرایشپذیر ساده است.</h3>
<p><br></p>
<ul>
<li>متنی را انتخاب کنید تا نوار ابزار نمایان شود.</li>
<li>مدارک غنی را بهصورت زنده ویرایش کنید، بسیار انعطافپذیر!</li>
</ul>
<p><br></p>
<p>پایان ناحیه ساده</p>
</div>
// تم حبابی
var quill = new Quill('#bubble-editor', {
theme: 'bubble'
});