Migrieren von Webinterface-Features nach StoreFront
Für viele Webinterface-Anpassungen gibt es Entsprechungen in StoreFront über JavaScript-Optimierungen, veröffentlichten Citrix APIs oder der StoreFront-Verwaltungskonsole.
Die folgende Tabelle enthält eine Übersicht über die Anpassungen und grundlegende Informationen darüber, wie sie programmiert werden.
Ordnerpfade
-
Für Skript-Anpassungen fügen Sie die Beispiele in die Datei script.js in folgendem Ordner ein:
C:\inetpub\wwwroot\Citrix\StoreNameWeb\custom
-
Für Stil-Anpassungen fügen Sie die Beispiele in die Datei style.css in folgendem Ordner ein:
C:\inetpub\wwwroot\Citrix\StoreNameWeb\custom
-
Für dynamischen Inhalt fügen Sie den dynamischen Kontext in einer Textdatei in folgendem Ordner ein:
C:\inetpub\wwwroot\Citrix\StoreNameWeb\customweb
-
In Bereitstellungen mit mehreren Servern können Sie alle Änderungen über die StoreFront-Verwaltungskonsole oder PowerShell auf die anderen Server replizieren.
Hinweis:
In Webinterface können einzelne Benutzer verschiedene Einstellungen anpassen. Das ist derzeit in StoreFront nicht möglich. Eine solche Möglichkeit kann zwar durch umfassendere Anpassungen geschaffen werden, dies ist jedoch nicht Gegenstand des vorliegenden Artikels.
Webinterface-Funktion | StoreFront-Äquivalent |
---|---|
Anpassung per Verwaltungskonsole | |
Layout mit reduziertem Grafikinhalt, Layout mit kompletten Grafikinhalt, Auswahl durch Benutzer | Nicht verfügbar StoreFront erkennt automatisch den Gerätebildschirm und passt die Benutzeroberfläche entsprechend an. |
Suche aktivieren, Suche deaktivieren | Die Suche ist standardmäßig aktiviert. Zum Ausblenden der Suchfelder auf der Desktop-/Webbenutzeroberfläche fügen Sie der Datei style.css folgenden Stil hinzu: .search-container {display: none;} . Zum Ausblenden der Suchfelder auf der Telefonbenutzeroberfläche fügen Sie der Datei style.css folgenden Stil hinzu: #searchBtnPhone {display: none;} . |
Aktualisierung | Standardmäßig aktiviert (Browseraktualisierung). |
Rückkehr zum letzten Ordner | Nicht standardmäßig aktiviert. Zum Speichern des aktuellen Ordners und Zurückkehren zu diesem Ordner beim Laden fügen Sie der Datei script.js Folgendes hinzu: CTXS.Extensions.afterDisplayHomeScreen = function () { // check if view was saved last time CTXS.ExtensionAPI.localStorageGetItem("view", function (view) { if (view) { // if view was saved, change to it CTXS.ExtensionAPI.changeView(view); } if (view == "store") { // if view is store, see if folder was saved CTXS.ExtensionAPI.localStorageGetItem("folder", function(folder) { if (folder != "") { // if folder was saved, change to it CTXS.ExtensionAPI.navigateToFolder(folder); } } ); } // set up monitoring of folder CTXS.Extensions.onFolderChange = function(folder) { CTXS.ExtensionAPI.localStorageSetItem("folder", folder); }; // set up monitoring of view CTXS.Extensions.onViewChange = function(newview) { // don’t retain search or appinfo views // instead, remember parent view. if ((newview != "appinfo") && (newview != "search")) { CTXS.ExtensionAPI.localStorageSetItem( "view", newview); } }; }); };
|
QuickInfos | In der Citrix Workspace-App gibt es nur sehr wenige QuickInfos, da sie für Geräte mit und ohne Touchscreen vorgesehen ist. Sie können QuickInfos über ein benutzerdefiniertes Skript hinzufügen. |
Symbolansicht, Baumstrukturansicht, Detailansicht, Listenansicht, Gruppenansicht, Standardansicht festlegen, (niedrige Grafik) Symbolansicht, (niedrige Grafik) Listenansicht, (niedrige Grafik) Standardansicht | Die Citrix Workspace-App hat eine andere Benutzeroberfläche, daher gelten diese Optionen nicht. Sie können mit der StoreFront-Verwaltungskonsole Ansichten konfigurieren. Weitere Informationen finden Sie unter Angeben verschiedener Ansichten für Anwendungen und Desktops. |
Benutzeroberfläche auf einer einzelnen Registerkarte, Benutzeroberfläche auf Registerkarten (Registerkarte “App”, Registerkarte “Desktop”, Registerkarte “Inhalt”, (Tabulatorreihenfolge)) | Die Benutzeroberfläche der Citrix Workspace-App ist standardmäßig in Registerkarten unterteilt, wobei sich Apps und Inhalt auf einer Registerkarte und Desktops auf der anderen befinden. Es gibt außerdem eine optionale Registerkarte Favoriten. |
Kopfzeilenlogo, Textfarbe, Kopfzeilenhintergrundfarbe, Kopfzeilenhintergrundbild | Äquivalente für Farben und Logos bei Verwendung der StoreFront-Verwaltungskonsole. Klicken Sie in der StoreFront-Verwaltungskonsole im Bereich Aktionen auf Websitedarstellung anpassen und führen Sie Ihre Anpassungen auf dem angezeigten Bildschirm durch. Mit einer Stil-Anpassung können Sie als Kopfzeile ein Hintergrundbild festlegen. Zum Beispiel .theme-header-bgcolor { background-image: url('spirals.png'); }
|
Begrüßungsnachricht vor der Anmeldung (Pre-locale) (Titel, Text, Hyperlink, Schaltflächenbeschriftung) | Standardmäßig gibt es keinen eigenen Voranmeldungsbildschirm. Mit diesem Beispielskript wird ein Meldungsfenster zum Durchklicken hinzugefügt: var doneClickThrough = false; // Before web login CTXS.Extensions.beforeLogon = function (callback) { doneClickThrough = true; CTXS.ExtensionAPI.showMessage({ messageTitle: "Welcome!", messageText: "Only for \<a href="http://www.WWc.com" target="_blank"\>WWCo Employees", okButtonText: "Accept", okAction: callback }); }; // Before main screen (for native clients) CTXS.Extensions.beforeDisplayHomeScreen = function (callback) { if (!doneClickThrough) { CTXS.ExtensionAPI.showMessage({ messageTitle: "Welcome!", messageText: "Only for WWCo Employees", okButtonText: "Accept", okAction: callback }); } else { callback(); } };
|
Anmeldebildschirmtitel, Anmeldebildschirmnachricht, Anmeldebildschirmsystemmeldung | Es gibt vier Bereiche für Anpassungen auf dem Anmeldebildschirm bzw. den Anmeldebildschirmen: Bereich oben und unten im Bildschirm (Kopf- und Fußzeile) und Bereich oben und unten im Anmeldefeld selbst: .customAuthHeader, .customAuthFooter .customAuthTop, .customAuthBottom { text-align: center; color: white; font-size: 16px; } Beispielskript (statische Inhalte): \$('.customAuthHeader').html("Welcome to ACME"); . Beispielskript (dynamische Inhalte): function setDynamicContent(txtFile, element) { CTXS.ExtensionAPI.proxyRequest({ url: "customweb/"+txtFile, success: function(txt) {\$(element).html(txt);}}); } setDynamicContent("Message.txt", ".customAuthTop"); . Hinweis: Fügen Sie weder explizit im Skript noch im Verzeichnis custom dynamische Inhalte ein, da Änderungen hier ein Neuladen der Benutzeroberfläche auf allen Clients erzwingen. Fügen Sie dynamische Inhalte im Verzeichnis customweb ein. |
Anwendungsbildschirmbegrüßungsnachricht, Anwendungsbildschirmsystemnachricht | Siehe Beispiele für CustomAuth-Begrüßungsbildschirm oben. Sie Beispiele für dynamische Inhalte oben. Verwenden Sie #customTop anstelle von .customAuthTop , um Inhalt auf dem Homebildschirm zu platzieren. |
Fußzeilentext (alle Bildschirme) | Beispielskript: #customBottom { text-align: center; color: white; font-size: 16px; }** Example static content using a script: **\$('\#customBottom').html("Welcome to ACME");
|
Features ohne direkte Entsprechung | |
Anmeldebildschirm ohne Kopfzeilen, Anmeldebildschirm mit Kopfzeilen (einschließlich Nachrichten) | Es gibt keine direkte Entsprechung in StoreFront. Sie können jedoch benutzerdefinierte Kopfzeilen erstellen. Siehe Titel des Anmeldebildschirms oben. |
Benutzereinstellungen | Standardmäßig gibt es keine Benutzereinstellungen. Sie können Menüs und Schaltflächen über JavaScript hinzufügen. |
Workspace Control | Äquivalente Funktionalität für Administratoreinstellungen. Die Erweiterungs-APIs bieten viel zusätzliche Flexibilität. Siehe http://www.citrix.com/go/citrix-developer/storefront-receiver-developer-community/receiver-customization-api.html. |
Tiefgreifende Anpassung (Code) | |
Hooks für die ICA-Dateigenerierung und andere Anpassungen für das Aufrufrouting | Äquivalente oder bessere APIs. http://www.citrix.com/go/citrix-developer/storefront-receiver-developer-community/store-customization-sdk.html |
Authentifizierungsanpassungen | Äquivalente oder bessere APIs. http://www.citrix.com/go/citrix-developer/storefront-receiver-developer-community/store-authentication-sdks.html |
JSP-/ASP-Quellzugriff | Es gibt keine äquivalenten APIs in StoreFront, da die Benutzeroberfläche nicht auf die gleiche Weise gerendert wird. Es gibt zahlreiche JavaScript-APIs für die Anpassung der Benutzeroberfläche. |