Native Sidebar-Navigation

Aktiviere ein natives ausklappbares Sidebar-Menü mit eigenen Links und SF-Symbols-Icons — konfiguriert über Sidebar.json.

Neben dem nativen Navigation Footer bringt WebViewGold eine native ausklappbare Sidebar mit, mit der du eine App-typische Navigation anbieten kannst, ohne deine Website anzupassen. Ein schwebender Menü-Button öffnet eine Sidebar mit deinen Links — jeder Eintrag navigiert die Haupt-WebView zu der von dir hinterlegten URL.

Aktivierung:

Setze die folgende Option in Config.swift:

var enableSidebar = true

Konfiguration:

Öffne Sidebar.json im Xcode-Projekt und definiere das Farbschema sowie die Menüeinträge:

{
   "colour":"dark",
   "layout":[
      {
         "redirection_link":"https://example.org/home",
         "sf_symbol":"house",
         "name": "Home"
      },
      {
         "redirection_link":"https://example.org/shop",
         "sf_symbol":"cart",
         "name": "Shop"
      }
   ]
}

Schlüssel

Beschreibung

colour

Farbschema der Sidebar: dark oder light.

redirection_link

URL, die in der Haupt-WebView geladen wird, wenn der Eintrag angetippt wird.

sf_symbol

Icon-Name aus Apples SF-Symbols-Bibliothek (z. B. house, cart, wrench.and.screwdriver).

name

Beschriftung des Sidebar-Eintrags.

Verhalten:

Ein schwebender Button öffnet und schließt die Sidebar über deinem Web-Inhalt.
Ein Tipp auf einen Eintrag lädt die zugehörige URL in der Haupt-WebView — deine Web-App verlässt also nie die App-Hülle.
Die Sidebar lässt sich mit dem nativen Navigation Footer kombinieren oder unabhängig davon nutzen.

Implementierungshinweise im SDK-Stil

Betrachte diese Funktion als native Fähigkeit, die deiner Web-Ebene bereitgestellt wird: Behalte deine Produktivwebsite oder PWA als zentrale Quelle bei und nutze anschließend die dokumentierten WebViewGold-Konfigurationsflags, URL-Befehle und JavaScript-Bridge-Aufrufe, um natives iOS-Verhalten nur dort zu aktivieren, wo es einen Mehrwert bietet. So bleibt deine Codebasis wartbar, da dieselbe Webanwendung mit minimaler Fallunterscheidung Browser, WebViewGold für iOS und die übrigen WebViewGold-Plattformen bedienen kann.

Für zuverlässige Ergebnisse empfehlen sich HTTPS-Endpunkte, stabile Routennamen, explizite Erfolgs-/Fehlerzustände in deiner UI sowie kleine JavaScript-Hilfsfunktionen, die native Aufrufe kapseln. Beispielsweise kann eine mit jQuery Mobile, Lovable, Base44, Bolt, WordPress, Bubble, einem eigenen React-/Vue-/Angular-Stack oder statischem HTML erstellte Web-App eine einzelne Schaltfläche oder einen Event-Handler bereitstellen, der die native WebViewGold-API auslöst und dennoch einen sauberen Browser-Fallback zeigt.

Empfohlenes Integrationsmuster: Erkenne den App-Kontext, rufe die WebViewGold-API auf und aktualisiere anschließend deine Web-UI nach dem nativen Callback oder Routenwechsel.
Test-Checkliste: Prüfe die Funktion auf einem echten Gerät oder in einem paketierten Build, überprüfe Berechtigungen und Store-Prüftexte und stelle sicher, dass reine Browser-Nutzer weiterhin einen sinnvollen Fallback erhalten.
SEO-Vorteil: Halte Feature-Seiten, Routentitel und strukturierte Inhalte auf deiner Website indexierbar, während WebViewGold die native App-Hülle für iOS-Nutzer bereitstellt.

Native Sidebar-Navigation

Implementierungshinweise im SDK-Stil

Zu wenig Zeit? Wir richten deine App für dich ein.

Im Browser erstellen