2020-04-04 02:18:47 -04:00
---
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
---
2020-11-08 23:44:51 -05:00
# TinyMCE Editor
2018-02-26 03:23:44 -05:00
## 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
2019-09-24 00:28:54 -04:00
editor is powered by the community.
2018-02-26 03:23:44 -05:00
![picture of the web part in action ](./assets/preview.gif )
2021-11-07 01:43:55 -04:00
2022-02-14 02:52:18 -05:00
## Compatibility
2021-11-07 01:43:55 -04:00
![SPFx 1.4.1 ](https://img.shields.io/badge/SPFx-1.4.1-green.svg )
![Node.js v8 | v6 ](https://img.shields.io/badge/Node.js-v8%20%7C%20v6-green.svg )
![Compatible with SharePoint Online ](https://img.shields.io/badge/SharePoint%20Online-Compatible-green.svg )
![Compatible with SharePoint 2019 ](https://img.shields.io/badge/SharePoint%20Server%202019-Compatible-green.svg )
![Does not work with SharePoint 2016 (Feature Pack 2) ](https://img.shields.io/badge/SharePoint%20Server%202016%20(Feature%20Pack%202 )-Incompatible-red.svg "SharePoint Server 2016 Feature Pack 2 requires SPFx 1.1")
![Local Workbench Compatible ](https://img.shields.io/badge/Local%20Workbench-Compatible-green.svg )
![Hosted Workbench Compatible ](https://img.shields.io/badge/Hosted%20Workbench-Compatible-green.svg )
2022-02-16 21:47:07 -05:00
![Compatible with Remote Containers ](https://img.shields.io/badge/Remote%20Containers-Compatible-green.svg )
2018-02-26 03:23:44 -05:00
## Applies to
2022-10-24 09:42:45 -04:00
* [SharePoint Framework ](https://learn.microsoft.com/sharepoint/dev/spfx/sharepoint-framework-overview )
* [Microsoft 365 tenant ](https://learn.microsoft.com/sharepoint/dev/spfx/set-up-your-development-environment )
2018-02-26 03:23:44 -05:00
## Prerequisites
2019-09-24 00:28:54 -04:00
If you are going to use tinymce be aware of it's license, and you must
2018-02-26 03:23:44 -05:00
agree to it.
## Solution
Solution|Author(s)
--------|---------
React-TinyMCE | @AustinBreslinDev
## Version history
Version|Date|Comments
-------|----|--------
1.0|Feb |Initial release
## Minimal Path to Awesome
- Clone this repository
- in the command line run:
- `npm install`
- `gulp serve`
2021-04-26 02:08:59 -04:00
- `add web part to page`
2018-02-26 03:23:44 -05:00
2022-02-16 21:47:07 -05:00
> This sample can also be opened with [VS Code Remote Development](https://code.visualstudio.com/docs/remote/remote-overview). Visit https://aka.ms/spfx-devcontainer for further instructions.
2018-02-26 03:23:44 -05:00
## 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.
2020-04-04 02:18:47 -04:00
- Uses an Open Source, community-driven Editor.
2018-02-26 03:23:44 -05:00
- Can be extended to accept copy/paste from using Paste Plugin.
- Can be extended to accept images using the manager in the Editor.
2019-09-24 00:28:54 -04:00
- Can write your own Styles for all content on your site.
2018-02-26 03:23:44 -05:00
- Can style your authoring experience using the skins folder.
- For more features please look at the extensive list of extensions available.
2021-11-07 01:54:14 -05:00
## 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.**
2021-12-20 10:25:30 -05:00
< img src = "https://pnptelemetry.azurewebsites.net/sp-dev-fx-webparts/samples/React-TinyMce" / >