Ignorer et passer au contenu principal
Avertissement : cet article est le résultat de la traduction automatique, l'exactitude et la fidélité de la traduction ne sont donc pas garanties. Pour consulter la version originale de cet article, en anglais, cliquez ici.

Utiliser des thèmes

Dernière mise à jour: août 19, 2021

Disponible avec :

Marketing Hub Pro, Entreprise
CMS Hub Pro, Entreprise

Un thème est un ensemble de modèles, de modules, de contenus globaux et de paramètres de style utilisables pour créer un site web entier. Les thèmes peuvent être téléchargés depuis le marketplace des ressources, tandis que les comptes CMS Hub auront également accès aux thèmes HubSpot par défaut. Vous pouvez modifier les pages utilisant un thème à l'aide de l'éditeur de contenu en glisser-déposer et définir des modèles de blog pour utiliser un thème dans vos paramètres de blog. 

Comprendre les thèmes

Un thème est un ensemble de fichiers pour votre site web qui contient les éléments suivants :

  • Modèles codés : un ensemble de modèles pour votre site web, y compris une page d'accueil, une page « À propos », une page de destination et des modèles de blog. Ces modèles sont codés de manière personnalisée par un développeur, mais le contenu et la mise en page peuvent être personnalisés dans l'éditeur de contenu en glisser-déposer
  • Modules : un ensemble de modules de thèmes uniques que vous pouvez ajouter au contenu en utilisant ce thème. 
  • Contenu global : contenu répété sur plusieurs pages, tel qu'un en-tête ou un pied de page de site web. Vous pouvez modifier le contenu global directement depuis l'éditeur de page glisser-déposer.
  • Paramètres du thème : paramètres de style pour les modèles utilisant un thème, y compris les polices, l'espacement et les couleurs.

Utiliser un thème actif

Vous pouvez définir un thème actif afin d'afficher les pages de thème comme options par défaut pour les pages nouvellement créées. La définition ou la modification d'un thème actif ne changera pas le thème utilisé pour le contenu existant. Des thèmes supplémentaires peuvent être achetés via le marketplace des ressources

Définir un thème actif

  • Accédez à votre contenu :

    • Pages de site web : Depuis votre compte HubSpot, accédez à Marketing > Site web > Pages de site web.
    • Pages de destination : Dans votre portail HubSpot, naviguez vers Marketing > Pages de destination.
  • Dans l'angle supérieur droit, cliquez sur le menu déroulant Créer et sélectionnez Page de site web ou Page de destination.
  • Dans la boîte de dialogue, saisissez le nom de la page puis cliquez sur Créer une page.
  • Sur l'écran de sélection de thème, sélectionnez un thème. Dans l'angle supérieur droit, cliquez sur Aperçu pour prévisualiser le thème, ou Sélectionner et continuer pour définir le thème comme actif. 

select-a-new-active-theme

Basculer sur un autre thème actif

  • Accédez à votre contenu :

    • Pages de site web : Depuis votre compte HubSpot, accédez à Marketing > Site web > Pages de site web.
    • Pages de destination : Dans votre portail HubSpot, naviguez vers Marketing > Pages de destination.
  • Dans l'angle supérieur droit, cliquez sur le menu déroulant Créer et sélectionnez Page de site web ou Page de destination.
  • Dans la boîte de dialogue, saisissez le nom de la page puis cliquez sur Créer une page.
  • Sur l'écran de sélection de modèle, cliquez sur le menu déroulant Thème et sélectionnez Modifier le thème

switch-active-themes

  • Sur l'écran de sélection de thème, sélectionnez un thème. Dans l'angle supérieur droit, cliquez sur Aperçu pour prévisualiser le thème, ou Sélectionner et continuer pour définir le thème comme actif. 

select-new-active-theme

Créer une page à l'aide d'un thème

  • Accédez à votre contenu :

    • Pages de site web : Depuis votre compte HubSpot, accédez à Marketing > Site web > Pages de site web.
    • Pages de destination : Dans votre portail HubSpot, naviguez vers Marketing > Pages de destination.
  • Dans l'angle supérieur droit, cliquez sur le menu déroulant Créer et sélectionnez Page de site web ou Page de destination.
  • Dans la boîte de dialogue, saisissez le nom de la page puis cliquez sur Créer une page.
  • Sur l'écran de sélection de modèle, cliquez sur un modèle. Les modèles de votre thème actif s'afficheront dans la section Modèles de thèmes. Pour sélectionner un modèle qui ne fait pas partie de votre thème actif, cliquez sur Autres modèles, puis sur un modèle
  • Dans l'angle supérieur droit, cliquez sur Aperçu pour prévisualiser un modèle ou Sélectionner un modèle pour accéder à l'éditeur de contenu. 

select-template-from-active-theme

  • Dans l'éditeur de contenu, modifiez le contenu de la page à l'aide de l'éditeur en glisser-déposer
  • Dans l'angle supérieur droit, cliquez sur Mettre à jour ou Publier pour appliquer vos modifications. 

Appliquer un modèle de thème à votre blog

Vous pouvez définir un blog afin qu'il utilise le même thème que vos pages dans ses paramètres. Les modèles d'article et de page de listing de blog sont sélectionnés séparément.  

  • Depuis votre compte HubSpot, accédez à l'icône Paramètres settings dans l'angle supérieur droit.
  • Dans le menu latéral de gauche, accédez à Site web > Blog.
  • Si vous avez plusieurs blogs, cliquez sur le menu déroulant Sélectionner un blog à modifier et sélectionnez un blog
  • Cliquez sur l'onglet Modèles.
  • Dans les sections Article de blog et Listing de blog, cliquez sur le menu déroulant Actions et sélectionnez Modifier le modèle.

select-blog-template

  • Sur l'écran de sélection de thème, sélectionnez votre thème puis un modèle utilisant ce thème. Dans l'angle inférieur droit, cliquez sur Terminé

select-a-theme-blog-template

  • Lorsque vous avez défini les modèles d'articles et de listing de blog, cliquez sur Enregistrer dans l'angle inférieur gauche. 

Modifier les paramètres de thème

Vous pouvez personnaliser le style de votre thème, y compris la police, les couleurs et l'espacement, dans vos paramètres de thème. Les styles modifiés à partir de cette section s'appliquent à l'ensemble des pages et modules de thème inclus dans ce thème. Découvrez-en davantage sur la gestion des paramètres de thème.

edit-global-theme-fonts

Gérer les thèmes

Dans le gestionnaire de conception, vous pouvez modifier, cloner ou copier un thème dans un autre compte HubSpot. Vous pouvez également supprimer les thèmes HubSpot par défaut, les thèmes clonés et les thèmes personnalisés. 

Cloner un thème

Pour modifier les fichiers codés des thèmes par défaut dans le gestionnaire de conception, ils doivent d'abord être clonés. Les thèmes personnalisés et les thèmes achetés depuis le marketplace des ressources peuvent également être clonés et modifiés directement. 

  • Depuis votre compte HubSpot, accédez à Marketing > Fichiers et modèles > Outils de conception.
  • Dans l'outil de recherche, cliquez sur le dossier @hubspot. Ce dossier contient l'ensemble des thèmes et modules par défaut, y compris les modules d'e-mail glisser-déposer.  

    design-manager-hubspot-folder
  • Effectuez un clic droit sur un dossier de thèmes, puis sélectionnez Cloner le thème

    design-manager-theme-folder-clone
  • Dans la boîte de dialogue, saisissez un nom pour le thème, puis cliquez sur Créer.

Le thème sera copié dans le dossier racine et sera répertorié dans la recherche avec les autres dossiers. 

Copier un thème vers un autre compte

Vous pouvez copier un dossier de thème d'un compte à un autre.  Vous devez être un utilisateur disposant d'autorisations Outils de conception dans les deux comptes.

Remarque : Les dossiers de thème dans les annuaires @hubspot ou @marketplace ne peuvent pas être copiés entre deux comptes.

Pour copier un thème vers un compte :

  • Depuis votre compte HubSpot, accédez à Marketing > Fichiers et modèles > Outils de conception.
  • Dans la recherche, placez le curseur sur le dossier de thème que vous souhaitez copier, puis cliquez avec le bouton droit sur le dossier et sélectionnez Copier sur un autre compte

    copy-theme-folder-to-different-account
  • Dans la boîte de dialogue, sélectionnez un compte, puis cliquez sur Copier la ressource. Le dossier apparaîtra dans le compte spécifié dès que le processus de copie sera terminé. 

Charger un thème

Les utilisateurs de comptes CMS Hub peuvent télécharger des thèmes HubSpot depuis le marketplace ThemeForest d'Envato, puis les charger dans HubSpot : 

  • Accédez à la section HubSpot CMS Hub du marketplace ThemeForest d'Envato. 
  • Achetez et téléchargez un thème depuis le marketplace.
  • Double-cliquez sur votre téléchargement pour développer le fichier compressé. Cela créera un dossier contenant votre nouveau thème et sa documentation. 
  • Depuis votre compte HubSpot, accédez à l'icône Paramètres settings dans l'angle supérieur droit.
  • Dans le menu latéral de gauche, accédez à Site web > Thèmes.
  • Dans l'angle supérieur droit, cliquez sur Charger le thème
  • Dans les fichiers de votre ordinateur, ouvrez le nouveau dossier et sélectionnez votre thème

select-theme-file

  • Une fois le chargement de votre thème terminé, une bannière s'affichera en haut de la page. Cela peut prendre quelques minutes pour que votre thème soit disponible dans HubSpot. 

upload-theme

Supprimer un thème

Les thèmes HubSpot par défaut, les thèmes clonés et les thèmes chargés peuvent être supprimés depuis le gestionnaire de conception :

  • Depuis votre compte HubSpot, accédez à Marketing > Fichiers et modèles > Outils de conception.
  • Dans l'outil de recherche, cliquez sur le dossier contenant les éléments du thème.
  • Cliquez sur le menu déroulant Fichier et sélectionnez Supprimer [nom du dossier]
  • Dans la boîte de dialogue, sélectionnez la case à cocher Je souhaite vraiment supprimer ce dossier, puis cliquez sur Supprimer ce dossier

Les thèmes achetés doivent être désinstallés depuis le marketplace des ressources : 

  • Depuis votre compte HubSpot, cliquez sur l'icône Marketplace marketplace dans la barre de navigation principale.
  • Accédez à l'onglet Acheté
  • Passez le curseur de la souris sur le thème, puis cliquez sur le menu déroulant Actions et sélectionnez Désinstaller
  • Dans la boîte de dialogue, cliquez sur Désinstaller.