bc61166267
- Introduced `MegaMenuMode` type and `normalizeMegaMenuMode` function to handle menu modes. - Updated `MegaMenuApplicationCustomizer` to accept `menuMode` property. - Enhanced `MegaMenuRenderer` to render flyout menus based on the selected mode. - Created new HTML previews for both flyout and mega menu modes. - Removed unused mock services and user custom action service interfaces.
63 lines
1.7 KiB
Markdown
63 lines
1.7 KiB
Markdown
# MegaMenu für klassische SharePoint-Seiten
|
|
|
|
Die Classic-Variante verwendet dieselbe Site-Collection-Konfiguration wie der moderne Application Customizer. Sie unterstützt `megaMenu` und `flyout`, wird aber unabhängig von SPFx über ScriptLink geladen.
|
|
|
|
## Dateien
|
|
|
|
- `megamenu-classic.css`
|
|
- `megamenu-services-standalone.js`
|
|
- `megamenu-classic.js`
|
|
|
|
Mit `build-classic.ps1` werden die Dateien nach `classic/dist` kopiert.
|
|
|
|
## Konfiguration
|
|
|
|
Die Classic-Variante liest die `ClientSideComponentProperties` der zentralen MegaMenu-Site-Action:
|
|
|
|
```json
|
|
{
|
|
"termSetId": "7948e6f9-7af4-431e-b6fe-328122f2746c",
|
|
"termSetName": "Global Navigation",
|
|
"cacheMinutes": 15,
|
|
"menuMode": "megaMenu",
|
|
"debug": false
|
|
}
|
|
```
|
|
|
|
`menuMode` erlaubt `megaMenu` oder `flyout`. `termSetId` hat Vorrang vor `termSetName`.
|
|
|
|
## Einbindung
|
|
|
|
Die drei Dateien beispielsweise nach `/SiteAssets/megamenu/` hochladen und in dieser Reihenfolge laden:
|
|
|
|
```html
|
|
<link rel="stylesheet" href="/SiteAssets/megamenu/megamenu-classic.css" />
|
|
<script src="/SiteAssets/megamenu/megamenu-services-standalone.js"></script>
|
|
<script src="/SiteAssets/megamenu/megamenu-classic.js"></script>
|
|
```
|
|
|
|
Die Einbindung kann über die Masterpage oder eine Site-scoped ScriptLink-CustomAction erfolgen. Der moderne SPFx Application Customizer wird auf klassischen Seiten nicht ausgeführt.
|
|
|
|
## Optionaler Container
|
|
|
|
Vor dem Laden kann ein anderer Zielcontainer gesetzt werden:
|
|
|
|
```html
|
|
<script>
|
|
window.MegaMenuConfig = {
|
|
containerId: 's4-titlerow',
|
|
debug: true
|
|
};
|
|
</script>
|
|
```
|
|
|
|
## Diagnose
|
|
|
|
```javascript
|
|
typeof window.MegaMenuServices
|
|
typeof window.MegaMenuClassic
|
|
window.MegaMenuClassic.reload()
|
|
```
|
|
|
|
Benutzer benötigen Leserechte auf den verwendeten Managed-Metadata-Termstore.
|