Dans Canvas, vous pouvez utiliser l'éditeur de thème pour le branding de votre compte. Néanmoins, si vous souhaitez appliquer un branding additionnel qui n'est actuellement pas supporté dans l'éditeur de thème, vous pouvez téléverser des fichiers CSS ou JS personnalisés vers votre compte. Les fichiers sont hébergés directement dans Canvas. Un thème appliqué au compte s'applique également à tous les sous-comptes, bien que vous puissiez téléverser des fichiers CSS/JS pour des sous-comptes individuels.
L'éditeur de thème supporte le téléversement de fichiers bureau/mobile. Les fichiers CSS/JS standard sont appliqués aux pages HTML dans l'application pour bureau de Canvas, qui peuvent inclure la page de connexion pour les périphériques mobiles. Les fichiers CSS/JS pour mobile ne sont appliqués qu'au contenu utilisateur affiché dans les applications iOS ou Android de Canvas, ainsi que dans les applications tierces qui utilisent l'API Canvas, mais les fichiers pour mobile ne s'appliquent pas au contenu affiché par les navigateurs mobiles.
Les fichiers JavaScript et CSS personnalisés sont soumis aux mêmes règles d'héritage de marque de compte et de sous-compte que lors de la création d'un thème dans l'éditeur de thème.
Avant d'ajouter le JavaScript personnalisé et des fichiers CSS, vous devez contacter votre responsable succès client pour permettre une identification personnalisée de votre compte ou d'un sous-compte quelconque. Une fois que l'identification personnalisée est activée, l'option de téléversement de fichiers CSS et JS personnalisés est disponible dans le compte et tous les sous-comptes.
Risques des fichiers personnalisés
Si vous ne pouvez utiliser les options natives de l'Éditeur de thème, vous devez connaître les risques associés à l'utilisation de fichiers personnalisés qui peuvent provoquer des problèmes d'accès ou des conflits avec les futures mises à jour de Canvas :
- Vous devez disposer de connaissances avancées de JavaScript et CSS et entretenir votre propre code.
- Les fichiers personnalisés peuvent être en conflit avec les futures modifications du DOM de Canvas (par ex. nom de classe d'éléments ou structure HTML) et ne sont par conséquent pas supportés. Instructure refuse toute responsabilité pour tout changement effectué sur vos fichiers personnalisés écrasés.
- Vous êtes responsable pour consulter les directives d'accessibilité aux contenus Web afin de vous assurer que vos fichiers répondent aux tests d'accessibilité Web ou toute autre norme qui pourrait être nécessaire dans votre juridiction. Vous êtes responsable de rendre vos modifications accessibles aux lecteurs d'écran, aux utilisateurs nécessitant des contrastes de texte et de couleurs et aux utilisateurs ayant besoin de styles à contraste élevé comme paramètres de fonctionnalités utilisateur.
- Lorsque vous expérimentez une identification personnalisée, confirmez toujours vos modifications d'identification dans l'environnement bêta de votre institution ou l'environnement test.
Remarques :
- L'éditeur de thème n'est pas disponible pour les comptes Gratuit-Pour-Enseignant.
- Si vous êtes un administrateur de sous-compte et que le lien Thèmes n'est pas visible dans la navigation du compte, cela signifie que les Thèmes n'ont pas été activés pour les sous-comptes. Si l'onglet Téléverser des fichiers CSS/JS n'est pas visible, les envois de fichiers n'ont pas été activés pour les sous-comptes.
Ouvrir un compte
Dans Navigation globale, cliquez sur le lien Admin [1], puis sur le nom du compte [2].
Ouvrir les thèmes
Dans Navigation du compte, cliquez sur le lien Thèmes (Themes).
Remarque : Si des thèmes de sous-compte ont été activés, chaque sous-compte inclut également un lien Thèmes (Themes). Pour ouvrir l'éditeur de thèmes pour un sous-compte, cliquez sur le lien Sub-Accounts (Sous-comptes) pour le localiser et ouvrez le sous-compte, puis cliquez sur le lien Themes (Thèmes) du sous-compte.
Ouvrir un modèle de thème
Si vous n'avez pas encore de thème Canvas pour votre compte, utilisez un modèle pour créer un nouveau thème. Vous pouvez choisir le thème Canvas par défaut, un modèle minimaliste ou encore un modèle State U. Si votre Responsable succès client a activé le paramètre de prévisualisation de fonctionnalités spécifique à K12, alors le thème K12 apparaît également comme un modèle.
Pour créer un nouveau thème, survolez un modèle et cliquez sur le bouton Ouvrir dans l'éditeur de thème (Open in Theme Editor) [1] ou cliquez sur le bouton Ajouter thème (Add Theme) [2] et sélectionnez un modèle depuis la liste.
Ouvrir un thème enregistré
Si vous avez déjà créé et enregistré un thème, vous pouvez éditer les thèmes enregistrés à tout moment. Les thèmes enregistrés s'affichent dans la section Mes thèmes. Pour ouvrir un thème enregistré, survolez le nom de ce thème et cliquez sur le bouton Ouvrir dans l'éditeur de thème (Open in Theme Editor) [1].
Pour créer un nouveau thème basé sur un thème enregistré, cliquez sur le bouton Ajouter thème (Add Theme) [2] et sélectionnez le nom du thème enregistré depuis la liste [3]. Cette option vous assure de ne pas écraser votre thème précédemment enregistré.
Ouvrir l'onglet Téléverser
Dans la barre latérale de l'éditeur de thèmes, cliquez sur l'onglet Téléverser (Upload).
Téléverser des fichiers personnalisés
Pour téléverser des fichiers à destination de l'application pour bureau Canvas, localisez les en-têtes du fichier CSS/JS [1]. Pour envoyer les fichiers depuis des applications mobile Canvas ou tiers, localisez les en-têtes du fichier CSS/JS pour application mobile [2].
Localisez le type de fichier que vous souhaitez téléverser et cliquez sur le bouton Sélectionner (Select) [3], puis localisez le fichier sur votre ordinateur.
Localisez les fichiers additionnels pour téléversement, si nécessaire.
Prévisualiser le thème
Pour prévisualiser votre thème, cliquez sur le bouton Prévisualiser vos changements (Preview Your Changes).
Canvas générera un aperçu des éléments en fonction de vos fichiers transférés.
Gestion des fichiers
Pour gérer vos fichiers, cliquez à nouveau sur l'onglet Téléverser (Upload) [1].
Pour supprimer et téléverser un nouveau fichier, cliquez sur l'icône Supprimer [2]. Vous pourrez modifier et téléverser votre fichier révisé.
Pour voir le code du fichier, cliquez sur le lien Voir le fichier (View File) [3]. Le fichier étant classé directement dans Canvas, utilisez ce lien si vous avez besoin de le télécharger.
Enregistrer le thème
Une fois que vous êtes satisfait des changements apportés à votre modèle, enregistrez votre thème en cliquant sur le bouton Enregistrer le thème (Save Theme).
Nommer un thème
Si vous avez modifié un thème depuis un modèle, l'éditeur de thème crée une copie de ce dernier. Les modèles ne peuvent pas être directement modifiés. Dans le champ Nom du thème (Theme Name) [1], entrez un nom pour votre thème. Cliquez sur le bouton Enregistrer le thème (Save Theme) [2].
Remarque : Si vous avez modifié un thème précédemment enregistré, l'enregistrement de ce thème écrase la version précédente et utilise le même nom de thème.
Appliquer le thème
Pour appliquer votre thème à votre compte, cliquez sur le bouton Apply (Appliquer) [1].
Pour quitter le thème et revenir à la page des Thèmes, cliquez sur le bouton Quitter (Exit) [2]. Vous pouvez ouvrir le thème et l'appliquer à votre compte à tout moment.
Remarque : Si votre compte permet aux sous-comptes de personnaliser leurs propres thèmes, toutes les modifications applicables que vous avez apportées seront également filtrées vers les sous-comptes associés. Canvas affiche l'état des mises à jour de votre Éditeur de Thème ; lorsque le processus pour chaque sous-compte est terminé, le sous-compte disparaît de la fenêtre de progression. Lorsque tous les sous-comptes ont été mis à jour, l'éditeur de thèmes redirige vers la page Thèmes.
