Boundless

Boundless est un thème de photographie d'abord avec une interface utilisateur minimale, qui présente des photographies bord à bord. Boundless est avant tout conçu pour les appareils mobiles et convient aux boutiques dont les stocks sont moyens à grands.

Exemple de boutique en ligne utilisant Boundless

Éditeur de thèmes Utilisez l'éditeur de thème pour personnaliser votre thème. La barre d'outils de l'éditeur de thème est divisée en Sections et Paramètres de thème.
La barre d'outils de l'éditeur de thème montrant les sections et les paramètres de thèmes
Vous pouvez utiliser des sections pour modifier le contenu et la présentation des différentes pages de votre boutique. Vous pouvez utiliser les paramètres de thèmes pour personnaliser les polices et les couleurs de votre boutique ainsi qu'apporter des modifications à vos liens de médias sociaux et à vos paramètres de passage à la caisse.

Sections Les sections sont des blocs de contenu personnalisables, qui déterminent la disposition de votre boutique en ligne. Chaque thème comprend des sections statiques et des sections dynamiques. ### Sections statiques Les sections statiques se trouvent toujours à des emplacements spécifiques de votre boutique en ligne. Vous pouvez modifier des sections statiques, mais vous ne pouvez pas les réorganiser ni les supprimer. Chaque type de page de votre boutique en ligne inclut différentes sections statiques.

Boundless inclut les sections statiques suivantes :

  • En-tête
  • Menu de la barre latérale
  • Barre d'annonces
  • Diaporama
  • Barre de menus
  • Bas de page
  • Produit
  • collection
  • Page de liste des collections
  • Article

Sections dynamiques Vous pouvez ajouter, réorganiser, et retirer des sections dynamiques pour personnaliser la mise en page de votre page d'accueil. Chaque thème propose un ensemble unique de sections dynamiques à choix.

Boundless inclut les sections statiques suivantes :

  • Articles de blog
  • Liste des collections
  • Collection en vedette
  • Image avec texte
  • Produit en vedette
  • Newsletter
  • Carte
  • Texte enrichi
  • Vidéo
  • Code HTML personnalisé

En-tête

La plupart des thèmes comprennent une section d'en-tête et une section de pied de page, qui s'affichent sur chaque page de la boutique. Boundless est différent des autres thèmes, car il ne comporte pas de section d'en-tête à la page d'accueil. Au lieu de cela, la page d'accueil affiche un menu de barre latérale et une barre d'actions en haut de la page. Pour afficher et modifier la section d'en-tête, sélectionnez un type de page en plus de la page d'accueil dans le menu déroulant de la barre supérieure.

La section d'en-tête offre la possibilité de mettre en ligne une image de logo et de définir une largeur de logo personnalisée.

Le menu de la barre latérale tient lieu de table des matières pour votre boutique. Quelle que soit la page où se trouve un client, le bouton de menu affiche le menu principal et le menu du pied de page de votre boutique :

Le menu de la barre latérale affiche deux menus : le menu principal , qui s'affiche en haut de la page dans une police plus grande, et le menu supplémentaire , qui s'affiche sous le menu principal dans une police plus petite.

Pour personnaliser le menu de la barre latérale :

  1. Cliquez sur Sections.

  2. Cliquez sur le menu Barre latérale.

  3. Dans la liste du menu principal , sélectionnez le menu que vous souhaitez afficher comme menu principal. En règle générale, il s'agit du menu principal de votre boutique.

  4. Dans la liste du menu supplémentaire , sélectionnez le menu que vous souhaitez afficher sous le menu principal. En règle générale, il s'agit du menu du pied de page de votre boutique.

  5. Cliquez sur Enregistrer.

Diaporama

Brooklyn utilise un diaporama en plein écran ou « bannière large/haute », il est donc préférable d'utiliser des images de très grande taille. Par exemple, utilisez des images d'au moins 3840 x 2160 px, à condition de ne pas dépasser les limites de mise en ligne de Shopify. Avec Boundless, vous pouvez présenter jusqu'à 6 diapositives dans le diaporama de la page d'accueil.

Boundless offre plusieurs fonctionnalités de diaporama qui ne sont pas disponibles avec tous les thèmes. Vous pouvez mettre en ligne un logo ou le nom de votre boutique au milieu de l'image du diaporama. Vous pouvez également appliquer une superposition de couleurs sur les images du diaporama.

Pour personnaliser le diaporama de votre boutique :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur Diaporama.

Ajouter une diapositive d'image :

  1. Dans la zone Contenu , cliquez sur Image.

  2. Pour ajouter une image à la diapositive, cliquez sur Sélectionner une image , puis effectuez l'une des opérations suivantes :

- Pour sélectionner une image que vous avez déjà mise en ligne dans votre interface administrateur de Shopify, cliquez sur l'onglet Bibliothèque. - Pour sélectionner une image de stock à partir de la collection d'images en stock Burst de Shopify, cliquez sur l'onglet Images gratuites. De là, vous pouvez saisir un terme de recherche ou parcourir les catégories d'images. - Pour sélectionner une image sur votre ordinateur local, cliquez sur l'onglet Bibliothèque , puis sur le bouton plus.

Pour afficher le nom de votre boutique sur des diapositives d'images :

  1. Dans la zone du logo , cliquez sur l'échantillon de couleur du texte pour sélectionner une couleur de texte dans une palette.

  2. Dans la liste Type de logo , sélectionnez Texte du nom de la boutique. Le nom de votre boutique s'affiche automatiquement.

Pour afficher le logo de votre boutique sur des diapositives d'images :

  1. Dans la zone du logo , dans la liste Type de logo , sélectionnez Logo personnalisé.

  2. Dans la zone Image de logo personnalisée , cliquez sur Sélectionner une image , puis effectuez l'une des opérations suivantes :

- Pour sélectionner une image que vous avez déjà mise en ligne dans votre interface administrateur de Shopify, cliquez sur l'onglet Bibliothèque. - Pour sélectionner une image sur votre ordinateur local, cliquez sur l'onglet Bibliothèque , puis sur le bouton plus.

  1. Inscrivez la largeur du logo dans le champ intitulé Largeur du logo (en pixels).

Pour appliquer une superposition de couleurs aux images du diaporama :

  1. Dans la zone Superposition , cliquez sur l'échantillon des Couleurs de superposition d'image pour sélectionner une couleur dans une palette.

  2. Dans la liste Opacité , sélectionnez un taux de transparence pour la superposition d'image.

Barre de menus

Par défaut, la barre de menus affiche le menu principal de votre boutique. Vous pouvez personnaliser votre barre de menus de manière à afficher différents éléments, selon la page consultée par votre client. Le plus souvent, on utilise la barre de menus de la page d'accueil pour présenter les collections de produits. À l'intérieur d'une collection, la barre de menus peut afficher d'autres sous-catégories ou des collections connexes.

Prenons l'exemple d'une boutique de vêtements dont la page d'accueil contient une barre de menus affichant les rubriques Hommes , Femmes et Accessoires. Si une cliente clique sur Femmes , la barre de menus peut alors afficher Hauts , Pantalons et Chaussures sur la page de la collection.

Pour que votre barre de menus fonctionne de cette façon, utilisez les liens de votre menu principal pour accéder à vos collections. Insérez des liens vers d'autres parties de votre boutique (vos pages Contact ou À propos ) dans votre menu de pied de page.

Pour personnaliser votre barre de menus :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur la barre de menus.

  3. Dans la liste des menus , sélectionnez celui que vous souhaitez afficher dans la barre de menus.

  4. Cliquez sur Enregistrer.

Bas de page

Avec Boundless, vous pouvez afficher un menu dans le contenu de votre pied de page.

Pour personnaliser le pied de page de votre boutique :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur Pied de page.

  3. Dans la liste des menus , sélectionnez celui que vous souhaitez afficher dans le pied de page.

  4. Cliquez sur Enregistrer.

Produit

Dans la section Produits , vous pouvez ajouter ou supprimer les éléments suivants :

  • La marque ou le distributeur du produit
  • Un sélecteur de quantité
  • Icônes de partage social
  • Un bouton de passage à la caisse dynamique

Vous pouvez également ignorer la première image du produit, définir le style de vos images et choisir la largeur du formulaire du produit.

Pour modifier les paramètres des pages de produit :

  1. Dans le menu déroulant de la barre supérieure, sélectionnez Pages de produit.

  2. Cliquez sur Sections.

  3. Cliquez sur Produit.

  4. Pour ignorer la première image du produit, cochez Ignorer la première image du produit.

    Cela signifie que la première image du produit ne s'affiche que sur les pages de collection, et non sur les pages de produits. Grâce à cette option, vous pouvez concevoir la première image de votre produit pour la rendre plus attrayante sur les pages de collection et personnaliser vos autres images de produits pour les rendre plus visibles dans l'espace plus grand figurant sur les pages de produits :

    Un exemple montrant la page de collection avec la première image du produit et la page du produit avec les deuxième et troisième images du produit.

  5. Pour définir votre style d'image, dans le menu déroulant Style d'image , sélectionnez Grand/carré ou Large.

  6. Pour afficher la marque ou le distributeur du produit, cochez Afficher le distributeur. Pour qu'une marque ou un distributeur s'affiche, vous devez ajouter un distributeur au produit.

  7. Pour afficher un sélecteur de quantité, cochez Afficher le sélecteur de quantité.

  8. Pour afficher les icônes de partage social, cochez Activer le partage de produits.

  9. Pour afficher un bouton de passage à la caisse dynamique, cochez la case Afficher le bouton de passage à la caisse dynamique.

  10. Pour définir la largeur de votre formulaire de produit, dans le menu déroulant Largeur du formulaire de produit , sélectionnez Petit ou Grand.

  11. Cliquez sur Enregistrer.

collection

Boundless inclut plusieurs options de tri et de filtrage, d'apparence et de pagination pour les pages de votre collection.

  1. Dans l'aperçu de l'éditeur de thème, ouvrez la page d'une collection.

  2. Cliquez sur l'onglet Sections.

  3. Cliquez sur Collection.

  4. Dans la zone Apparence , définissez les options suivantes :

- Dans la liste Style d'image , sélectionnez une orientation pour les images de produits –  Haut/carré ou Large.

  • Dans la liste Taille de l'image , sélectionnez une taille pour vos images de produits.

  • Si vous souhaitez augmenter l'espace entre les images, cochez Ajouter de l'espace entre les images.

  • Si vous souhaitez afficher le nom du distributeur ou de la marque sous les images de produits, cochez Afficher le distributeur du produit.

  1. Dans la zone Tri et filtrage , définissez les options suivantes :
  • Si vous souhaitez afficher une liste d'options de tri, cochez Afficher les options de tri.

  • Si vous souhaitez afficher une liste permettant aux clients de filtrer par balise, cochez Afficher le filtrage des balises.

  1. Dans la zone Pagination , dans la liste Type de pagination , sélectionnez si vous souhaitez afficher des pages numérotées ou un bouton « Afficher plus ».

  2. Cliquez sur Enregistrer.

Collection en vedette

Dans la section Collection présentée de l'éditeur de thème, l'option Style d'image vous permet de modifier la manière dont les images s'affichent sur vos pages de collections et de produits :

  • Sélectionnez Haut/carré si vos images de produits sont carrées ou en orientation portrait
  • Préférez Large si vos images sont rectangulaires ou en orientation paysage

L'option Taille de l'image détermine la taille des images de vos produits sur la page de vos collections. Plus vos images de produits sont petites, plus vous pouvez en placer sur chaque ligne.

Le nombre d'images affichées par ligne dépend également de l'appareil utilisé par le client (ordinateur de bureau ou mobile) et de la taille de la fenêtre.

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur la section Collection en vedette.

  3. Sélectionnez une collection dans la liste Collection. Jusqu'à 50 produits de la collection sélectionnée s'affichent alors.

  4. Dans la liste Style d'image, choisissez si vous souhaitez que le format de vos images soit haut/carré ou large.

  5. Dans la liste Taille de l'image , sélectionnez une taille d'image.

  6. Pour augmenter l'espace autour des images de produits, cochez Ajouter de l'espace entre les images.

  7. Pour afficher le nom du fournisseur ou de la marque d'un produit, cochez Afficher le distributeur du produit.

  8. Cliquez sur Enregistrer.

Newsletter

Vous pouvez ajouter un champ d'inscription à votre newsletter en page d'accueil. Cela vous permet de recueillir les adresses e-mail de clients pour vos campagnes de marketing par e-mail. Consultez le blog de Shopify pour en savoir plus sur le marketing par e-mail.

La section newsletter sur un site web. Ce champ comprend une zone de texte pour que les clients y saisissent leur adresse e-mail, mais aussi un bouton « S'abonner ».

Pour ajouter un champ d'inscription à la newsletter à votre page d'accueil :

  1. Trouvez Boundless et cliquez sur Personnaliser.

  2. Cliquez sur Sections.

  3. Cliquez sur Ajouter une section  > Newsletter.

  4. Saisissez un titre pour l'inscription à la newsletter dans le champ Titre. Le titre par défaut est : « Abonnez-vous à notre newsletter ».

  5. Saisissez un sous-titre pour l'inscription à la newsletter dans le champ Sous-titre.

  6. Cliquez sur Enregistrer.

Texte enrichi

Utilisez la section Texte enrichi pour fournir tout contenu écrit que vous souhaitez afficher sur votre page d'accueil ou pour intégrer une page créée dans votre interface administrateur de Shopify. Par exemple, vous pouvez présenter de futurs événements en intégrant votre page de blog, ou afficher une page comportant l'un ou l'autre des éléments suivants :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur Texte enrichi.

  3. Saisissez et formatez votre texte.

  4. Si vous souhaitez afficher une page de votre boutique, cliquez sur Ajouter du contenu , puis sur Page. Sélectionnez une page à afficher en tant que page d'accueil dans le menu déroulant.

  5. Cliquez sur Enregistrer.

Vidéo

Vous pouvez ajouter une vidéo YouTube ou Vimeo sur votre page d'accueil. Les vidéos permettent d'éveiller la curiosité de vos clients et de les intéresser à votre entreprise.

Pour ajouter une vidéo à votre page d'accueil :

  1. Trouvez Boundless et cliquez sur Personnaliser.

  2. Cliquez sur Sections.

  3. Cliquez sur Ajouter une section  > Vidéo.

  4. Saisissez un titre pour la vidéo dans le champ Titre.

  5. Saisissez le lien de partage de votre vidéo dans le champ Lien de la vidéo.

    Voici à quoi ressemble un lien de partage Youtube : https://youtu.be/OTJXAUZY9t0. Pour découvrir comment copier le lien de partage d'une vidéo Youtube, consultez cet article de l'Aide YouTube.

    Voici à quoi ressemble un lien de partage Vimeo : https://vimeo.com/281332510. Pour découvrir comment copier le lien de partage d'une vidéo Vimeo, consultez cet article du Centre d'aide de Vimeo.

  6. Cliquez sur Enregistrer.

Code HTML personnalisé

Dans la section HTML personnalisé , vous pouvez utiliser du code HTML pour créer du contenu personnalisé pour votre page d'accueil. Par exemple, vous pouvez utiliser le langage HTML pour mettre en forme des blocs de texte, créer des tableaux ou incorporer du contenu à partir d'un site web tiers.

Pour ajouter du langage HTML personnalisé à votre page d'accueil :

  1. Trouvez Boundless et cliquez sur Personnaliser.

  2. Cliquez sur Sections.

  3. Cliquez sur Ajouter une section.

  4. Dans la zone Mise en page avancée , cliquez sur HTML personnalisé > Ajouter.

  5. Cliquez sur HTML personnalisé et saisissez le code HTML que vous souhaitez ajouter à votre page d'accueil.

  6. Cliquez sur Enregistrer.

Paramètres du thème Vous pouvez utiliser les paramètres du thème pour personnaliser les couleurs et la typographie de votre boutique en ligne. Vous pouvez également configurer des liens vers vos comptes de médias sociaux, modifier les paramètres de votre panier et ajouter un favicon.

Boundless inclut les paramètres de thèmes suivants :

  • Couleurs
  • Typographie
  • Panier
  • Médias sociaux
  • favicon
  • Paiement

Couleurs

Vous pouvez choisir les couleurs pour les différentes parties de votre boutique en ligne.

Étapes :

  1. À côté de , cliquez sur Personnaliser.

  2. Cliquez sur Paramètres du thème.

  3. Cliquez sur Couleurs.

  4. Pour chaque type de contenu, cliquez sur l'échantillon de couleur pour utiliser le sélecteur de couleur :

    Le sélecteur de couleurs dans l'éditeur de thème

- La zone Sélection récente affiche les couleurs que vous avez récemment sélectionnées pour votre thème. - La zone En cours d'utilisation affiche les couleurs que vous utilisez actuellement dans d'autres parties de votre thème.

Pour configurer la couleur sur transparent, cliquez sur Aucun.

  1. Cliquez sur Enregistrer.

Typographie

Vous pouvez choisir la typographie du texte de votre boutique en ligne.

Étapes :

  1. À côté de , cliquez sur Personnaliser.

  2. Cliquez sur Paramètres du thème.

  3. Cliquez sur Typographie.

  4. Pour chaque type de texte, cliquez sur Modifier pour utiliser le sélecteur de police :

    Le bouton « Modifier » du sélecteur de police

  5. Explorez les polices en utilisant le champ de recherche ou en cliquant sur Charger plus.

    Pour voir toutes les polices disponibles, voir la bibliothèque de polices de Shopify.

  6. Cliquez sur le nom de la police que vous souhaitez utiliser.

  7. Pour modifier le style d'une police, par exemple en la mettant en gras ou en italique, cliquez sur Normal. Ensuite, cliquez sur le style que vous souhaitez utiliser, puis sur Sélectionner  :

    Une sélection d'épaisseurs de police disponibles dans le sélecteur de police

  8. Cliquez sur Enregistrer.

Panier

Boundless vous permet de personnaliser la page de votre panier en sélectionnant le type de panier et en activant les notes de commande du client.

Le thème Boundless prend en charge deux types de panier :

  • Lorsqu'un article est ajouté au panier, Page redirige vos clients vers la page de votre panier.

  • Tiroir ouvre un tiroir sur le côté de la page lorsque des éléments sont ajoutés à un panier et invite l'utilisateur à passer à la page de paiement.

Boundless inclut également une option permettant à vos clients de vous envoyer des instructions spéciales avec leur commande.

Définir les options de panier dans Brooklyn :

  1. Cliquez sur Paramètres du thème.

  2. Cliquez sur la page Panier.

  3. Sélectionnez un type de panier dans la liste Type de panier.

  4. Si vous souhaitez autoriser les clients à fournir des notes de commande à la caisse, cochez la case Activer les notes de commande.

  5. Cliquez sur Enregistrer.

Médias sociaux

Vous pouvez ajouter des boutons de partage social pour vos produits et vos articles de blog ainsi que des liens vers vos comptes de médias sociaux.

Pour personnaliser les paramètres des médias sociaux :

  1. Trouvez Boundless et cliquez sur Personnaliser.

  2. Cliquez sur Paramètres du thème.

  3. Cliquez sur Médias sociaux.

  4. Pour mettre en ligne une image de partage social, dans la zone Image de partage social , cliquez sur Sélectionner une image ou Explorer des images gratuites.

  5. Pour ajouter des liens vers vos comptes de médias sociaux, dans la zone Comptes , saisissez les liens vers vos comptes dans les champs fournis. Saisissez les liens complets, tels que https://instagram.com/shopify, ou https://twitter.com/shopify.

    Les liens vers vos comptes de médias sociaux s'affichent dans le pied de page de votre boutique en ligne.

  6. Pour ajouter des boutons de partage social à vos produits et vos articles de blog, dans la zone Options de partage , cochez une ou toutes les cases.

    Vous pouvez ajouter les boutons de partage suivants :

- Partager sur Facebook - Tweeter sur Twitter - Épingler sur Pinterest (non disponible pour le partage d'articles de blog)

  1. Cliquez sur Enregistrer.

favicon

Vous pouvez mettre en ligne une icône de favoris, ou une « favicon », qui peut vous aider à marquer votre boutique en ligne en affichant votre logo dans les emplacements suivants :

  • l'onglet de votre navigateur web
  • l'historique de votre navigateur web
  • icônes sur votre bureau
  • à côté de votre nom de boutique en ligne lorsqu'il est marqué d'un signet.

Pour mettre en ligne un favicon :

  1. Cliquez sur l'onglet Paramètres du thème.

  2. Cliquez sur Favicon.

  3. Dans la zone Image favicon , cliquez sur Sélectionner une image , puis effectuez l'une des opérations suivantes :

- Pour sélectionner une image que vous avez déjà mise en ligne dans votre interface administrateur de Shopify, cliquez sur l'onglet Bibliothèque. - Pour sélectionner une image sur votre ordinateur local, cliquez sur l'onglet Bibliothèque , puis sur le bouton plus.

  1. Cliquez sur Enregistrer.

Paiement

Cette section vous permet de personnaliser la caisse de votre boutique. Cliquez ici pour obtenir plus d'informations sur la page de paiement de votre boutique.

Configurer des sous-menus dans la barre de menus

Lorsque vous configurez la navigation de votre boutique, il est important de noter que si vous créez un menu lié à la page d'accueil dans la barre de menus, celui-ci s'affichera également sur la page d'accueil. Cela peut se produire lorsque vous configurez des menus pour des collections qui n'existent pas encore. À la place, vous créez un lien de paramètre fictif vers la page d'accueil.

Il est recommandé de créer vos collections avant de créer les liens de collection pour la barre de menus. Vous pouvez également insérer un lien vers la page « Tous les produits » en attendant de créer la collection que vous souhaitez mettre en lien.

Prêt(e) à commencer à vendre avec Shopify ?

Essayez gratuitement