# 🏠 Comment ajouter Cowlendar sur ma page d'accueil ?

> Ajoutez un widget ou un bouton de réservation Cowlendar directement sur votre page d'accueil Shopify.

> **ℹ️ Info**
>
> Prérequis pour pouvoir ajouter Cowlendar à la page d'accueil : Vous devez avoir créé au moins un service sur Cowlendar et l'application doit être activée sur votre thème.

> **⚠️ Avertissement**
>
> Un produit est requis pour créer un service sur Cowlendar, ce qui signifie que vous ne pouvez pas simplement ajouter un calendrier à votre page sans d'abord créer un produit que vous liez à un service Cowlendar.

Il y a 3 façons d’ajouter Cowlendar sur votre page d'accueil.

Une fois que vous avez un service et que Cowlendar est [activé sur votre thème](https://help.cowlendar.com/fr/a/enable-cowlendar-on-your-theme-mandatory.md), vous pouvez utiliser l'une des 3 solutions.

[→ 1️⃣ Créez votre premier service sur Cowlendar](https://help.cowlendar.com/fr/a/create-your-first-service-on-cowlendar.md)

[→ 2️⃣ Activez Cowlendar sur votre thème OBLIGATOIRE](https://help.cowlendar.com/fr/a/enable-cowlendar-on-your-theme-mandatory.md)

## Voici les 3 façons d'ajouter Cowlendar à votre page d'accueil

Solution 1 : Produit en Vedette

#### Étapes pour utiliser la solution 1

Dans votre tableau de bord admin Shopify, regardez le panneau de gauche. 
Cliquez sur **Boutique en ligne.**
Cliquez sur **Thèmes.**
Dans le panneau central, cliquez sur **Personnaliser.**

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976322879-Untitled_design_5_.webp)

Assurez-vous que vous êtes sur votre **Page d'accueil.**
Cliquez sur **Ajouter une section.**
Ajoutez une section **Produit en Vedette**.

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976401513-Untitled_design_24_.webp)

> **⚠️ Avertissement**
>
> Si vous ne voyez pas le bouton Réserver maintenant dans l'éditeur de thème, veuillez vérifier votre site web en direct à la place.

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976402328-Capture_d_ecran_2024-02-12_a_15.29.57.webp)

Solution 2 : HTML personnalisé

#### Étapes pour intégrer le code du widget Inline dans HTML personnalisé (ou Custom liquid, Contenu personnalisé)

Dans le tableau de bord admin Shopify, sur le panneau de gauche, cliquez sur **Applications.**
Cliquez sur **Cowlendar.**
Cliquez sur **Mes Services.**
Sur le service spécifique que vous souhaitez afficher, cliquez sur **Plus.**
Après avoir cliqué sur plus, vous cliquerez sur **Intégration personnalisée.**

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976403714-_Cow_-_My_Services_-_Duplicate_2_.webp)

Dans l'intégration personnalisée, **copiez le code du widget Inline.**

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976392337-Untitled_design_41_.webp)

Dans votre tableau de bord admin Shopify, regardez le panneau de gauche et cliquez sur **Boutique en ligne.**
Cliquez sur **Thèmes.**
Dans le panneau central, cliquez sur **Personnaliser.**
Assurez-vous que vous êtes sur votre **Page d'accueil.**
Cliquez sur **Ajouter une section.**
Ajoutez une section **Liquid personnalisée** (également connue sous le nom de HTML personnalisé ou Contenu personnalisé).
**Collez le code du widget Inline** que vous avez copié précédemment.
**Enregistrez** avant de quitter.

> **⚠️ Avertissement**
>
> Les widgets Inline ne peuvent afficher qu'un service spécifique à la fois et s'il a plusieurs variantes, il n'affichera qu'une seule variante spécifique.

[→ 🖥️ Comment utiliser la fonction du widget Inline ?](https://help.cowlendar.com/fr/a/how-to-use-the-inline-widget-feature.md)

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976402782-Capture_d_ecran_2024-02-15_a_17.25.07.webp)

Solution 3 : Lien direct

Qu'est-ce qu'un lien direct ?

Un lien direct vous permet de lier n'importe quel texte / bouton à votre calendrier. Lorsque quelqu'un clique sur ce bouton, le calendrier apparaîtra comme un widget popup à l'écran. Vous pouvez en savoir plus sur l'intégration d'un lien direct ici.

Étapes pour intégrer un lien direct

Dans le tableau de bord admin Shopify, sur le panneau de gauche, cliquez sur **Applications.**
Cliquez sur **Cowlendar.** 
Cliquez sur **Mes Services.**
Sur le service spécifique que vous souhaitez afficher, cliquez sur **Plus.**
Après avoir cliqué sur plus, vous cliquerez sur **Intégration personnalisée.**

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976403714-_Cow_-_My_Services_-_Duplicate_2_.webp)

Dans l'intégration personnalisée, copiez le Lien direct.

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976394259-Untitled_design_28_.webp)

Dans le tableau de bord admin Shopify, sur le panneau de gauche, cliquez sur **Boutique en ligne.**
Cliquez sur **Navigation.**
Là, vous sélectionnerez le **Menu** que vous souhaitez mettre à jour.
Modifiez les éléments du menu (ce sera chacun des onglets dans le menu lui-même).
Appliquez le lien à la **section lien** de l'élément du menu.

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976404114-ScreenShot_Tool_-20250119115320.webp)

Enregistrez avant de quitter.

Vous pouvez ajouter un lien direct à votre calendrier dans n'importe quel texte/bouton que vous avez configuré sur votre page d'accueil. Pour cela, vous devez simplement utiliser le lien direct de votre service dans n'importe quel bouton.

[→ 🧙 Comment ajouter un service réservable dans leur menu ?](https://help.cowlendar.com/fr/a/how-to-add-a-bookable-service-in-their-menu.md)

> **⚠️ Avertissement**
>
> Cela ne fonctionne que si vous avez une variante. 

![](https://orka-chat.fra1.cdn.digitaloceanspaces.com/prod/help/671a5e245d077ea954b2cd4c/import/1791976403295-Capture_d_ecran_2024-02-15_a_17.28.13.webp)
