PHPackages                             nathancox/codeeditorfield - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. nathancox/codeeditorfield

ActiveSilverstripe-vendormodule[Utility & Helpers](/categories/utility)

nathancox/codeeditorfield
=========================

A field for editing code and JSON in the SilverStripe CMS using Ace Editor (http://ace.c9.io/)

2.0.1(10mo ago)2549.4k↓62.2%12[5 issues](https://github.com/nathancox/silverstripe-codeeditorfield/issues)[1 PRs](https://github.com/nathancox/silverstripe-codeeditorfield/pulls)5BSD-3-ClauseJavaScript

Since Nov 8Pushed 10mo ago2 watchersCompare

[ Source](https://github.com/nathancox/silverstripe-codeeditorfield)[ Packagist](https://packagist.org/packages/nathancox/codeeditorfield)[ Docs](https://github.com/nathancox/silverstripe-codeeditorfield)[ RSS](/packages/nathancox-codeeditorfield/feed)WikiDiscussions master Synced 2d ago

READMEChangelog (7)Dependencies (1)Versions (12)Used By (5)

SilverStripe CodeEditorField
============================

[](#silverstripe-codeeditorfield)

This module adds a CodeEditorField that uses Ace Editor () to let you edit code (mostly HTML or JavaScript). [Try it out here](https://ace.c9.io/build/kitchen-sink.html). It comes in two forms:

- A regular CodeEditorField that can be used on an HTMLText field similar to HTMLEditorField
- An optional replacement code view for TinyMCE that uses a CodeEditorField

Maintainer Contacts
-------------------

[](#maintainer-contacts)

Nathan Cox ()

Requirements
------------

[](#requirements)

- SilverStripe 3.1+

Documentation
-------------

[](#documentation)

[GitHub](https://github.com/nathancox/silverstripe-codeeditorfield/wiki)

Installation Instructions
-------------------------

[](#installation-instructions)

1. Place the files in a directory called codeeditorfield in the root of your SilverStripe installation. You can most easily do this with `composer require nathancox/codeeditorfield`
2. Configure your site's `config.yml` to define your defaults (optional).
3. Visit yoursite.com/dev/build to rebuild the database

Usage Overview
--------------

[](#usage-overview)

Configuration via `config.yml`:

```
---
Name: codeeditorfield
---

CodeEditorField:
    # These are the pre-defined defaults for dark/light themes
    default_dark_theme: 'monokai'
    default_light_theme: 'github'

    # This will overwrite the above settings
    default_theme: 'tomorrow'

```

Using CodeEditorField in getCMSFields:

```

$fields->addFieldToTab('Root.Content', $codeField = new CodeEditorField('Configuration', 'Configuration'));
// set the field to use the full width of the CMS (optional, not included in screenshot)
$codeField->addExtraClass('stacked');

// set the height of the field (defaults to 8)
$codeField->setRows(30);

// set the syntax mode to yaml (defaults to html)
$codeField->setMode('yaml');

// optional - set theme (see codeeditorfield/thirdparty/ace/src-noconflict/theme-xxx.js files for available themes)
$codeField->setTheme('twilight');
```

produces the following:

[![example codeeditorfield](./screenshot.png)](./screenshot.png)

**Note: If you opt not to set `default_theme` and don't set the theme specifically on the field, you will have the option to toggle between Dark and Light.**

To replace the code editor in TinyMCE:

```
// copy this into your project's getCMSFields

HtmlEditorConfig::get('cms')->enablePlugins(array(
	'aceeditor' => sprintf('../../../codeeditorfield/javascript/tinymce/editor_plugin_src.js')
));
HtmlEditorConfig::get('cms')->insertButtonsBefore('fullscreen', 'aceeditor');
HtmlEditorConfig::get('cms')->removeButtons('code');
```

Known Issues
------------

[](#known-issues)

[Issue Tracker](https://github.com/nathancox/silverstripe-codeeditorfield/issues)

###  Health Score

48

—

FairBetter than 93% of packages

Maintenance49

Moderate activity, may be stable

Popularity40

Moderate usage in the ecosystem

Community21

Small or concentrated contributor base

Maturity70

Established project with proven stability

 Bus Factor1

Top contributor holds 82.1% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~395 days

Recently: every ~725 days

Total

10

Last Release

328d ago

Major Versions

1.x-dev → v2.x-dev2018-01-11

v2.x-dev → v3.x-dev2025-08-09

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/194315?v=4)[Nathan Cox](/maintainers/nathancox)[@nathancox](https://github.com/nathancox)

---

Top Contributors

[![nathancox](https://avatars.githubusercontent.com/u/194315?v=4)](https://github.com/nathancox "nathancox (23 commits)")[![andrewandante](https://avatars.githubusercontent.com/u/9702648?v=4)](https://github.com/andrewandante "andrewandante (3 commits)")[![sheadawson](https://avatars.githubusercontent.com/u/1166136?v=4)](https://github.com/sheadawson "sheadawson (2 commits)")

---

Tags

silverstripecmsformformfield

### Embed Badge

![Health badge](/badges/nathancox-codeeditorfield/health.svg)

```
[![Health](https://phpackages.com/badges/nathancox-codeeditorfield/health.svg)](https://phpackages.com/packages/nathancox-codeeditorfield)
```

###  Alternatives

[lekoala/silverstripe-cms-actions

Add actions to your models in SilverStripe

39344.8k31](/packages/lekoala-silverstripe-cms-actions)[sunnysideup/typography

Add a typography test page to your silverstripe website / application.

124.4k4](/packages/sunnysideup-typography)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)