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.

$('.content').richText();

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

$('.content').richText({

  // 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:

2017-09-20

  • Fix selection between editor and code view

2017-09-18

  • Copy selection from editor to code view

2017-09-15

  • Remove logs.

2017-09-11

  • Fix first line HTML tags

2017-09-10

  • Implement paragraph option for new text blocks

2017-09-02

  • Add font formatting

2017-09-01

  • Update code colors

2017-08-26

  • Implement adding new rows by pressing TAB in table

2017-08-24

  • Allow custom editor height (in percentage)

2017-08-18

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

2017-08-17

  • Remove console output

2017-08-09

  • Fix conflicts

2017-08-04

  • Remove console logs

2017-08-01

  • Minor event listener and single quotes update

2017-07-30

  • Consistency update

2017-07-11

  • 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.