StoreFront

Migrer les fonctionnalités de l’Interface Web vers StoreFront

La plupart des personnalisations de l’Interface Web ont des équivalents dans StoreFront par le biais d’ajustements JavaScript, d’API publiées par Citrix ou de la console de gestion StoreFront.

Ce tableau contient une vue d’ensemble des personnalisations et des informations de base sur la manière de les réaliser.

Emplacements des dossiers

  • Pour les personnalisations de script, ajoutez les exemples au fichier script.js qui se trouve dans

    C:\inetpub\wwwroot\Citrix\StoreNameWeb\custom

  • Pour la personnalisation de style, ajoutez l’exemple au fichier style.css qui se trouve dans

    C:\inetpub\wwwroot\Citrix\StoreNameWeb\custom

  • Pour le contenu dynamique, ajoutez le contexte dynamique à un fichier texte dans

    C:\inetpub\wwwroot\Citrix\StoreNameWeb\customweb

  • Si vous disposez d’un déploiement à plusieurs serveurs, vous pouvez répliquer les modifications vers d’autres serveurs depuis la console d’administration StoreFront ou à l’aide de PowerShell.

Remarque :

L’interface Web permettait aux utilisateurs de personnaliser plusieurs paramètres. Actuellement, StoreFront ne propose pas cette capacité, et s’il est possible d’ajouter des personnalisations plus importantes pour prendre en charge cette fonctionnalité, il ne s’agit pas de l’objet de cet article.

Fonctionnalité de l’Interface Web Équivalent StoreFront
Personnalisation avec la console de gestion  
Disposition-Graphiques simplifiés, Disposition-Graphiques avancés, Autoriser les utilisateurs à choisir Sans objet. StoreFront détecte automatiquement et adapte l’interface utilisateur à l’écran de l’appareil.
Activer la recherche, Désactiver la recherche La recherche est activée par défaut. Pour désactiver les zones de recherche sur le bureau ou l’interface Web, ajoutez le style suivant au fichier style.css : .search-container {display: none;}. Pour désactiver les zones de recherche sur l’interface utilisateur du téléphone, ajoutez le style suivant au fichier style.css : #searchBtnPhone {display: none;}.
Activer l’actualisation Activée par défaut (actualisation du navigateur).
Activer le retour au dernier dossier Non activé par défaut. Pour mémoriser le dossier actuel et y retourner au moment du chargement, ajoutez la ligne suivante au fichier script.js : 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); } }; }); };
Activer les conseils L’application Citrix Workspace utilise très peu les info-bulles, car elle cible les appareils tactiles et non tactiles. Vous pouvez ajouter des info-bulles à l’aide d’un script personnalisé.
Affichage Icônes, Affichage Arborescence, Affichage Détails, Affichage Liste, Affichage Groupe, Définir l’affichage par défaut, Affichage Icônes (Graphiques simplifiés), Affichage Liste (Graphiques simplifiés), Affichage par défaut (Graphiques simplifiés) L’interface utilisateur de l’application Citrix Workspace est différente, donc ces options ne s’appliquent pas. Vous pouvez utiliser la console de gestion StoreFront pour configurer des vues. Pour de plus amples informations, consultez la section Spécifier différentes vues pour les applications et bureaux.
Interface utilisateur à onglet unique, Interface utilisateur à plusieurs onglets (Onglet Application, Onglet Bureau, Onglet Contenu, (Ordre des onglets)) L’interface utilisateur de l’application Citrix Workspace contient des onglets par défaut, avec applications et contenu dans un onglet et bureaux dans l’autre. Il existe également un onglet Favori (facultatif).
Logo d’en-tête, Couleur du texte, Couleur d’arrière-plan de l’en-tête, Image d’arrière-plan de l’en-tête Équivalents pour les couleurs et logos à l’aide de la console d’administration StoreFront. Cliquez sur Personnaliser l’apparence du site Web dans le panneau Actions de la console d’administration StoreFront et apportez les modifications sur l’écran qui s’affiche. Vous pouvez définir une image d’arrière-plan pour l’en-tête en utilisant la personnalisation de style. Par exemple .theme-header-bgcolor { background-image: url('spirals.png'); }
Message de bienvenue de pré-ouverture de session (Pré-localisation) (Titre, Texte, Hyperlien, Libellé du bouton) Par défaut, il n’existe aucun autre écran de pré-ouverture de session. Cet exemple de script ajoute une zone de message interactive : 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(); } };
Titre de l’écran d’ouverture de session, Message de l’écran d’ouverture de session, Message système de l’écran d’ouverture de session Il existe quatre zones de personnalisation sur l’écran d’ouverture de session : haut et bas de l’écran (en-tête et bas de page) et haut et bas de la boîte de dialogue d’ouverture de session : .customAuthHeader, .customAuthFooter .customAuthTop, .customAuthBottom { text-align: center; color: white; font-size: 16px; } Exemple de script (contenu statique) : \$('.customAuthHeader').html("Welcome to ACME"); Exemple de script (contenu dynamique) : function setDynamicContent(txtFile, element) { CTXS.ExtensionAPI.proxyRequest({ url: "customweb/"+txtFile, success: function(txt) {\$(element).html(txt);}}); } setDynamicContent("Message.txt", ".customAuthTop"); Remarque : il ne faut pas explicitement inclure de contenu dynamique dans le script, ou le placer dans le répertoire personnalisé, car les modifications effectuées ici forcent les clients à recharger l’interface utilisateur. Placez le contenu dynamique dans le répertoire customweb.
Message de bienvenue de l’écran d’application, Message système de l’écran d’application Consultez les exemples d’écran de bienvenue CustomAuth ci-dessus. Consultez les exemples de contenu dynamique ci-dessus. Utilisez #customTop plutôt que .customAuthTop pour placer du contenu sur l’écran d’accueil.
Texte de bas de page (tous les écrans) Exemple de script : #customBottom { text-align: center; color: white; font-size: 16px; }** Example static content using a script: **\$('\#customBottom').html("Welcome to ACME");
Fonctionnalités avec aucun équivalent direct  
Écran d’ouverture de session sans en-têtes, Écran d’ouverture de session avec en-têtes (y compris des messages) Il n’existe pas d’équivalent direct dans StoreFront. Toutefois, vous pouvez créer des en-têtes personnalisés. Consultez la section Titre de l’écran d’ouverture de session ci-dessus.
Paramètres utilisateur Par défaut, il n’existe aucun paramètre utilisateur. Vous pouvez ajouter des menus et boutons JavaScript.
Le contrôle de l’espace de travail Fonctionnalité équivalente pour les paramètres d’administrateur. Les API d’extension permettent une plus grande flexibilité. Voir http://www.citrix.com/go/citrix-developer/storefront-receiver-developer-community/receiver-customization-api.html.
Personnalisations avancées (code)  
Hooks de génération du fichier ICA et autres personnalisations de routage d’appel API équivalentes ou supérieures. http://www.citrix.com/go/citrix-developer/storefront-receiver-developer-community/store-customization-sdk.html
Personnalisations d’authentification API équivalentes ou supérieures. http://www.citrix.com/go/citrix-developer/storefront-receiver-developer-community/store-authentication-sdks.html
Accès source JSP/ASP Il n’existe pas d’API équivalente sur StoreFront, car l’interface utilisateur n’est pas restituée de la même manière. Il existe de nombreuses API JavaScript permettant la personnalisation de l’interface utilisateur.
Migrer les fonctionnalités de l’Interface Web vers StoreFront