Từ khóa tìm nhiều:

thiep cuoi, hien dai, gia re, in hinh, an tuong, my thuat, offset, 3D, 1500, 2500, 300

Tư vấn đặt thiệp
Gọi: 0919516761
Facebook Follow

Minimal Rich Text Editor With jQuery And FontAwesome - RichText

Bài viết được đăng Cách đây 2 năm - Người đăng tin: - Đã xem: 184 lượt

Just another jQuery implementation of the WYSIWYG rich text editor that uses Font Awesome Iconic Font for the editor icons. Licensed under the AGPL-3.0.

How to use it:

1. Load the required Font Awesome 4:

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

2. Load the richtext.min.css to style the editor.

<link rel="stylesheet" href="richtext.min.css">

3. Load JQuery library and the richtext.min.js at the end of the webpage.

<link rel="stylesheet" href="richtext.min.css">

4. Create a normal textarea element for the editor.

<textarea class="content" name="example"></textarea>

5. Calling the plugin will transform the textarea element into a basic WYSIWYG rich text editor.


6. Customize the editor by overriding the following parameter options.


  // text formatting
  bold: true,
  italic: true,
  underline: true,

  // text alignment
  leftAlign: true,
  centerAlign: true,
  rightAlign: true,

  // lists
  ol: true,
  ul: true,

  // title
  heading: true,

  // colors
  fontColor: true,

  // uploads
  imageUpload: true,
  fileUpload: true,

  // link
  urls: true,

  // tables
  table: true,

  // code
  removeStyles: true,
  code: true,

  // colors
  colors: [],

  // dropdowns
  fileHTML: '',
  imageHTML: ''

Change log:


  • Fix selection between editor and code view


  • Copy selection from editor to code view


  • Remove logs.


  • Fix first line HTML tags


  • Implement paragraph option for new text blocks


  • Add font formatting


  • Update code colors


  • Implement adding new rows by pressing TAB in table


  • Allow custom editor height (in percentage)


  • Fix dragging images. Images can not only be resized in the bottom right corner


  • Remove console output


  • Fix conflicts


  • Remove console logs


  • Minor event listener and single quotes update


  • Consistency update


  • Fix Safari selection issue

This awesome jQuery plugin is developed by webfashionist. For more Advanced Usages, please check the demo page or visit the official website.