2017 © Pedro Peláez
 

silverstripe-module silverstripe-htmleditorfield-extras

Add some extra functionality to HTMLEditorFields in Silverstripe

image

milkyway/silverstripe-htmleditorfield-extras

Add some extra functionality to HTMLEditorFields in Silverstripe

  • Wednesday, December 4, 2013
  • by mi3ll
  • Repository
  • 1 Watchers
  • 4 Stars
  • 474 Installations
  • JavaScript
  • 0 Dependents
  • 0 Suggesters
  • 1 Forks
  • 1 Open issues
  • 1 Versions
  • 0 % Grown

The README.md

HTMLEditorField extras

This module adds some new functionality to the HTMLEditorFields in Silverstripe, (*1)

Requirements

  • SilverStripe 3.1

Features

  • Add Google link tracking to a link in the CMS
  • Add modal toggling to a link in the CMS (still in progress, relies on Twitter Bootstrap)
  • Allows accepting classes from Textarea to be inserted into HTMLEditorField body
  • Set different content css for each HTMLEditorField
  • Set a max length on HTMLEditorField

Install using composer

composer require milkyway/silverstripe-htmleditorfield-extras:*

Setting up

Adding classes to the HTMLEditorField iframe

Setting up your HTMLEditorField for different parts of your site (such as emails and website, which usually use different stylesheets), can be tiring. This solution will add a class to the HTMLEditorField iframe body, so that you can change the styles but use the one stylesheet (this is especially easy to do with LESS/SCSS using imports), (*2)

$editor = HTMLEditorField::create('Content')->setAttribute('data-tinymce-classes', 'email-body print');

Overwriting the content css for a HTMLEditorField

If the above method is not enough, you can also overwrite the content_css of the HTMLEditorField by setting the data attribute data-tinymce-content-css:, (*3)

$editor = HTMLEditorField::create('Content')->setAttribute('data-tinymce-content-css', '/here/there/layout.css');

Setting a max length to a HTMLEditorField

Now your HTMLEditorField will use the max length set on the textarea:, (*4)

$editor = HTMLEditorField::create('Content')->setAttribute('maxlength', 255);

I have added some other configuration as well, so that you can display how many characters remain. To add an indicator, set the following on your editor:, (*5)

$editor->setAttribute('data-tinymce-maxlength-indicator', true);

That will use the default indicator (which is the JS notifications, which may get annoying). To use a custom indicator, you can use the ID of the element to fill with text instead:, (*6)

$editor->setAttribute('data-tinymce-maxlength-indicator', '#Content-MaxLength-Indicator');

The settings in this module use classes on the HTMLEditorField. To allow google link tracker, add the class google-link-tracking to the HTMLEditorField., (*7)

$editor = HTMLEditorField::create('Content')->addExtraClass('google-link-tracking');

Extras

I have added some utility classes for removing the buttons you won't need in certain situations. Adding these classes to HTMLEditorField will change the HTMLEditorField (it will only remove using CSS, so JS calls can still call them...), (*8)

  • email-friendly : Remove the 'Styles' dropdown
  • limited : Remove most buttons (the last 2 lines) except the bold, italic, underline, strike through, styles, hr & charmap
  • limited-with-links : Same as limited, but keeps the links plugin

The Versions

04/12 2013

dev-master

9999999-dev

Add some extra functionality to HTMLEditorFields in Silverstripe

  Sources   Download

BSD-3-Clause

The Requires

 

by Mellisa Hankins

tinymce silverstripe htmleditorfield