2017 © Pedro Peláez
 

silverstripe-module codeeditorfield

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

image

nathancox/codeeditorfield

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

  • Thursday, January 11, 2018
  • by nathancox
  • Repository
  • 2 Watchers
  • 21 Stars
  • 13,945 Installations
  • JavaScript
  • 7 Dependents
  • 2 Suggesters
  • 6 Forks
  • 6 Open issues
  • 9 Versions
  • 9 % Grown

The README.md

SilverStripe CodeEditorField

This module adds a CodeEditorField that uses Ace Editor (http://ace.c9.io/) to let you edit code (mostly HTML or JavaScript). Try it out here. It comes in two forms:, (*1)

  • 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

Nathan Cox (me@nathan.net.nz), (*2)

Requirements

  • SilverStripe 3.1+

Documentation

GitHub, (*3)

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

Configuration via config.yml:, (*4)


--- 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:, (*5)


$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:, (*6)

example codeeditorfield, (*7)

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., (*8)

To replace the code editor in TinyMCE:, (*9)


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

Issue Tracker, (*10)

The Versions

11/01 2018

dev-revert-13-SS4

dev-revert-13-SS4 https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

11/01 2018

v2.x-dev

2.9999999.9999999.9999999-dev https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

01/09 2017

dev-master

9999999-dev https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

01/09 2017

1.x-dev

1.9999999.9999999.9999999-dev https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

27/07 2017

1.3.1

1.3.1.0 https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

16/06 2017

1.3.0

1.3.0.0 https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

27/01 2017

1.2.0

1.2.0.0 https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

05/12 2015

1.1.1

1.1.1.0 https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield

09/11 2015

1.1

1.1.0.0 https://github.com/nathancox/silverstripe-codeeditorfield

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

  Sources   Download

BSD-3-Clause

The Requires

 

by Nathan Cox

form cms silverstripe formfield