Blocs Menu

Organisez les entrées, les plats et les desserts de votre restaurant grâce à un menu disponible directement sur votre site.

Dernière mise à jour le 18 janvier 2025

Utilisez les blocs Menu pour présenter sur votre site les menus de votre restaurant. Ainsi, vous n’avez pas besoin d’intégrer des menus au format PDF, qui ne sont pas toujours aussi bien reconnus par le SEO que du texte affiché directement sur la page. Vous pouvez même utiliser une mise en forme spéciale pour créer plusieurs menus dans un seul bloc Menu.

Ce guide vous explique comment ajouter des blocs Menu au site de votre restaurant. Pour ajouter un menu déroulant dans la navigation de votre site, consultez l’article Ajouter des menus déroulants à votre navigation

Accéder à cette fonctionnalité

Les blocs Menu sont disponibles avec les forfaits Basique, Core, Plus, Avancé, Business, Commerce Basique et Commerce Avancé. Pour en savoir plus, consultez l’article Choisir le forfait Squarespace qu’il vous faut.

Ajouter un bloc Menu

Pour ajouter un bloc Menu :

  1. Modifiez une page ou une publication, cliquez sur Ajouter un bloc ou sur un point d’insertion, puis sur Menu dans le menu. Pour obtenir de l’aide, consultez l’article Ajouter du contenu avec les blocs.
  2. Ouvrez l’éditeur de bloc en cliquant sur l’icône en forme de crayon sur le bloc.
  3. Modifiez le texte dans l'onglet Contenu pour créer vos menus, sections de menu et éléments de menu.
  4. Utilisez l’onglet Design pour personnaliser le design des menus.
  5. Utilisez l’onglet Aide à la mise en forme pour obtenir des astuces de mise en forme.

Ajouter des menus

Pour vous aider à démarrer, des exemples de contenu sont proposés dans les blocs Menu. Nous vous conseillons de remplacer un par un les exemples par vos propres éléments de menu afin de conserver la mise en forme. Vous pouvez également supprimer le contenu et suivre les étapes de cette section pour partir de zéro.

Les blocs Menu peuvent contenir plusieurs menus. Vous pouvez par exemple ajouter dans le même bloc votre menu pour le brunch et vos menus du midi et du soir.

Pour ajouter un menu :

  1. Dans l'onglet Contenu, entrez le nom du menu.
  2. Ajoutez au moins trois signes « égale » (=) en dessous.

Add_the_name_of_a_menu__like_breakfast__then_add_at_least_three_equals_signs_below_it.png

Add_the_name_of_a_menu__like_breakfast__then_add_at_least_three_equals_signs_below_it.png
  1. Si vous le souhaitez, vous pouvez ajouter une description ou une note directement en dessous des signes « égal ».

Add_an_optional_description_or_note_about_the_menu_below_the_equals_signs.png

Add_an_optional_description_or_note_about_the_menu_below_the_equals_signs.png
  1. Ajoutez d'autres menus ci-dessous en utilisant le même format. 

Add_more_menus_below__like_Lunch_and_Dinner__using_the_same_format.png

Add_more_menus_below__like_Lunch_and_Dinner__using_the_same_format.png

Ces menus se transforment en navigation par catégorie sur la page. Les sections ci-dessous expliquent comment ajouter le reste du contenu du menu.

Remarque

si vous ajoutez un seul menu au bloc, la navigation par catégorie peut ne pas apparaître.

KB Guide Image

Ajouter des sections

Vous pouvez diviser chaque menu en sections. Vous pouvez par exemple utiliser des sections pour organiser votre menu par entrées, salades, plats principaux, accompagnements et desserts.

Pour créer une section :

  1. Saisissez le nom de la section sous le menu correspondant.
  2. Ajoutez au moins trois tirets (-) en dessous.
  3. Sur la ligne directement en dessous des tirets, saisissez si vous le souhaitez une description de la section.
Create_menu_sections_to_divide_between_different_types_of_food__like_Seafood_and_Pancakes.png

Les sections apparaîtront comme des titres sur la page.

KB Guide Image

Ajouter des éléments de menu

Pour ajouter un élément de menu :

  1. Saisissez le nom de l’élément sous une section.
  2. Ajoutez une description de l’élément sous son nom.
  3. Pour afficher le prix, ajoutez-le sous la description.
  4. Ajoutez des variantes de prix en insérant une barre oblique (/) entre les prix. Vous pouvez par exemple indiquer le prix au verre et à la bouteille ou le prix d’un plat entier ou d’une demi-part.
  5. Incluez les prix du marché en saisissant €Prix du marché à la place du prix. Vous pouvez placer le prix immédiatement après l’élément de menu ou la description à condition que le symbole monétaire apparaisse en premier.
  6. Ajoutez des options ou des modules complémentaires à un élément de menu en tapant + sur une nouvelle ligne en dessous du prix.
  7. Si vous avez un nombre impair d’éléments, vous pouvez ajouter une balise 
    en bas de la section pour équilibrer les colonnes de menu.
  8. Si vous remarquez une marge intérieure supplémentaire au niveau de certains de vos menus, découvrez comment définir la hauteur minimale dans votre premier menu.
Add_items_with_descriptions_and_prices_below_each_section.png

Personnaliser le design

Vous pouvez personnaliser le style de menu et le symbole monétaire des blocs Menu.

Style de menu

Cliquez sur l'onglet Design dans l'éditeur de blocs et sélectionnez un style :

  • Centré crée un menu à une seule colonne avec du texte centré. Ce design est idéal pour les menus courts.
  • Multicolonne crée un menu comportant plusieurs colonnes et du texte aligné à gauche. Le nombre de colonnes dépend de la largeur de votre site et de votre navigateur.

Symbole monétaire

Cliquez sur l'onglet Design et sélectionnez une devise pour les prix du menu dans le menu déroulant Symbole de devise. Vous pouvez choisir parmi les devises suivantes : $ pour Dollar, pour Euro, £ pour Livre sterling ou ¥ pour yen.

Remarque

le symbole monétaire choisi ici s’affiche avant les chiffres de la troisième ligne des éléments du bloc Menu, même si vous avez utilisé un symbole monétaire différent ou aucun symbole lors de la composition du menu dans l’onglet Contenu. Pour utiliser un autre symbole monétaire, suivez les étapes ci-dessous.

Polices et couleurs

Utilisez le panneau Styles du site pour modifier les polices et les couleurs de votre menu. La façon dont vous pouvez personnaliser le style de ces éléments dépend de la version de Squarespace qu’utilise votre site.

Vous pouvez définir des polices et des couleurs spécifiques pour chaque zone de texte dans le bloc Menu :

  • Pour définir les polices, utilisez les réglages du bloc Menu dans Assign Styles (Attribuer des styles)
  • Pour définir les couleurs, utilisez les réglages du bloc Menu dans Couleurs

Pour en savoir plus, consultez les articles Modifier les polices et Modifier les couleurs.

Le texte du bloc Menu suit les mêmes ajustements de style que le corps de texte de votre site. Pour en savoir plus, consultez les articles Modifier les polices et Modifier les couleurs.

Aide à la mise en forme (application pour ordinateur uniquement)

L’onglet Aide à la mise en forme contient des exemples de menus, de sections et d’éléments de menu mis en forme.

Astuce

si la mise en forme de la navigation et des sections du menu ne vous convient pas, vous pouvez utiliser les blocs Menu pour ajouter des éléments de menu, puis ajouter des en-têtes avec des blocs Texte. Pour voir un exemple, regardez le contenu de démonstration du template Hunter.

Dépannage

Les éléments de menu ne sont pas alignés

L’alignement du bloc Menu dépend de nombreux facteurs, dont l’existence ou non de descriptions, la longueur du titre et de la description ainsi que le nombre d’éléments.

Les navigateurs essayant de créer des colonnes de contenu égales, le texte s’enchaîne de haut en bas et de gauche à droite. Ainsi, les titres des éléments ne sont pas toujours parfaitement alignés.

Si vous avez un nombre impair d’éléments, vous pouvez ajouter la balise HTML suivante en bas de la section :


Cela peut permettre d’équilibrer la mise en forme et d’afficher les éléments de menu sur un nombre de lignes pair.

Marge intérieure supplémentaire au niveau des menus

Si une marge intérieure ou un espace vide supplémentaires apparaissent sous certaines de vos catégories de menu, cela peut être dû à la quantité de contenu de votre première catégorie de menu. Le contenu de votre première catégorie de menu définit la hauteur minimale du bloc Menu. Cela peut entraîner l’apparition d’une marge intérieure supplémentaire dans d’autres catégories.

Par exemple, si vous avez un menu petit-déjeuner complet mais un menu court pour le déjeuner, des espaces blancs seront placés sous les éléments du menu pour correspondre à la hauteur du menu petit-déjeuner. Pour éviter cela, ajoutez une quantité similaire de contenu à chaque menu, ou ajoutez le menu le moins complet en tant que première catégorie.

Le texte que je saisis ne s’affiche pas

Si vous ne voyez pas le texte que vous saisissez, finissez d’entrer le contenu et enregistrez le bloc. Ouvrez de nouveau le bloc et votre contenu devrait désormais s’afficher tel que vous l’avez saisi.

Le symbole de la devise que je souhaite utiliser n’est pas disponible

Si vous utilisez une devise non répertoriée, entrez n'importe quel symbole monétaire sur la troisième ligne d'un article et ajoutez un espace. Saisissez ensuite le symbole de votre devise et le prix. Cela remplacera le symbole monétaire intégré pour que votre symbole monétaire s'affiche.

Je ne peux pas coller de texte dans le bloc Menu

Vous n'avez pas la possibilité de faire de clic droit dans les blocs Menu depuis votre ordinateur. Pour copier-coller du contenu, vous devez utiliser les raccourcis clavier. Pour éviter tout problème de mise en forme, nous vous recommandons les raccourcis suivants :

Mac

  • Copier + C
  • Coller - + Maj + V

Windows

  • Copier - Ctrl + C
  • Coller - Ctrl + Maj + V

La mise en forme du texte est incorrecte

Les erreurs dans les blocs Menu interfèrent avec la mise en forme du texte. Suivez les conseils ci-dessous pour résoudre les problèmes liés au texte :

  • Vérifiez que vous avez au moins trois signes égaux (=) qui séparent les menus et au moins trois traits d'union (-) qui séparent les sections.
  • Appuyez sur Retour ou sur Entrée après chaque saisie de texte afin de vous assurer que chaque ligne est correctement positionnée.
  • Évitez d’utiliser la barre d’espace pour séparer les contenus. Les blocs Menu n’utilisent pas les espaces de cette façon et le texte ne sera pas correctement mis en forme.
Footer Image
  • Obtenir de l’aide de notre communauté

  • Obtenez de l’aide sur les personnalisations avancées auprès de notre communauté.

  • Trouver un Squarespace Expert

  • Démarquez-vous en ligne avec l’aide d’un designer ou d’un développeur expérimenté.