Personnaliser le thème

<ph type="x-smartling-placeholder"></ph> Vous consultez la documentation Apigee Edge.
Accédez à la page Documentation sur Apigee X. En savoir plus

Un thème est un ensemble de fichiers qui définissent l'apparence d'un site. La Le portail de services pour les développeurs est initialement défini avec un thème par défaut que vous pouvez personnaliser. Vous pouvez ainsi sélectionner vos préférences pour l'apparence de votre portail. Plus plus précisément, vous pouvez modifier la couleur des liens, des arrière-plans, du texte et d'autres éléments du thème. Toi vous pouvez également modifier le message de bienvenue qui s'affiche sur la page d'accueil de votre portail des développeurs.

Vous pouvez personnaliser le thème via l'interface utilisateur du portail des développeurs ou en écrivant du code dans un pour remplacer le fichier de thème par défaut.

<ph type="x-smartling-placeholder">

En fonction de la version du portail des développeurs que vous utilisez, vous avez le choix entre plusieurs thèmes. de:

Thème	Description
Thème Apigee Responsive	Basé sur Bootstrap 3, le thème par défaut de dans les dernières versions du portail. Ce thème est compatible avec les appareils d'une largeur allant de 768 pixels à 1400 pixels. Toutes les fonctionnalités d’amorçage 3 sont disponibles dans ce thème. Remarque: Pour utiliser le thème Apigee Responsive, assurez-vous que le paramètre Le thème 7.x-3.0 est activé.
Thème Apigee DevConnect	Thème du portail par défaut précédant le thème Apigee Responsive. Les portails existants peuvent être mis à niveau vers le nouveau thème Apigee Responsive, mais ils doivent d'abord vous assurer que tous les blocs, modèles et autres contenus sont compatibles avec Bootstrap 3 ; que le thème Bootstrap 7.x-3.0 est activé.
Thème de base Apigee	Un thème parent du thème Apigee DevConnect qui n'est pas destiné à être utilisé sur son vous-même.

Définir le thème par défaut

Si votre portail utilise encore l'ancien thème Apigee DevConnect, un avertissement peut s'afficher sous la forme suivante:

"Apigee DevConnect theme" is out of date 

Vous pouvez utiliser la procédure suivante pour définir le thème par défaut du portail. Vous devez Testez toujours un nouveau thème sur un système hors production avant de le déployer en production.

<ph type="x-smartling-placeholder">

Pour définir le thème par défaut:

1. Connectez-vous à votre portail en tant qu'utilisateur disposant des droits d'administrateur ou de création de contenu.
2. Sélectionnez Appearance (Apparence) dans le menu d'administration de Drupal. La liste des composants activés s'affichent.
3. Sélectionnez Définir les paramètres par défaut pour le thème que vous souhaitez utiliser par défaut.
   Pour utiliser le thème Apigee Responsive, assurez-vous que le thème Bootstrap 7.x-3.0 est également activées sur cette page.
4. Enregistrez la configuration.

Personnaliser le thème Apigee Responsive

Cette section explique comment configurer le thème Apigee Responsive, y compris:

• Personnaliser les formulaires modals
• Personnalisation des paramètres généraux

Pour personnaliser la prise en charge des formulaires modals:

Le portail utilise le programme d'amorçage Drupal les formulaires modals de bac à sable permettant d'afficher les formulaires Drupal sous forme de modales. Les formulaires de connexion et d'inscription par par défaut en tant que modales. Vous pouvez désactiver cette fonctionnalité pour que ces formulaires apparaissent des pages individuelles à la place.

1. Connectez-vous au portail des développeurs en tant qu'utilisateur disposant de droits d'administrateur.
2. Sélectionnez Configuration > Interface utilisateur > modale d'amorçage dans Menu d'administration Drupal.
3. Activez ou désactivez la compatibilité modale des formulaires.
4. Sélectionnez Enregistrer la configuration.

Pour personnaliser les paramètres généraux du thème Apigee Responsive:

1. Connectez-vous à votre portail en tant qu'utilisateur disposant des droits d'administrateur ou de création de contenu.
2. Sélectionnez Appearance (Apparence) dans le menu d'administration de Drupal. La liste des thèmes activés s'affiche.
3. Dans la zone Apigee Responsive (Thème par défaut) de la page, sélectionnez Paramètres (ne sélectionnez pas le bouton "Paramètres" en haut de la page).
4. La page des paramètres du thème Apigee Responsive s'affiche.
5. Le tableau suivant décrit les zones de cette page que vous pouvez utiliser pour configurer d'un thème. Si vous modifiez l'un de ces paramètres, sélectionnez "Enregistrer la configuration".
   
   

   Zone	Section	Description
   Paramètres d'amorçage
   	Composants	Contrôler l'affichage du fil d'Ariane, la position du menu principal (appelé le Navbar dans les paramètres) et l'affichage des puits de région: Fil d'Ariane: permet de masquer ou d'afficher le fil d'Ariane, et d'activer ou de désactiver le lien vers la page d'accueil. à l'intérieur du fil d'Ariane. Navbar: définissez la position de la Navbar (menu principal) sur des positions fixes/statiques/normales, ce qui rend la mise en page plus dynamique. Puits de région: ajoutez une classe de puits à n'importe quelle région du site ajouter un arrière-plan plus sombre à la région.
   	JavaScript	Contrôlez l'affichage des ancres, des pop-overs et des info-bulles: Ancrages: corrigez les positions des ancrages et activez la fluidité faire défiler l'écran. Fenêtres pop-up: ces fenêtres ajoutent de petites superpositions de contenu à . Activez ou désactivez les pop-ups et configurez leur utilisation. Info-bulles: configurez l'utilisation des info-bulles. Vous pouvez forcer chaque à afficher à droite, à gauche, en haut ou en bas de chaque élément du formulaire, et définissez d'autres options d'affichage.
   	Avancées	Contrôle la manière dont le portail utilise BootstrapCDN pour mettre à jour les fichiers du thème d'amorçage. Vous pouvez désactiver la dépendance au portail BootstrapCDN, mais vous devez ensuite fournir votre propre implémentation de la classe Bootstrap. d'infrastructure.
   	Paramètres DevConnect	Définissez le message de bienvenue, les couleurs par défaut et la taille du logo qui s'affiche. dans le menu principal.
   Remplacer les paramètres généraux
   	Activer/Désactiver l'affichage	Activer et désactiver l'affichage des différentes zones du portail
   	Paramètres de l'image du logo	Spécifie l'image affichée dans le menu principal.
   	Paramètres des icônes de raccourci	Spécifie l'image affichée dans la barre d'adresse d'un navigateur ou dans un favori pour le portail.

Personnaliser le thème Apigee DevConnect

Le thème Apigee DevConnect est le thème par défaut du portail pour les anciennes versions du portail. peuvent être mis à niveau vers le nouveau thème Apigee Responsive. Toutefois, vous devez d'abord vous assurer que tous les des blocs, des modèles et d'autres contenus sont compatibles avec Bootstrap 3 avant d'effectuer l' mise à niveau.

Pour personnaliser les paramètres généraux d'Apigee DevConnect thème:

1. Connectez-vous à votre portail en tant qu'utilisateur disposant des droits d'administrateur ou de création de contenu.
2. Sélectionnez Apparence > Thème Apigee DevConnect > Paramètres dans l'application Drupal d'administration. Les paramètres initiaux du thème s'affichent. Les paramètres de couleur sont spécifiées sous forme de valeurs hexadécimales.

   

3. Modifiez les paramètres selon vos préférences.
   Par exemple, ajoutez ou modifiez le message de bienvenue, ou changez la couleur d'arrière-plan de l'en-tête. La la couleur d'arrière-plan de l'en-tête est initialement proche de l'orange (#FF4300). Vous pouvez modifier par une autre couleur, par exemple le bleu (#0000FF).
4. Lorsque vous avez terminé de modifier les paramètres, cliquez sur Enregistrer.

Personnaliser un thème en créant un sous-thème

L'ensemble des fichiers et des ressources qui définissent les thèmes par défaut fournis avec le portail se trouvent dans le Répertoire profiles/apigee/themes dans le répertoire d'installation du portail. Ce répertoire se trouve à l'adresse /var/www/html/profiles/apigee/themes si vous installé le portail à l'emplacement par défaut.

Pour modifier un thème afin de changer l'apparence du site, ne modifiez pas les fichiers de thème sous profiles/apigee/themes directement. Si vous le faites, vos modifications seront écrasées la prochaine fois que vous mettrez à niveau le portail.

Créez plutôt un sous-thème du thème que vous souhaitez modifier en copiant le thème par défaut. dans le répertoire /sites/all/themes . Pour obtenir des instructions sur les sous-thèmes, consultez le documentation à l'adresse https://www.drupal.org/node/225125.

1. Copiez le dossier profiles/apigee/themes/apigee_responsive/apigee_responsive_starterkit. à la page /sites/all/themes .
2. Renommez le dossier apigee_responsive_starterkit. par YOUR_THEME_NAME.
3. Renommez le fichier apigee_responsive_starterkit.info en NOM_THÈME.info.
4. Renommez css/apigee_responsive_starterkit.css en tant que css/YOUR_THEME_NAME.css.
5. Renommez js/apigee_responsive_starterkit.js en tant que YOUR_THEME_NAME.js.
6. Modifiez le fichier YOUR_THEME_NAME.info et remplacez les lignes suivantes:
   
   stylesheets[all][] = css/apigee_responsive_starterkit.css
   scripts[] = js/apigee_responsive_starterkit.js
   
   par:
   
   stylesheets[all][] = css/NOM_THÈME.css
   scripts[] = js/NOM_DE_VOTRE_THÈME.js
7. Remplacez le nom du thème dans le fichier YOUR_THEME_NAME.info Apigee Responsive Starter Kit par VOTRE THÈME. NOM.
8. Si vous souhaitez ajouter une capture d'écran pour votre thème, remplacez le fichier screenshot.png existant.
9. Si vous souhaitez ajouter un nouveau logo à votre thème, remplacez le fichier logo.png existant.
10. Pour en ajouter un à votre thème, remplacez le fichier favicon.ico existant.