---
page_type: sample
products:
- office-sp
languages:
- javascript
- typescript
extensions:
  contentType: samples
  technologies:
  - SharePoint Framework
  platforms:
  - react
  createdDate: 3/1/2018 12:00:00 AM
---
# React TinyMCE Editor WebPart Integration with SharePoint

## Summary
React TinyMCE is one of the worlds most popular editors for the web.
It has many features out of the box and many more plugins that can be
added when needed. You can create your own plugins if you want, the
editor is powered by the community.

![picture of the web part in action](./assets/preview.gif)

## Used SharePoint Framework Version 
![drop](https://img.shields.io/badge/version-1.4.1-green.svg)

## Applies to

* [SharePoint Framework](https:/dev.office.com/sharepoint)
* [Office 365 tenant](https://dev.office.com/sharepoint/docs/spfx/set-up-your-development-environment)


## Prerequisites
If you are going to use tinymce be aware of it's license, and you must
agree to it.

## Solution

Solution|Author(s)
--------|---------
React-TinyMCE | @AustinBreslinDev

## Version history

Version|Date|Comments
-------|----|--------
1.0|Feb |Initial release

## Disclaimer
**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**

---

## Minimal Path to Awesome

- Clone this repository
- in the command line run:
  - `npm install`
  - `gulp serve`
  - `add webpart to page`


## Features
Description of the web part with possible additional details than in short summary. 
This Web Part illustrates the following concepts on top of the SharePoint Framework:

- Rich text editing, that has more features than the Out of the box.
- Uses an Open Source, community-driven Editor.
- Can be extended to accept copy/paste from using Paste Plugin.
- Can be extended to accept images using the manager in the Editor.
- Can write your own Styles for all content on your site.
- Can style your authoring experience using the skins folder.
- For more features please look at the extensive list of extensions available.

<img src="https://telemetry.sharepointpnp.com/sp-dev-fx-webparts/samples/React-TinyMce" />