Gestionnaire de conception | Foire aux questions

Trouvez rapidement des réponses et des informations générales sur le gestionnaire de conception dans HubSpot. Cette ressource comprend également des liens vers plus de ressources pour les designers qui travaillent sur le CMS.

Quelles sont les ressources disponibles sur les outils de conception de HubSpot ?

Pour en savoir plus sur la conception sur HubSpot, consultez la certification HubSpot Academy « Conception axée sur la croissance » et la documentation CMS de HubSpot. 

La certification de conception est une certification gratuite qui comprend une formation vidéo et une pratique. 

La documentation CMS de HubSpot comprend :

• Documents de référence HubSpot CMS
• Documents de référence HubL
• Boilerplate CSS de HubSpot
• Tutoriels
• Exemples
• Blog des concepteurs

Existe-t-il une ressource HubSpot que je peux utiliser pour résoudre les problèmes de design codé personnalisé ou de HubL ?

Le forum Design de HubSpot est le meilleur endroit pour interagir avec la communauté de designers HubSpot. Ce forum est surveillé par les designers de HubSpot et les utilisateurs HubSpot avec une expertise technique.

Pour toute question liée au développement de l'API HubSpot, consultez le forum des développeurs. 

Comment obtenir un accès FTP à HubSpot ?

Depuis le 27 mai 2020, le protocole FTP a été remplacé par CMS CLI. Découvrez-en davantage sur cette nouvelle.

Puis-je modifier un groupe global pour un seul modèle ?

S'il est possible de convertir à nouveau un module global en module local, cette opération n'est pas disponible pour les groupes globaux. Pour modifier un groupe global pour un seul modèle, clonez le groupe global, puis ajoutez le clone à votre modèle.

Quelle version de Bootstrap est utilisée par l'outil de création de modèle HubSpot ?

L'éditeur de mise en page de HubSpot utilise un système de grille à 12 colonnes basé sur Bootstrap 2.x pour permettre aux designers de modèles de développer des pages web complètement  adaptatives  dans la plateforme de contenu HubSpot.

Puis-je utiliser ma propre grille adaptative avec des modèles HubSpot ?

Les mises en page en glisser-déposer de HubSpot incluent automatiquement le fichier layout.css pour que les modules soient adaptatifs. Si vous souhaitez utiliser une grille adaptative différente ou personnalisée, comme Bootstrap 3, vous devez passer outre la CSS du fichier layout.css ou utiliser des modèles codés auxquels le fichier layout.css n'est pas joint.

Comment procéder à la restructuration de la mise en page de mon article de blog et des listings ?

Les modules de contenu de blog permettent de modifier le balisage de vos articles et la mise en page de votre listing afin de contrôler l'affichage des divers éléments d'un article. 

Puis-je revenir à la version précédente d'un modèle ?

Les mises en page des modèles, les fichiers codés et les pages possèdent tous un historique de révision qui vous permet de revenir à la version précédente d'un modèle ou d'un contenu. Pour les modèles et les fichiers codés, cliquez sur Actions > Voir les révisions pour accéder à l'historique des révisions. 

Deuxième version pour les gestionnaires de conception

Quelle est la différence entre « widget » et « module » lors de la référence des champs des modules ?

Le cadre de module v1 référençait les champs de module en utilisant {{ widget.field }}. Le cadre de module v2 référence les champs de module en utilisant {{ module.field }}.

Toutefois, l'utilisation de {{ widget.field }} dans le cadre v2 sera toujours possible. Il n'est pas nécessaire de mettre à jour les modules personnalisés pour référencer le « module ».

Comment joindre des fichiers JS et CSS sans « get_public_templa_url » ?

Plutôt que d'utiliser « get_public_template_url » pour accéder à JavaScript et aux fichiers CSS, ces fichiers peuvent désormais être joints directement à l'éditeur de barre latérale du module dans la section Fichiers liés. Les fichiers CSS et JS inclus ici seront automatiquement chargés sur les pages à l'aide du module.

Comment ajouter des modules HTML ou HubL personnalisés à mon modèle ?

Les modules HTML et HubL ont été supprimés. Ces modules offraient aux développeurs une méthode rapide pour ajouter des blocs de texte HTML et HubL à un modèle. Ils peuvent toutefois compliquer la compréhension et la modification des modèles. Pour rendre les modèles plus prévisibles et adaptables, ces modules ont été supprimés au profit de la conservation de tous les codes dans le cadre des modules personnalisés.

Si vous devez ajouter un code HTML au niveau de la page sur un site web, le module HTML peut être téléchargé dans le Marketplace de HubSpot.

Comment utiliser les plug-ins JS avec mon module personnalisé ?

Si vous utilisez un script tiers, vous connecterez le fichier script à la section Fichiers Liés dans l'éditeur de module. Vous pouvez ensuite déclencher le plug-in dans la section JS de l'éditeur de code. Si vous devez transmettre des paramètres au plug-in, vous pouvez utiliser les attributs des données dans la section HTML + HubL de l'éditeur pour enregistrer ces valeurs.

Lorsque j'effectue une mise à niveau, je dois indiquer l'endroit où je souhaite utiliser ce module. Quelle est la différence entre ces options ?

Si vous utilisez un module personnalisé dans un e-mail, les sections CSS et JS n'apparaîtront pas dans l'éditeur car les feuilles de style et JavaScript ne sont pas pris en charge dans la plupart des clients de messagerie. Pour les modules d'e-mail, vous pouvez toujours inclure le style nécessaire dans les balises <style>.

Si vous utilisez un module sur les pages ou articles de blog, les sections JS et CSS apparaîtront comme prévu.

Existe-t-il des modifications dans le codage des modules de la deuxième version du gestionnaire de conception ?

Les modules dans la deuxième version du gestionnaire de conception sont encadrés dans les balises <div>, tandis que les modules de l'ancien gestionnaire étaient encadrés dans les balises <span>. Ce changement n'affectera que votre module si vous mentionnez l'étendue du module dans une feuille de style. Par exemple, la déclaration suivante ne s'appliquera pas dans le nouveau gestionnaire de conception :

span #hs_cos_wrapper_widget_5038393204 { Color: blue; }

Vous pouvez remplacer la balise <span> par une balise <div>.Toutefois, il n'est pas recommandé de recourir à des encadreurs HubSpot par défaut pour écrire votre CSS. Il est préférable d'utiliser les classes CSS personnalisées, telles que « mon-module-personnalisé ».

Je reçois une erreur « module imbriqué » lors de la mise à niveau de mon module. Comment résoudre ce problème et publier le module ?

Découvrez comment identifier et résoudre une erreur de module imbriqué. Pour les modules imbriqués utilisés sur plusieurs modèles, il est préférable de cloner le module dans un premier temps pour empêcher la perte de contenu au niveau de la page. Ensuite, résolvez les erreurs dans le module cloné et utilisez ce clone dans les modèles.

Comment ajouter un groupe global à mon module ?

Au lieu d'utiliser {% include %} dans votre module personnalisé pour ajouter un groupe global, vous pouvez ajouter un champ de menu à votre module ou modifier les modules du contenu global. 

Est-il possible d'utiliser mes modules personnalisés avec la première version dans le nouveau gestionnaire de conception ?

Oui, vous pouvez modifier tous les modules existants dans l'éditeur de modules. Vous verrez des avertissements de validation et des suggestions pour tout code qui n'est pas pris en charge dans le cadre du module v2. Toutefois, vous pourrez continuer à modifier et à utiliser ces modules dans HubSpot.

Si vous pouvez conserver tous vos modules personnalisés existants, vous ne pouvez pas créer de nouveaux modules en utilisant l'ancien cadre. Si vous clonez un module existant, le module cloné sera créé dans le nouveau cadre du module.