29 votes

Matryoshka - tabs for Umbraco 8

Do you miss your tabs after upgrading to Umbraco 8? Matryoshka is the answer!

Matryoshka enables you to layer your document type properties in tabs and groups. It substitutes the content editor view, with its own view, to make existing groups appear as tabs, and adds a property editor, which gives the impression of groups.


Release Notes


  • #28 First group seperator doesn't appear in tab drop-down bug
  • #25 Spacing misalignment
  • #24 Nothing happens when I click on the dropdown


  • Tabs are now also available in the member section, media section, and Doc Type Grid Editor dialogs
  • A somewhat embarassing mistake was fixed by @MiguelLopez6, and the scroll-to-group feature was improved too (#24)
  • Groups are now collapsible if you configure them to be
  • Groups in tab drop-downs are also configurable


  • Optimized look for Group Separators inside Nested Content (#5)
  • Fixed a bug where all tabs got hidden after editing document types inline. (#15)
  • Same fix applies to a bug when editing in split views (#18)
  • Added a cachebusting parameter when loading the view for the tabbed directive. (#16)
  • Added dropdowns on tabs with multiple groups inside (#19)


#2 Added style so the Grid RTE isn't covered - thanks @AndersBrohus-MySupport
#8 Removed blue-border on focus (tested on Chrome) - thanks @renetruelsen
#6 Adds a NuGet package (https://www.nuget.org/packages/Our.Umbraco.Matryoshka)
#7 Fixed bug where insertion of media in RTEs was broken
#9 #11 #14 Fixed bug where overlays was hidden behind the content area
#13 Fixed bug where property validation didn't work
#12 Hides overflowing tabs in a menu, just like the rest of the backoffice


Getting Started


Note: Matryoshka has been developed against Umbraco v8.4.0 and will support that version and above. It should work in v.8.0 and above too though.




Developers Guide

When installed, Matryoshka will change all your existing groups, to be shown as tabs. You can't switch between tabs/groups.

For faux group separations. You can add a datatype using the Matryoshka Group Separator property editor included in the package. When used, the separator will display the property name and description as a headline for your new faux group.





Have a question?

Dev Team

Special thanks

  • Thanks to Sebastiaan Janssen for creating and releasing Tabify which most of the tabbing functionality is based on.
  • Icon by Supalerk Laipawat


Package owner

Søren Kottal

Søren Kottal

Søren has 3285 karma points

Package Compatibility

This package is compatible with the following versions as reported by community members who have downloaded this package:
Untested or doesn't work on Umbraco Cloud
Version 8.7.x (untested)
Version 8.6.x (100%)
Version 8.5.x (100%)
Version 8.4.x (100%)
Version 8.3.x (100%)
Version 8.2.x (100%)
Version 8.1.x (100%)
Version 8.0.x (100%)
Version 7.15.x (0%)
Version 7.14.x (untested)
Version 7.13.x (untested)
Version 7.12.x (untested)
Version 7.11.x (untested)
Version 7.10.x (untested)
Version 7.9.x (untested)
Version 7.8.x (untested)
Version 7.7.x (untested)
Version 7.6.x (untested)
Version 7.5.x (untested)
Version 7.4.x (untested)
Version 7.3.x (untested)
Version 7.2.x (untested)
Version 7.1.x (untested)
Version 7.0.x (untested)
Version 6.2.x (untested)

You must login before you can report on package compatibility.

Package Information

  • Package owner: Søren Kottal
  • Created: 14/01/2020
  • Current version 0.4.0
  • .NET version 4.7.2
  • License MIT
  • Downloads on Our: 774
  • Downloads on NuGet: 7607
  • Total downloads : 8381

External resources