The ribbon editor

The ribbon editor is the core. What the preview shows is what Excel renders later.

Structure

A ribbon has tabs, holding groups, holding controls. Excel dictates that nesting, not us. There is no group without a tab and no control without a group.

Available controls: button, toggle button, check box, menu, split button, edit box, combo box, drop-down, label and separator.

Where your tab appears

Under position you decide whether your tab goes last, straight after Home, or whether Excel's own tabs are hidden and only yours remain. The last option is for applications that replace Excel's interface entirely. It does not hide File; Excel does not allow that.

Individual tabs can additionally anchor themselves to a built-in tab. Set both and validation reports the contradiction.

Contextual tabs

A tab can also appear only while something specific is selected – the way Excel shows Table Tools over a table. In the tab's property panel under Shows, choose when: for a table, a chart, a PivotTable, a picture, a shape and so on. Your tab then sits next to Excel's own tabs under the same coloured header, and Excel shows and hides it by itself. No code is needed.

An add-in cannot create a new header of its own, only join one of the existing ones. Contextual tabs have no position setting; Excel places them within the set itself.

Groups in Excel's own tabs

Shows also lists each of Excel's main tabs: Home, Insert, Data and so on. Pick one and your add-in gets no tab of its own; its groups go at the end of the chosen Excel tab instead. The tab's name, position and visibility then belong to Excel and are not exported. Several tabs naming the same Excel tab are merged.

Without anything further, Excel puts your group at the end of the tab. In the group's property panel, Position in the Excel tab picks another place: at before or after one of Excel's groups, such as after Clipboard. Only groups that exist in the chosen tab are offered; switch the tab and a position that no longer fits is dropped. Groups whose name differs between Excel versions (such as "Get & Transform Data") are not in the list. Add-ins and Help have no fixed groups, so there it is the end only.

If position is set to show only your own tabs, Excel hides its tabs. The one you put groups into stays visible anyway – you chose it explicitly.

Icons

Three sources in one picker:

• Bootstrap is the default. The SVG is rasterised into 16 and 32 pixel PNGs at export time and embedded in the file.
• imageMso are Office's own icons. No image travels with the file, Excel draws them at runtime. The editor preview is an approximation; the tooltip always carries the real name.
• Your own uploads as PNG, embedded like Bootstrap icons.

Large buttons without an icon look empty in Excel. Validation points that out.

Your own icon library

Under Icons you create folders — "Navigation", "Warnings", whatever fits your work. A folder shows up as a tab under My icons in every project's picker.

A folder holds three kinds of entry:

• Your own uploads as PNG.
• Icons from the catalogues, via From catalogue. The colour is saved with them. The same Bootstrap icon in three colours is three entries, and each one can still be adjusted later through Change colour.
• Combined icons from the icon designer (see below).

A catalogue entry stores no image, only the reference to the icon plus the colour. It stays a vector, does not count against your storage, and the colour can be changed without re-rendering anything.

That is the point: set your palette up once, then pick from it in every project. A colour you only set inside a project stays tied to that project — in the library it stays yours.

Deleting a folder does not delete its icons; they end up under No folder afterwards. That is deliberate: for an upload it would be the only copy of the file.

Combining icons

One icon plus a small badge in a corner — a file with a download arrow, a table with an info sign. That is what the icon designer is for:

• in the picker, via Icon designer at the top (opens the icon library in a new tab; whatever you save there is under My icons when you switch back),
• in the icon library, via Design icon,
• directly on a control, via the layers button next to Choose icon. The result then belongs to that control only.

You pick a main icon and a badge, each from Bootstrap, Streamline, the Office icons or your own icons under My icons — your company logo with a download arrow, say — plus the corner and the badge size (40–70 %). The preview also shows 16 and 32 px, the sizes the ribbon uses.

The main icon is removed under the badge, across its whole area: whatever a closed outline encloses (the circle of info-circle) counts, and a translucent badge does not show the main icon through. Knock out adds a narrow gap that follows the badge's shape. Open shapes, such as an arrow without a frame, have no inside; filled badges (…-fill) stand out best.

No image is stored, only the two icons and their settings. Colours stay editable; in the library, Change colour reopens the designer.

Two things differ from a plain Office icon: a combined icon with an Office layer is embedded in the add-in as an image rather than drawn by Excel, so it does not follow Office's dark theme. And Office layers and your own icons cannot be recoloured.

Your own icons used as a layer travel when you share: a project or library file carries the images, and on a colleague's side they land in their own storage. Deleting one of your icons that a combined icon in the library still uses keeps the file for that icon. The designer only offers Office icons for which a bitmap exists.

Dynamic state

A control can depend on what is going on: enabled only when several cells are selected, visible only with a workbook open, or with a label that comes from an expression. That generates the matching getEnabled, getVisible and getLabel callbacks.

Whole groups and tabs can be shown and hidden the same way, under Visible when in the property panel. They cannot be greyed out; Excel only offers that for individual controls.

The choices are: a workbook is open, the selection is a cell range, more than one cell is selected, the sheet is not protected, the selection is in a table, the active sheet has a given name – and a custom VBA expression for anything else.

Rules are re-checked after every action in the add-in and, as soon as there is one, on every selection, sheet and workbook change too. For that the export adds a small class module, clsRibbonEvents. What Excel does not report, such as protecting a sheet, shows up at the next of those moments; your own code can call Ribbon_Refresh_… from the Callbacks module at any time.

Cell preview

Under the ribbon view sits the cell preview. Drop an Excel file (.xlsx or .xlsm) into it or choose one with the button, and you see it the way Excel shows it: name box, formula bar, column and row headers and the sheet tabs. Select a range with the mouse or the arrow keys (with Shift), or type it into the name box.

What it is for: actions such as Clear a range, Filter or Save a range as CSV ask for a sheet and a range. Instead of typing both from memory, click Use selection from cell preview on the step. Sheet and range (for a cell field, the top-left cell) are filled in. Fields that are asked at click time stay as they are.

The file stays in your browser. It is neither uploaded nor saved in the project; after a reload you drop it in again. Formulas are not calculated: you see the value Excel stored, and the formula in the formula bar. Macros in an .xlsm are not touched. The old .xls and .xlsb formats are not read by the preview, save them as .xlsx in Excel. The file may be up to 50 MB. The preview is available in every plan.

Validation

The button next to the export checks the whole project: duplicate ids, empty groups, missing labels, procedure names that collide (also between a control id and a Sub), and VBA bodies without an entry point. Errors stop the export, warnings do not. Clicking a finding jumps to the place it came from, across areas too.

In the structure tree on the left, findings sit right at their row. A yellow “!” is a warning: the project still exports, for example with an empty group. A red “✕” is an error and stops the export. The mark is passed up to the group and the tab so you see it even with collapsed branches: a “!” on a tab only means something inside it needs a look. Hover it to see why. The green dot shows where you are: the selected item, the one being edited on the right.