Le style et les fonctionnalités de la famille de templates Pacific.

La famille de templates Pacific (Bryler, Charlotte, Horizon, Naomi et Pacific) utilise un texte superposé et une page Index en pleine page avec défilement afin d’uniformiser tous vos contenus.

Ce guide présente les fonctionnalités et les options de design de la famille de templates Pacific. Les ajustements des Styles du site et la section sous laquelle ils s’affichent dans le panneau Styles du site apparaissent en gras.

Pages prises en charge

Pacific prend en charge les types de pages suivants :

• Pages Album
• Pages Blog - Liste
• Pages de couverture
• Pages Événements
• Pages Galerie – Standard
• Pages Index – Empilées
• Pages Disposition
• Pages Boutique - Classique

En-tête

Les visiteurs utilisent l’en-tête dans la partie supérieure de la page pour naviguer sur votre site. Dans Pacific, l’en-tête comprend le titre ou le logo du site (branding) et les liens de navigation.

• Le branding est centré.
• Les pages d’accueil de l’index peuvent avoir une navigation fixe.

Modifiez les polices et les couleurs de l'en-tête à l'aide des ajustements de la section En-tête du site :

• Définissez la couleur de l’en-tête à l’aide de l’ajustement Couleur d’arrière-plan.
• Affichez les bannières derrière l’en-tête à l’aide de l’ajustement Transparent sur les images de bannière.
• Modifiez la taille du titre du site à l’aide du curseur Taille de la police dans l’ajustement Police du titre du site. Pour éviter toute déformation, ne dépassez pas 72 pixels.
• Modifiez la taille du logo à l’aide de l’ajustement Largeur du logo.

Personnalisez les liens de navigation à l'aide des ajustements de la section Navigation du site. Indiquez si la navigation doit apparaître sur la page ou derrière une icône ☰ à l'aide de l'ajustement Toujours utiliser la navigation superposée.

• Lorsque cette option n’est pas sélectionnée, les liens de navigation s’affichent en dessous du branding ou de chaque côté, selon le nombre de pages et la largeur du navigateur.
• Modifiez la Couleur du lien et définissez la superposition d’arrière-plan à l’aide de l’ajustement Couleur d’arrière-plan.
• Dans la superposition ☰, les liens sont redimensionnés automatiquement afin de s’adapter au mieux au menu. L’ajustement Police des liens : Taille de police ne modifie pas ces liens.

Bannières

Les bannières créent un effet visuel qui donne du caractère à votre page. Ajoutez des vidéos et des images mises en avant pour créer vos bannières.

• Les bannières s’affichent sur les pages Album, Blog, Événements, Galerie (image uniquement), Produits et Disposition.
• Empilez verticalement plusieurs bannières dans un index.
• Le titre et la description des pages et l’en-tête du site peuvent apparaître en superposition de la bannière.
• Ajoutez un filtre de couleur à l'aide de l'ajustement Couleur de superposition dans la section Bannière de la page. Les sections d'index ont des couleurs de superposition distinctes.

Texte de la bannière

Le titre et la description des pages peuvent s’afficher sur les bannières.

• Modifiez les polices à l'aide des ajustements de la section Bannière de la page. Masquez tous les titres avec l'ajustement Afficher le titre de la page.
• Pour que les descriptions de la page ne s’affichent plus, supprimez-les dans les paramètres de la page. Pour les supprimer sans modifier la hauteur de la bannière, remplacez le texte par des sauts de ligne.
• Pour utiliser un autre texte dans les résultats de recherche, ajoutez des titres et des descriptions SEO.

Hauteur de la bannière

Pour modifier la hauteur, vous pouvez :

• Modifiez la marge intérieure dans la section Bannière de la page.
• augmenter la hauteur de la description de la page en ajoutant des sauts de ligne.

Remarques concernant les bannières

Important :

• Il arrive parfois que les bannières vidéo ne s’affichent pas sur les appareils mobiles, en fonction de la vitesse de connexion et de la version du navigateur. Définissez une image de remplacement pour appareil mobile, qui apparaîtra lorsqu'une bannière vidéo ne peut être chargée.
• Si une page Galerie ne dispose d’aucune image mise en avant, la première image est automatiquement utilisée comme bannière chaque fois que vous effectuez une modification dans la galerie. Si vous n’avez pas besoin d’une bannière sur votre page Galerie, ouvrez les Paramètres de la page et supprimez l’image mise en avant.

Arrière-plan

Définissez la couleur d'arrière-plan du site à l'aide de l'ajustement Couleur d'arrière-plan dans la section Contenu principal.

• L'en-tête, les pieds de page et le pied de page secondaire ont leurs propres couleurs d'arrière-plan.
• Vous pouvez définir des couleurs d’arrière-plan alternées pour les sections d’un index.

Pieds de page

Personnalisez le pied de page du site Pacific à l’aide de blocs. Le pied de page peut inclure des liens de navigation, des coordonnées et une deuxième zone de contenu appelée « pied de page secondaire ».

Personnalisez le style du pied de page, des coordonnées et des liens de navigation en pied de page à l'aide des ajustements de la section Pied de page :

• Affichez et personnalisez le style des coordonnées à l’aide des ajustements Informations du site.
• Modifiez les informations dans les champs Emplacement physique, E-mail de contact et Numéro de téléphone dans Informations sur l'entreprise.

Astuce : si vous ne voyez pas l’ajustement Informations du site, prévisualisez un autre template sur votre site, puis annulez l’aperçu.

Le pied de page secondaire est affiché au-dessus du pied de page.

• Personnalisez les couleurs de l'arrière-plan et du texte dans la section Pied de page secondaire des styles du site.
• Pour afficher le pied de page secondaire, sélectionnez Contenu : Personnalisé. Pour le masquer, sélectionnez Contenu : Vide.

Important :

• Le contenu de démonstration de certains templates est doté d’un bloc Liens sociaux. Supprimez le bloc pour supprimer les icônes sociales.
• Les liens hypertexte du pied de page et du pied de page secondaire sont soulignés.

Pages Blog

Dans Pacific, les pages Blog s’affichent sous forme de liste dans laquelle les publications sont empilées verticalement.

Sur la page de destination :

• Ajoutez une navigation par catégorie pour afficher des filtres de catégorie en haut de la page.
• Les images mises en avant des publications s’affichent sous le titre des publications qui ont des extraits,
• Les extraits contiennent des liens « En savoir plus ».
• Le contenu complet des publications individuelles s'affiche sous le titre pour les publications sans extraits.

Sur les publications individuelles :

• Chaque billet de blog est doté d’une navigation vers les publications précédentes et suivantes en dessous des commentaires.
• Les blocs Texte à colonne unique sont insérés sur un côté. La variation de disposition attire le regard des visiteurs vers vos billets de blog. Il est impossible de modifier la largeur du retrait.

Modifiez le style des métadonnées à l'aide des ajustements du Blog :

• La date, les catégories et le nom de l’auteur sont affichés au-dessus de la publication. Utilisez l’ajustement Priorité des métadonnées pour déplacer l’un de ces éléments au-dessus du titre de la publication.
• Pour masquer le nom de l’auteur, sélectionnez Masquer l’auteur de l’entrée. Cet ajustement n’est pas disponible si l’ajustement Priorité des métadonnées : Auteur est sélectionné.
• Les URL source, les tags, les commentaires, les mentions « J’aime » et les boutons de partage s’affichent sous la publication. Pour les masquer, sélectionnez Masquer le pied de page de l’entrée de la liste.

Personnalisez le style du texte à l'aide des ajustements suivants du Contenu principal :

• Personnalisez le style des métadonnées à l’aide des ajustements Méta.
• Les titres des publications suivent les ajustements Titre 1.
• Le corps de texte suit les ajustements Police du texte et Couleur du texte.

Pages Index

Dans Pacific, les pages Index organisent le contenu de plusieurs pages en sections empilées. Ceci permet de mettre en avant différentes images et différentes informations de façon simultanée.

• Les sections de contenu sont créées à partir des pages Disposition. Elles permettent d’ajouter du texte, des boutons et d’autres blocs.
• Les sections Index de galerie sont conçues à partir des pages Galerie et s’affichent sous forme de grille ou de diaporama.
• Les sections d’album sont conçues à partir des pages Album.
• Les images mises en avant de page s’affichent en arrière-plan pour les sections de contenu et d’album.

Sections de l’index de galerie

Personnalisez le style des sections Index de galerie dans la section Galerie de l’index du panneau Styles du site. Définissez la disposition de toutes les sections Index de galerie à l’aide de l’ajustement Design.

Pour les dispositions en diaporama :

• Sélectionnez ou non l’option Lecture automatique pour les galeries et définissez Transition du diaporama sur Fondu ou sur Défilement.
• Ajoutez ou masquez des éléments de navigation à l’aide de Commandes de la galerie.
• Ajoutez une icône œil qui permet aux visiteurs d’activer ou de désactiver les légendes à l’aide du Sélecteur de superposition de la galerie.
• Le titre et la description des images sont centrés sur l’image.

Pour les dispositions en grille :

• Choisissez le nombre d’images à afficher horizontalement à l’aide de Nombre max. de colonnes dans la grille.
• Le titre des images s’affiche en cas de survol. La description des images ne s’affiche pas.

Les vidéos ajoutées à la galerie :

• s’ouvrent dans une lightbox sur les appareils mobiles ;
• peuvent être lues automatiquement.

Arrière-plan des sections

Pour les sections de contenu et d’album :

• Les images mises en avant de page s’affichent en arrière-plan.
• Les sections sans images mises en avant affichent la couleur d’arrière-plan du site.
• Utilisez l’ajustement Séparateur de sections dans la section Index pour choisir entre des couleurs d’arrière-plan alternées et une bordure qui sépare les sections lorsque deux sections consécutives n’ont pas d’image d’arrière-plan.

Pour les sections Index de galerie :

• Disposition en diaporama : les images s’affichent en pleine page.
• Disposition Grille - La Couleur de superposition de la galerie définie dans Galerie de l'index est entièrement opaque dans les espaces vides de la grille.

Superpositions de couleur

Vous pouvez ajouter un filtre de couleur aux images et aux vidéos afin de faire ressortir les contenus superposés.

• Sections de contenu et d'album - Utilisez l'ajustement Couleur dans la section Superposition d'index.
• Sections de l'index de galerie - Utilisez l'ajustement Couleur de superposition de la galerie dans la section Galerie de l'index. La couleur s'affiche uniquement sur les images ayant un titre ou une description. Pour les dispositions en grille, la couleur s'affiche au survol.

Hauteur de section

Pour changer la hauteur des sections de contenu et d'album, modifiez la marge intérieure à l'aide des ajustements suivants :

• Sections avec des images de bannière - Utilisez l'ajustement Marge intérieure des pages dans la section Superposition d'index.
• Sections sans images de bannière - Utilisez l'ajustement Marge intérieure des pages dans la section Index.
• Dans les sections de contenu, vous pouvez également augmenter la hauteur en ajoutant des sauts de ligne supplémentaires au contenu de la page.

Modifiez la hauteur des sections Index de galerie à l'aide des ajustements dans la Galerie de l'index :

• Disposition en diaporama : modifiez la Valeur de proportion du diaporama.
• Disposition en grille : modifiez la Valeur de proportion de la grille et le Nombre maximum de colonnes dans la grille.

Liens de navigation

Sur les pages Index définies comme page d’accueil :

• La navigation dans l'en-tête peut être verrouillée pour apparaître en haut de la fenêtre du navigateur lorsque vous faites défiler la première section de la page Index (navigation fixe).
• Vous pouvez ajouter des liens vers les sections de contenu et d’album à la navigation. Lorsque vous cliquez sur le lien, la page défile jusqu’à cette section.

Pour verrouiller la navigation, sélectionnez Navigation de défilement dans l'index : affichage suivant le défilement dans la section des styles du site Navigation du site. Définissez la couleur d'arrière-plan de navigation à l'aide de Couleur d'arrière-plan dans En-tête du site.

Important :

• Le branding du site ne s’affiche pas.
• Vous devez avoir plus d'une section dans votre index pour que la navigation verrouillée apparaisse.

Si vous voulez créer des liens de navigation pour les sections de contenu et d'album, sélectionnez Développer les liens d'index de la page d'accueil sans la section Navigation du site.

• Les sections de l’index de galerie ne s’affichent pas dans la navigation. Utilisez des liens d’ancrage d’index afin de créer des liens pour ces sections.

Remarques concernant les pages Index

• Les annotations Modifier peuvent ne pas apparaître sur les sections vides. Pour modifier une page vierge, déplacez-la hors de l’index, ajoutez du contenu, puis replacez-la dans l’index.
• Pour changer la couleur des blocs Bouton, Formulaire et Citation sur les images, utilisez les ajustements Superposition d’index.
• Les boutons de partage s’affichent toujours dans les sections d’album.

Navigation par catégorie

Les visiteurs utilisent les liens de la navigation par catégorie pour filtrer les pages par catégorie de publications ou de produits.

Ajoutez et personnalisez le style de la navigation par catégorie en haut des pages Blog et Boutique dans la section Navigation par catégorie du panneau Styles du site. Les modifications apportées au style sont appliquées à toutes les navigations par catégorie de votre site.

Panier

Lorsqu’un client ajoute un produit à son panier, un bouton Panier s’affiche en haut à droite de toutes les pages. Pour personnaliser le bouton :

1. Ajoutez un produit à votre panier pour que le bouton s’affiche.
2. Changez la Couleur d'arrière-plan du bouton Panier et la Couleur de la police du bouton Panier dans la section En-tête du site.

Mobile

Grâce au design réactif intégré de Squarespace, votre site bénéficie d’un affichage optimal quel que soit l’appareil.

• Lorsque la navigation est réduite, le symbole ☰ apparaît en haut à gauche. Il peut rester affiché lorsque vous faites défiler des pages Index définies comme page d’accueil.
• Le titre ou le logo du site s’affiche en haut au centre, avec une hauteur maximale de 50 pixels.
• Le bouton Panier s’affiche en bas à droite.
• Vous pouvez désactiver les styles mobiles, mais nous vous déconseillons de le faire.
• Les galeries en grille affichent deux images par ligne. Si vous avez un nombre impair d’images, la dernière image est accompagnée d’un espace vide.

Sur les appareils mobiles, les titres ne s’affichent pas au-delà des tailles maximales suivantes :

• Titre 1 : 34 pixels
• Titre 2 : 26 pixels
• Titre 3 : 20 pixels

Sur les smartphones :

• Un lien Haut de page s’affiche en bas de l’écran, au-dessus du pied de page.
• Les galeries des pages Index n’affichent pas les descriptions d’image.

Options de langue

Dans cette famille, les templates Charlotte, Naomi et Pacific prennent en charge deux options de langue :

• Vous pouvez choisir la langue du texte intégré de votre site (comme celui des formulaires et du message de confirmation des commandes).
• Vous pouvez créer un nouveau site en utilisant un template en français, en allemand, en italien, en portugais ou en espagnol.

Résolution de problème avec le template Pacific

Voici quelques problèmes courants avec ce template. Certains sont des bogues ou des problèmes connus. Même si nous prenons toujours en charge la version 7.0 de Squarespace, la correction de bogues ou de problèmes n’est pas notre priorité. Nous nous concentrons sur notre plateforme actuelle, à savoir la version 7.1. Vous pouvez faire passer votre site de la version 7.0 à la version 7.1 à l’aide de notre outil de mise à jour.

Ajout de liens de RSVP ou de listes de mariage

Pour ajouter ces liens :

• Créez un bouton RSVP sur une page de disposition à l'aide d'un bloc Formulaire. Ce bloc collecte des informations auprès des visiteurs.
• Créez des liens de registre sur une page de disposition avec un bloc Galerie en grille, en utilisant des images avec des URL de destination vers différents sites de registre.
• Pour voir un exemple concret de leur apparence, consultez la page d'aperçu en direct de Naomi.

Modification des en-têtes et du texte des pages Index

Dans un index, la façon dont vous réglez la couleur et la taille du titre et du texte dépend du type de page et de la présence d'une image de bannière ou non. Personnalisez cette option dans des styles de site.

Pour le contenu et les sections dʼalbum avec des images dʼarrière-plan :

• Modifiez la police et la typographie à lʼaide des ajustements de la section Contenu principal.
• Ajustez la couleur et la taille à lʼaide des ajustements de la section Superposition dʼindex.

Pour le contenu et les sections dʼalbum sans images dʼarrière-plan :

• Modifiez la police, la typographie, la couleur et les tailles à lʼaide des ajustements de la section Contenu principal.

Pour les pages Galerie, utilisez la section Galerie de lʼindex.

Création d'une bannière non recadrée avec un index

Les bannières de page de nʼimporte quel template sont toujours recadrées, en particulier sur les appareils mobiles.

Avec la page Index de la famille Pacific, vous pouvez créer lʼapparence dʼune bannière dʼen‑tête qui ne sera pas recadrée :

1. Ajoutez une page Index.
2. Ajoutez une page Galerie à l'index.
3. Ajoutez votre image de bannière préférée à la page Galerie. Nʼajoutez pas plus dʼune image, car cela affectera le recadrage.
4. Ajoutez du texte dans les champs Titre de l'image et Description. Ce texte s'affichera sur l'image.
5. Dans les styles de site, faites défiler jusqu'à Galerie d'index et sélectionnez Design : diaporama puis Valeur de proportion du diaporama : auto.
6. Ajoutez tout contenu de page que vous souhaitez afficher sous la bannière en tant que deuxième page dans lʼindex.

Utilisez ces modifications de styles de site pour ajuster davantage comment lʼimage de la page Galerie sʼaffiche :

• Transparent sur les images de bannière : affiche lʼen-tête du site sur lʼimage.
• Couleur de superposition de la galerie : ajustez le filtre de couleur sur lʼimage.
• Titre de la Galerie et description de la Galerie - Ajustez la police et la couleur du texte de l'image de la galerie.

Voici un exemple de la façon dont la page peut apparaître :

Les images de la galerie sont plus foncées dans l'index

La page Index peut afficher la section Index de galerie avec un filtre partiellement opaque.

Pour modifier ou supprimer cette couleur de superposition, utilisez lʼajustement Couleur de superposition de la galerie dans la section Galerie dʼindex de Styles du site. Utilisez le curseur dʼopacité pour modifier la transparence.

Couleurs de superposition de la galerie qui ne s'affichent pas

La couleur de superposition de la galerie s'affiche lorsqu'il existe une description ou un titre pour cette image. S'il n'y a pas de description ou de titre, la couleur de superposition ne s'affiche pas.

Pour savoir comment ajouter un titre ou une description dʼimage, consultez lʼarticle Utiliser les pages Galerie.

Personnalisation du pied de page secondaire

Si le pré-pied de page nʼa pas de contenu, il ne sera pas visible lorsque le panneau Styles du site est ouvert. Pour le voir :

1. Quittez les styles de site.
2. Ajoutez du contenu au pied de page secondaire.
3. Ouvrez à nouveau Styles du site pour continuer à apporter des modifications.

Je ne trouve pas le pied de page secondaire

Vous avez peut-être défini le pré-pied de page sur Contenu : vide dans les styles de site. Cela masque votre pré-pied de page aux visiteurs et vous empêche de le modifier. Pour rendre le pré-pied de page visible à nouveau :

1. Ouvrez le panneau Styles du site.
2. Faites défiler l’écran vers le bas jusqu’à Pied de page secondaire.
3. Dans le menu déroulant, définissez Contenu sur Contenu : personnalisé.
4. Vous pouvez personnaliser le style en modifiant notamment la couleur de l’arrière-plan, du titre et du texte.
5. Cliquez sur Enregistrer en haut du panneau.

Bordure de séparation qui ne s'affiche pas

Si vous ne voyez pas les bordures de séparation entre les sections sans images de bannière :

1. Ouvrez Styles du site sur la page Index.
2. Dans la section Index, cochez Séparateur de sections : bordure.
3. Modifiez le réglage de la couleur de la bordure. Il se peut que vous deviez modifier la transparence.

Le défilement sur la page Index ne permet pas d'aller jusqu'en haut

Lorsque votre page Index est définie comme page dʼaccueil, les liens de page Index dans la navigation vous mènent en haut de chaque section page Index. Pour que le lien de la section supérieure vous redirige vers tout en haut de votre site :

1. Accédez à votre page Index.
2. Ouvrez le panneau Styles du site.
3. Dans la section En-tête du site, cochez Transparent sur les images de bannière.

Le titre de votre site et la navigation sʼaffiche sur les bannières de votre site, y compris la section supérieure de votre index. Cliquez sur le lien correspondant à la section supérieure de votre index (par exemple, le lien Accueil sur le site de démo Pacific) pour vous diriger en haut de votre site.

Si la page Index ne défile toujours pas vers le haut, assurez-vous que la première page de votre index est une page Disposition, et non pas une page Galerie ou Album. Les pages Galerie et Album nʼapparaissent pas dans la navigation des pages Index.

page Index qui comporte d'autres couleurs d'arrière-plan

Dans une page Index, deux sections ou plus sans images de bannière peuvent avoir des couleurs dʼarrière-plan alternées.

Pour désactiver cette fonctionnalité, choisissez lʼajustement Séparateur de section : Contour dans la section Index de Styles du site. Ainsi, vous ajouterez une bordure entre deux sections consécutives sans images de bannière.

L'icône de navigation s'affiche à la place des principaux liens de navigation

Pour désactiver cette fonctionnalité, décochez Toujours utiliser la navigation par superposition dans la section Navigation sur le site des styles de site. La navigation s'affiche à nouveau sous forme de texte.

Sur certains navigateurs étroits, comme ceux des appareils mobiles, la navigation est toujours cachée derrière un ☰, même si vous avez désactivé l'option. Cela est intégré au design du template.

Liens de navigation qui ne s'affichent pas

Tout dʼabord, vérifiez que les pages souhaitées dans votre navigation se trouvent dans la section Navigation principale du panneau Pages.

Ouvrez ensuite le panneau Styles du site. Faites défiler la page jusquʼà la section Navigation du site et suivez ces conseils de résolution des problèmes :

• Si une page Index est définie comme page d'accueil, confirmez que l'option Développer les liens de l'index de la page d'accueil est cochée.
• Si la navigation s'affiche sous forme d'icône de menu en haut à gauche, décochez Toujours utiliser la navigation par superposition.
• Vérifiez que la couleur du lien nʼest pas transparente.

Les sections de l’index de galerie ne créent pas de liens dans la navigation. Ajoutez une section de contenu juste au-dessus de la section de l’index de galerie pour la présenter, ou ajoutez des liens d’ancrage d’index.

Menu de navigation qui s'affiche derrière le titre du site

Cela peut se produire lorsque vous décochez pour la première fois Développer les liens de l'index de la page d'accueil dans les styles de site. Enregistrez les modifications et actualisez la page. La navigation apparaîtra sous le titre de votre site.

Titre du site redimensionné après le chargement

Cela se produit lorsque le titre du site est trop grand pour le conteneur qui lui est imparti. Pour résoudre ce problème :

• Cliquez sur la police du titre du site dans la section En-tête du site du panneau Styles du site et assurez-vous que la taille de la police est inférieure ou égale à 72 pixels.
• Utilisez lʼajustement Largeur du conteneur du titre du site pour modifier la taille du conteneur en fonction du titre du site.

Pour un design optimal, limitez la taille du titre de votre site à 72 pixels ou moins. Tout titre dépassant cette limite va causer une distorsion dans le titre du site, peu importe la largeur de son conteneur.