Truthwillout.Umbraco.RteStylesManager
1.0.2
dotnet add package Truthwillout.Umbraco.RteStylesManager --version 1.0.2
NuGet\Install-Package Truthwillout.Umbraco.RteStylesManager -Version 1.0.2
<PackageReference Include="Truthwillout.Umbraco.RteStylesManager" Version="1.0.2" />
<PackageVersion Include="Truthwillout.Umbraco.RteStylesManager" Version="1.0.2" />
<PackageReference Include="Truthwillout.Umbraco.RteStylesManager" />
paket add Truthwillout.Umbraco.RteStylesManager --version 1.0.2
#r "nuget: Truthwillout.Umbraco.RteStylesManager, 1.0.2"
#:package Truthwillout.Umbraco.RteStylesManager@1.0.2
#addin nuget:?package=Truthwillout.Umbraco.RteStylesManager&version=1.0.2
#tool nuget:?package=Truthwillout.Umbraco.RteStylesManager&version=1.0.2
RTE Styles Manager for Umbraco
A visual dashboard for managing Rich Text Editor styles and colours in Umbraco 13.
Features
- Colour picker for each style with live preview
- Add, edit, and delete styles easily
- Group styles into collapsible categories (Headers, Text, etc.)
- Reorder styles with up/down arrows
- Automatically generates CSS files for both the backoffice and frontend
- Updates
rte-style-formats.jsonand syncs with TinyMCE configuration
Installation
dotnet add package Truthwillout.Umbraco.RteStylesManager
Build your project after installing. The package will automatically copy the required files to your project:
App_Plugins/RteStyleManager/- Dashboard UI fileswwwroot/css/rteFrontendStyles.css- Frontend styleswwwroot/css/rteBackofficeStyles.css- Backoffice RTE editor stylesrte-style-formats.json- Default style configuration
Setup
1. Add the frontend CSS to your layout
Add the following line to the <head> of your master layout (e.g. Views/master.cshtml) so that the RTE styles display correctly on your published pages:
<link href="/css/rteFrontendStyles.css" rel="stylesheet">
2. Restart and open the dashboard
After installing and building, restart your Umbraco application. The dashboard will be available in the backoffice under Settings > RTE Styles Manager.
Usage
- Go to Settings > RTE Styles Manager in the Umbraco backoffice
- Add or edit styles using the colour picker and form fields
- Organise styles into categories - collapse/expand them by clicking the category header
- Click Save Configuration to save your changes and generate the CSS files
- Restart your Umbraco application for the styles to appear in the RTE format dropdown
Important: After saving changes in the dashboard, you must restart the Umbraco application for the style format dropdown in the Rich Text Editor to update. The CSS files update immediately, but the TinyMCE style_formats configuration is loaded on application startup.
How it works
- Styles are stored in
rte-style-formats.jsonin your project root - On save, CSS is generated and written to
wwwroot/css/rteFrontendStyles.cssandwwwroot/css/rteBackofficeStyles.css - On application startup, the package reads
rte-style-formats.jsonand sets the TinyMCEstyle_formatsandcontent_cssconfiguration - The backoffice RTE editor loads
rteBackofficeStyles.cssso styles are visible while editing - The frontend loads
rteFrontendStyles.cssto display styles on published pages
Requirements
- Umbraco 13.0+
- .NET 8.0
License
MIT License - Copyright Truthwillout 2025
| Product | Versions Compatible and additional computed target framework versions. |
|---|---|
| .NET | net8.0 is compatible. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. net9.0 was computed. net9.0-android was computed. net9.0-browser was computed. net9.0-ios was computed. net9.0-maccatalyst was computed. net9.0-macos was computed. net9.0-tvos was computed. net9.0-windows was computed. net10.0 was computed. net10.0-android was computed. net10.0-browser was computed. net10.0-ios was computed. net10.0-maccatalyst was computed. net10.0-macos was computed. net10.0-tvos was computed. net10.0-windows was computed. |
-
net8.0
- Umbraco.Cms.Web.BackOffice (>= 13.0.0 && < 14.0.0)
- Umbraco.Cms.Web.Common (>= 13.0.0 && < 14.0.0)
- Umbraco.Cms.Web.Website (>= 13.0.0 && < 14.0.0)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
| Version | Downloads | Last Updated |
|---|---|---|
| 1.0.2 | 24 | 2/17/2026 |
| 1.0.1 | 28 | 2/17/2026 |
| 1.0.0 | 43 | 2/16/2026 |
| 1.0.0-beta.7 | 40 | 2/16/2026 |
| 1.0.0-beta.6 | 32 | 2/16/2026 |
| 1.0.0-beta.5 | 35 | 2/16/2026 |
| 1.0.0-beta.4 | 33 | 2/16/2026 |
| 1.0.0-beta.3 | 31 | 2/16/2026 |
| 1.0.0-beta.2 | 34 | 2/16/2026 |
| 1.0.0-beta.1 | 39 | 2/16/2026 |