PHPackages nathancox/contentgrid - 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. nathancox/contentgrid ActiveSilverstripe-module nathancox/contentgrid ===================== Adds TinyMCE buttons for creating content structured in grids/columns. 4.0.0(8y ago)5723[5 issues](https://github.com/nathancox/silverstripe-contentgrid/issues)MITJavaScript Since Aug 31Pushed 8y ago2 watchersCompare [ Source](https://github.com/nathancox/silverstripe-contentgrid)[ Packagist](https://packagist.org/packages/nathancox/contentgrid)[ Docs](https://github.com/nathancox/silverstripe-contentgrid)[ RSS](/packages/nathancox-contentgrid/feed)WikiDiscussions master Synced 2mo ago READMEChangelog (3)Dependencies (1)Versions (6)Used By (0) SilverStripe ContentGrid Module =============================== [](#silverstripe-contentgrid-module) Adds TinyMCE buttons for creating content structured in grids/columns. You create your own grid markup and classes. Grid rows aren't nestable (yet) and assume assume all the content in the field will be stored in grid rows (you can't have content that isn't in one) so make sure to provide a "100% width" option. **This module is still work in progress** [![example of contentgrid in TinyMCE](./docs/content-grid-1.png)](./docs/content-grid-1.png) Maintainer Contact ------------------ [](#maintainer-contact) - Nathan Cox Requirements ------------ [](#requirements) - silverstripe/cms >=4.0 Installation ------------ [](#installation) `composer require "nathancox/contentgrid"` You will have to make your own grid CSS in your site's theme, this module doesn't provide one. The module inserts the following markup: ``` ... ``` So basically a wrapper div with a div in it for each column. {your-row-class} is a class specific to each row layout, such as "two-column" for two equal width columns or "with-sidebar" for a content column and a sidebar column. Whatever your needs and grid system require. In future these class names should be configurable but for now it always uses `.content-row` and `.grid-row`. Make sure your grid styles are accessible in editor.css so they work in TinyMCE. To set up the row dropdown options set the row\_types property in your yml config: ``` NathanCox\ContentGrid\ContentGrid: row_types: full-width: # "twelve" is the name of the {your-row-class} added to the row's element. cells: 1 # The number of cells on this row. In this case a single full-width column. text: 1 # The label the user will see in the dropdown. two-columns: cells: 2 text: 1-1 with-sidebar: cells: 2 text: 2-1 cell_classes: # Specify classes for each cell/column in order. - content - sidebar three-columns: cells: 3 text: 1-1-1 cell_classes: - left # First column - # No class for the second column - right # Third column ``` Additional configuration options and their defaults: ``` NathanCox\ContentGrid\ContentGrid: first_class: "first" # Set the class to be added to the first cell of every row. Defaults to "first". last_class: "first" # Set the class to be added to the last cell of every row. Defaults to "last". insert_at_end: false # Set this to true to always insert new rows at the end fo the page instead of after the current row. enabled: true # Enable ContentGrid for all HTMLEditorFields. See below. ``` If `enabled` is set to `true` then this module will apply to all HTMLEditorFields. Individual fields can be excluded be excluded by using `$field->setAttribute('data-content-grid', 'false')`. If `enabled` is `false` then grids can be enabled for individual HTMLEditorFields by using `$field->setAttribute('data-content-grid', 'false')`. Usage ----- [](#usage) - Only content inside grid cells is editable. That means at least one grid row has to be inserted before any content can be put on the page. - Insert a row by picking an option from the *Insert a row* dropdown. The new row will either be added at the bottom of the content or immediately after the currently selected row, depending on configuration. - Use the *Move up* and *Move down* buttons to move the currently selected row up or down the page. - Use the *Delete* button to delete the current row and all it's content. - Once you've inserted a row you can't change the number or layout of it's columns. You'll have to insert a new row and copy the content in to that instead. Known Issues ------------ [](#known-issues) [Issue Tracker](https://github.com/nathancox/silverstripe-contentgrid/issues) ### Health Score 26 — LowBetter than 43% of packages Maintenance0 Infrequent updates — may be unmaintained Popularity15 Limited adoption so far Community10 Small or concentrated contributor base Maturity67 Established project with proven stability Bus Factor1 Top contributor holds 100% 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 ~17 days Total 3 Last Release 3145d ago Major Versions v1.0.0 → 4.0.02017-08-31 ### Community Maintainers ![](https://www.gravatar.com/avatar/7180a8cd979165ae26632d1b0145cd4f720c5a4946692231009995b103897a2b?d=identicon)[nathancox](/maintainers/nathancox) --- Top Contributors [![nathancox](https://avatars.githubusercontent.com/u/194315?v=4)](https://github.com/nathancox "nathancox (20 commits)") --- Tags silverstripecontenttinymce ### Embed Badge ![Health badge](/badges/nathancox-contentgrid/health.svg) ``` [![Health](https://phpackages.com/badges/nathancox-contentgrid/health.svg)](https://phpackages.com/packages/nathancox-contentgrid) ``` ### Alternatives [silverstripe/multiuser-editing-alert A module that indicates when people are editing the same page in the CMS 1530.7k1](/packages/silverstripe-multiuser-editing-alert)[nobrainerweb/silverstripe-content-blocks Split your page content into manageable blocks/sections of content, each with their own template 301.5k](/packages/nobrainerweb-silverstripe-content-blocks)[unclecheese/mock-dataobjects Allows DataObjects to self-populate intelligently using fake data 183.7k](/packages/unclecheese-mock-dataobjects) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)