Mises à jour de la disposition
Avant de commencer à travailler avec des mises à jour de disposition personnalisées, il est important de comprendre comment les pages de votre boutique sont construites et la différence entre les termes mise en page et mise à jour de disposition. La mise en page fait référence à la composition visuelle et structurelle de la page. La mise à jour de la disposition fait référence à un ensemble spécifique d’instructions XML qui peuvent remplacer ou personnaliser la construction de la page.
La disposition XML de votre magasin de Commerce est une structure hiérarchique de conteneurs et de blocs. Certains éléments apparaissent sur chaque page, tandis que d’autres apparaissent uniquement sur des pages spécifiques. Pour en savoir plus sur la disposition, les conteneurs et les blocs, consultez la présentation des dispositions dans le guide de développement de Frontend.
L’outil Widget est un moyen facile d’ajouter un bloc de contenu existant à la disposition par défaut d’une page. Pour les mises à jour plus avancées, vous devez enregistrer le code de mise à jour de la mise en page XML sur le serveur, puis référencer le fichier en tant que mise à jour de mise en page personnalisée par l’administrateur. Pour une présentation du processus, voir Utiliser les mises à jour de disposition.
Dans le diagramme suivant, les noms qui font référence aux conteneurs sont noirs et les types de blocs, ou chemins de classe de bloc, sont bleus.
page/html
root
et il s’agit de l’un des rares blocs racine de la disposition. Vous pouvez également créer votre propre bloc et le nommer root
, qui est le nom standard des blocs de ce type. Il ne peut y avoir qu’un seul bloc de ce type par page.page/html_head
head
et il est l’enfant du bloc racine. Chaque page ne peut contenir qu’un seul bloc de ce type, qui ne doit pas être supprimé.page/html_notices
global_notices
et il est l’enfant du bloc racine. Si ce bloc est supprimé de la disposition, les avis globaux n’apparaissent pas sur la page. Il ne peut y avoir qu’un seul bloc de ce type par page.page/html_header
header
et il est l’enfant du bloc racine. Ce bloc correspond à l’en-tête visuel en haut de la page et contient plusieurs blocs standard. Chaque page ne peut contenir qu’un seul bloc de ce type, qui ne doit pas être supprimé.page/html_wrapper
page/html_breadcrumbs
breadcrumbs
et il est un enfant du bloc d’en-tête . Ce bloc affiche le chemin de navigation de la page active. Il ne peut y avoir qu’un seul bloc de ce type par page.page/html_footer
footer
et il est l’enfant du bloc racine. Le bloc de pied de page correspond au pied de page visuel en bas de la page et contient plusieurs blocs standard. Chaque page ne peut contenir qu’un seul bloc de ce type, qui ne doit pas être supprimé.page/template_links
top.links
est un enfant du bloc d’en-tête et correspond au menu de navigation supérieur. Le bloc footer_links
est un enfant du bloc de pied de page et correspond au menu de navigation du bas.Remarque : il est possible de manipuler les liens du modèle, comme le montrent les exemples.
page/switch
store_language
est un enfant du bloc d’en-tête et correspond au sélecteur de langue supérieur. Le bloc store_switcher
est un enfant du bloc de pied de page et correspond au sélecteur de magasin inférieur.global_messages
affiche des messages globaux. Le bloc messages
est utilisé pour afficher tous les autres messages. Si vous supprimez ces blocs, le client ne verra aucun message.core/text_list
core/profiler
Placer un bloc à l’aide des mises à jour de la disposition
Les mises à jour de la disposition permettent de personnaliser la disposition d’une page. Les mises à jour de la disposition offrent plus de flexibilité qu’un widget, mais nécessitent un accès au serveur et des connaissances de base en XML.
Les étapes suivantes indiquent comment utiliser une mise à jour de mise en page pour placer un bloc sur une page. Pour obtenir des exemples spécifiques et de l’aide sur la syntaxe, voir Tâches courantes de personnalisation de la disposition dans le Guide de développement de Frontend.
Étape 1 : créer le bloc
-
Créez le bloc que vous souhaitez placer.
-
Prenez note de la
block_id
, car elle est utilisée dans les instructions de mise à jour de la mise en page.
Étape 2 : Composer la mise à jour de la mise en page en XML
-
Composez les instructions de mise en page en XML pour référencer un bloc CMS.
-
Enregistrez les instructions de mise en page sur le serveur, dans le dossier de mise en page où les fichiers XML sont enregistrés pour le thème.
Par exemple :
<theme_dir>/<Namespace>_<Module>/layout
L’identificateur de mise en page est le nom de fichier qui commence par
cms_page_view_selectable_
, suivi de la clé URL de la page CMS, de l’option de mise à jour de la mise en page et du suffixe du fichierxml
. Dans l’exemple suivant,customer-service
est la clé URL de la page etChatTool
est l’option que vous sélectionnez pour appliquer la mise à jour de la disposition à la page.cms_page_view_selectable_
<customer-service
>_
<ChatTool
>.xml
table 0-row-2 1-row-2 2-row-2 layout-auto Élément Description Identifiant de page CMS Clé URL de la page avec une barre oblique ( /
) remplacée par un trait de soulignement (_
).Nom de mise à jour de la disposition L’option qui s’affiche pour Mise à jour de la disposition personnalisée.
Étape 3 : référencer la mise à jour de la disposition à partir de la page
-
Dans la barre latérale Admin, accédez à Content > Elements>Pages.
-
Recherchez la page sur laquelle vous souhaitez placer le bloc et ouvrez-la en mode d’édition.
-
Faites défiler vers le bas et développez
-
Pour afficher toutes les mises à jour de disposition disponibles associées à la page, cliquez sur le menu Custom Layout Update.
-
Sélectionnez la mise à jour de disposition à appliquer à la page.
Étape 4 : enregistrer et actualiser le cache
-
Cliquez ensuite sur Save & Close.
-
Dans le message situé en haut de l’espace de travail, cliquez sur Cache Management et actualisez tous les éléments de cache non valides.