HTML Blocks – Documentation

Placez des blocs HTML réutilisables partout où votre thème PrestaShop expose un hook pris en charge, ou ajoutez des emplacements contrôlés par le module via le Template Manager. C’est utile pour les bannières, les messages de confiance, les notes produit, les onglets produit supplémentaires, les contenus de catégorie, les zones de footer et les intégrations, sans modifier les fichiers du thème à chaque changement de contenu.

Features

• Modèle de données réutilisable pour les blocs HTML. Le module définit des tables de blocs et d’emplacements, mais cette arborescence source n’inclut pas le ObjectModel src/HtmlBlock.php requis par le contrôleur d’administration des blocs. Le workflow documenté de création/modification dans le back-office dépend donc de la présence de cette classe manquante.
• Contenu multilingue. Le schéma stocke le titre et le contenu HTML par langue et par boutique.
• Éditeur HTML enrichi. Le formulaire de bloc est configuré pour utiliser le RTE du back-office PrestaShop et afficher le HTML enregistré.
• Placement natif par hook. Les blocs peuvent être affichés via des hooks d’affichage PrestaShop enregistrés comme displayHomeIntro, displayFooter, displayReassurance et displayShoppingCart.
• Onglets produit. Assignez un bloc à displayProductTabContent pour ajouter un nouvel onglet sur les pages produit ; dans le code source actuel, l’affichage du contenu d’onglet produit n’applique pas la vérification du consentement aux cookies.
• Template Manager. Analysez les templates de thème pris en charge et injectez {hook h='displayMprHtmlBlock'} pour les pages produit, catégorie, listing, fabricant, fournisseur, marques et CMS.
• Aperçu visuel des hooks. Le panneau de placement des blocs peut ouvrir le front-office de la boutique avec des repères de hooks afin que vous puissiez choisir un emplacement visuellement.
• Mises en page contained ou full-width. Chaque emplacement peut suivre le conteneur du thème ou s’étendre sur toute la largeur du viewport.
• Champ de consentement et vérification partielle au rendu. Les blocs disposent d’un champ cookie_category, et le module inclut une vérification du consentement pour les chemins de rendu qui reçoivent cette valeur. Cependant, les placements natifs enregistrés ne récupèrent pas cookie_category, et le contenu d’onglet produit ne le vérifie pas.
• Styles alignés sur le thème. Le module enregistre les tokens de style de thème MPR partagés pour les couleurs, le radius, la bordure, l’ombre et les transitions.
• Outils d’intégrité. Le module inclut une page Integrity pour vérifier et réparer les tables requises du module.

Configuration options

• Internal Name. Libellé de back-office utilisé dans la liste des blocs et le gestionnaire d’emplacements ; valeur par défaut : empty. Le formulaire est défini dans HTML Blocks -> Blocks, mais cette source ne contient pas le ObjectModel MPRHtmlBlocks\HtmlBlock requis par ce contrôleur.
• Title. Titre multilingue facultatif, enregistré séparément du contenu HTML ; valeur par défaut : empty. Lorsqu’il est renseigné, il peut être affiché au-dessus du bloc.
• Title Tag. Balise HTML utilisée pour le titre ; valeur par défaut : No title. Les choix disponibles dans le back-office sont No title, h2, h3, h4, h5, span et p ; si un titre existe et qu’aucune balise n’est enregistrée, la source l’affiche dans un div.
• Cookie Consent Required. Catégorie de consentement enregistrée sur le bloc ; valeur par défaut : None (always show). Les valeurs disponibles sont functional, analytics et marketing. Dans cette source, les placements natifs par hook ne récupèrent pas cette valeur pour l’affichage, et displayProductTabContent ne la vérifie pas.
• Content. Contenu HTML multilingue affiché dans le wrapper du bloc ; valeur par défaut : empty.
• CSS Class. Classe facultative ajoutée au wrapper externe du bloc ; valeur par défaut : empty. Le module conserve les lettres, les chiffres, les espaces, les underscores et les tirets.
• Active. Active ou désactive l’ensemble du bloc ; valeur par défaut : 1.
• Display Location. Hook où un placement de bloc enregistré est affiché ; valeur par défaut : displayMprHtmlBlock dans la table des placements, tandis que le formulaire de placement du back-office vous demande de choisir un emplacement.
• Layout. Contrôle la largeur du wrapper de placement ; valeur par défaut : contained. Les valeurs disponibles sont contained et full-width.
• Placement Active. Active ou désactive un emplacement sans désactiver tout le bloc ; valeur par défaut : 1.
• Sort Order. Contrôle l’ordre des blocs assignés au même hook ; valeur par défaut : 0, les nouveaux placements de hook étant ajoutés à la prochaine position disponible.
• Template Page Active. Active ou désactive le profil Template Manager pour un type de page ; valeur par défaut : 1.
• Background color. Token de style MPR partagé que ce module mappe en tant que bg ; valeur par défaut : valeur détectée dans la boutique, fallback #ffffff.
• Secondary background. Token de style MPR partagé que ce module mappe en tant que bg-secondary ; valeur par défaut : valeur détectée dans la boutique, fallback #f6f6f6.
• Border color. Token de style MPR partagé que ce module mappe en tant que border ; valeur par défaut : valeur détectée dans la boutique, fallback #dddddd.
• Text color. Token de style MPR partagé que ce module mappe en tant que text ; valeur par défaut : valeur détectée dans la boutique, fallback #232323.
• Muted text color. Token de style MPR partagé que ce module mappe en tant que text-muted ; valeur par défaut : valeur détectée dans la boutique, fallback #7a7a7a.
• Border radius. Token de style MPR partagé que ce module mappe en tant que radius ; valeur par défaut : valeur détectée dans la boutique, fallback 8px.
• Box shadow. Token de style MPR partagé que ce module mappe en tant que shadow ; valeur par défaut : valeur détectée dans la boutique, fallback 0 2px 8px rgba(0, 0, 0, 0.1).
• Transition. Token de style MPR partagé que ce module mappe en tant que transition ; valeur par défaut : valeur détectée dans la boutique, fallback .2s ease-out.
• Refresh shop styles. Redétecte les styles du thème après un changement de thème ou de paramètres du thème ; valeur par défaut : manual action.
• Clear custom styles. Supprime les surcharges de styles personnalisés enregistrées et revient aux styles détectés dans la boutique ; valeur par défaut : manual action.

Customization examples

Footer reassurance block content:

<div class="footer-trust">
  <strong>Secure payment</strong>
  <span>Pay by card, bank transfer, or any payment method enabled in your shop.</span>
</div>

Example block and placement values:

Internal Name: Footer - Trust Badges
Title:
Title Tag: No title
CSS Class: footer-trust-block
Cookie Consent Required: None (always show)
Display Location: displayFooter
Layout: contained
Active: 1

Homepage full-width banner:

Internal Name: Homepage - Seasonal Banner
Title: Summer Offers
Title Tag: h2
CSS Class: homepage-seasonal-banner
Cookie Consent Required: None (always show)
Display Location: displayHomeIntro
Layout: full-width
Active: 1

Product tab:

Internal Name: Product - Delivery Tab
Title: Delivery
Title Tag: No title
CSS Class: product-delivery-tab
Display Location: displayProductTabContent
Layout: contained
Active: 1

Le contenu d’onglet produit est rendu par hookDisplayProductTabContent() dans cette source, et ce chemin n’applique pas la vérification du consentement aux cookies.

Injection Template Manager ajoutée à un template de thème :

{* MPR_HTMLBLOCK_INJECT *}
{hook h='displayMprHtmlBlock'}
{* /MPR_HTMLBLOCK_INJECT *}

Appel manuel du hook si vous souhaitez ajouter vous-même le hook du module dans un template de thème :

{hook h='displayMprHtmlBlock'}

Format du cookie de consentement analysé par le module :

necessary:1|functional:0|analytics:0|marketing:1

Le helper de consentement traite la valeur 0 d’une catégorie comme un refus explicite. Toutefois, les placements natifs enregistrés ne transmettent actuellement pas cookie_category à cette vérification, et le contenu d’onglet produit ne l’exécute pas.

Classes wrapper utiles pour le CSS du thème :

.mpr-html-block-content img {
  max-width: 100%;
  height: auto;
}

.mpr-html-block-content table {
  width: 100%;
  border-collapse: collapse;
}

.footer-trust-block .mpr-html-block-content {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.homepage-seasonal-banner.mpr-html-block-full-width {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

Noms de hooks courants disponibles dans la liste déroulante des emplacements :

displayHomeIntro
displayHome
displayProductAdditionalInfo
displayAfterProductThumbs
displayFooterProduct
displayReassurance
displayProductTabContent
displayHeaderCategory
displayFooterCategory
displayWrapperTop
displayContentWrapperTop
displayContentWrapperBottom
displayWrapperBottom
displayLeftColumn
displayRightColumn
displayBanner
displayNav1
displayNav2
displayTop
displayNavFullWidth
displayFooterBefore
displayFooter
displayFooterAfter
displayShoppingCart
displayShoppingCartFooter
displayExpressCheckout
displayOrderConfirmation1
displayOrderConfirmation2
displayCustomerAccount

Installation

1. Dans votre back-office PrestaShop, allez dans Modules -> Module Manager.
2. Cliquez sur Upload a module.
3. Sélectionnez le fichier ZIP du module.
4. Installez le module.
5. Ouvrez HTML Blocks -> Blocks pour gérer les blocs si le ObjectModel MPRHtmlBlocks\HtmlBlock requis est disponible dans le package installé.
6. Ajoutez un ou plusieurs emplacements d’affichage pour le bloc.
7. Utilisez HTML Blocks -> Templates uniquement lorsque vous avez besoin de positions dans les templates du thème, et pas seulement des hooks existants.

How it works

Le module est conçu autour d’enregistrements de blocs avec contenu multilingue et d’enregistrements d’emplacements qui assignent ces blocs à des positions. Dans l’arborescence source actuelle, le contrôleur de création et de modification de ces enregistrements de blocs pointe vers MPRHtmlBlocks\HtmlBlock, mais Composer mappe cet espace de noms vers src/, et aucun fichier src/HtmlBlock.php n’est présent.

Sur le front-office, le module affiche les blocs actifs dans les hooks qui leur sont assignés, triés selon l’ordre de tri du placement. Le rendu natif par hook utilise HtmlBlockPlacement::getAllActiveGrouped(), qui sélectionne les données de placement, le titre, le contenu, title_tag et css_class, mais pas cookie_category.

Pour les placements de hook classiques, le bloc apparaît partout où votre thème affiche ce hook PrestaShop. Pour les placements de template, le Template Manager injecte le hook du module dans les templates de thème sélectionnés et suit le fichier injecté avec des marqueurs afin que vous puissiez vérifier son état après une mise à jour du thème.

Honest limits

Dans la source actuelle, le module n’inclut pas de champs de planification par date, de ciblage par groupe client ni de ciblage par ID de produit/catégorie. Utilisez les interrupteurs d’activation pour activer ou désactiver les blocs ou les emplacements.

L’arborescence source actuelle ne contient pas src/HtmlBlock.php, bien que le contrôleur d’administration et le code front-office du module référencent MPRHtmlBlocks\HtmlBlock. La création, la modification des blocs et une partie du rendu du Template Manager dépendent de la fourniture de ce ObjectModel manquant.

Le masquage basé sur le consentement n’est que partiel dans cette source. Les requêtes de placements natifs par hook ne récupèrent pas cookie_category, ces placements ne sont donc pas masqués par la vérification du consentement. Le contenu d’onglet produit est également rendu sans vérifier cookie_category.

Le placement via Template Manager dépend de la structure de votre thème. Après une mise à jour du thème, utilisez Check Status avant de considérer que les positions injectées dans les templates sont toujours présentes.

Le code de placement par sélecteur CSS existe dans cette arborescence source, mais le workflow marchand documenté repose sur le placement par hook ou le placement via Template Manager.

Frequently Asked Questions

Puis-je réutiliser le même bloc à plusieurs endroits ?
Oui, si l’enregistrement du bloc existe et si le ObjectModel MPRHtmlBlocks\HtmlBlock manquant est disponible. Ajoutez plusieurs emplacements d’affichage au même bloc.

Puis-je créer un onglet produit avec ce module ?
Oui. Assignez le bloc à displayProductTabContent. Dans la source actuelle, le contenu d’onglet produit n’est pas masqué par le champ de consentement aux cookies.

Puis-je masquer un bloc sans le supprimer ?
Oui. Désactivez le bloc, ou désactivez seulement un emplacement.

Puis-je ajouter ma propre classe CSS ?
Oui. Utilisez le champ CSS Class. La classe est ajoutée au wrapper du bloc.

Puis-je placer du contenu après les titres de produit ou de catégorie ?
Oui. Utilisez le Template Manager pour analyser le thème et injecter displayMprHtmlBlock pour les types de pages pris en charge.

Le module prend-il en charge l’affichage basé sur le consentement aux cookies ?
Seulement partiellement dans cette source. Le champ et le helper existent, mais les placements natifs enregistrés ne récupèrent pas cookie_category, et le contenu d’onglet produit ne le vérifie pas.

Puis-je planifier les blocs avec une date de début et de fin ?
Non. Le code source actuel du module n’inclut pas de champs de planification par date.

Compatibilité : PrestaShop 1.6 à 9.0 (latest), PHP 7.1+. Nous continuons à prendre en charge les prochaines versions de PrestaShop.