Étiquette : attribut

[Magento 2] Pour créer un attribut produit custom depuis l’interface d’administration

08/01/2021 / admin

Pour afficher votre nouvel attribut dans un PHTML

<?php
$bestOffer = $_product->getData('best_offer');
$newOffer = $_product->getData('new_offer');
?>

<?php

$bestOffer = $_product->getData('best_offer');

$newOffer = $_product->getData('new_offer');

<?php if ($bestOffer && !$newOffer) :?>
    <div class="featured-ribbon"><?php echo __('best offer') ?></div>
<?php endif; ?>

<?php if (($bestOffer && $newOffer) || (!$bestOffer && $newOffer)) :?>
    <div class="featured-ribbon"><?php echo __('new offer') ?></div>
<?php endif; ?>

<?php if ($bestOffer && !$newOffer) :?>

<?php endif; ?>

<?php if (($bestOffer && $newOffer) || (!$bestOffer && $newOffer)) :?>

<?php endif; ?>

Création d’un nouvel attribut:

* BOUTIQUES > Attributs > Produit
* Bouton orange « Ajouter un attribut » (au-dessus du tableau, tout à droite)
* Section « Propriétés de l’attribut »:
* Champ « Libellé par défaut »: mettre « new offer »
* Champ « Type d’entrée catalogue pour le propriétaire de la boutique »: mettre « Yes/No »
* Champ « Valeurs requises »: mettre « Non »
* Bouton orange « Enregistrer l’attribut » (en-haut à droite)

Après enregistrement du nouvel attribut, nous sommes redirigés sur la page qui liste l’ensemble des attributs disponibles.

* Pour retrouver notre nouvel attribut, dans la colonne « Libellé par défaut », renseigner le champ placé immédiatement sous l’en-tête avec le mot-clé « new » et taper la touche Entrée. Le nouvel attribut (« new offer ») est, normalement, dans le résultat du filtrage que nous venos d’effectuer.
* Pour l’éditer, cliquer sur la ligne correspondant à l’attribut « new offer »
* Bloc « INFORMATIONS ATTRIBUTS » en colonne de gauche > cliquer sur « Propriétés du front office »
* Section « Propriétés du front office » (colonne principale):
* Champ « Utiliser dans les listes produits »: mettre « Oui »
* Bouton orange « Enregistrer l’attribut » (en-haut à droite)

Après édition du nouvel attribut, il faut l’ajouter au jeu d’attributs des produits de type « Abonnement ».

* BOUTIQUES > Attributs > Jeu d’attributs
* Dans la liste, cliquer sur « Abonnements »
* Dans la colonne du milieu « Groupes », scroller vers la bas jusqu’à apparition du dossier « Attributes »
* Puis effectuer un glisser-déposer de l’attribut non assigné « new_offer » (colonne de droite « Attributs non assignés ») vers le groupe d’attributs « Attributes » (colonne du milieu « Groupes »)
* ATTENTION: l’attribut « new_offer » doit bien se trouver listé parmi les attributs du dossier « Attributes ». Pour ne pas se tromper, on peut le glisser sous l’attribut existant « best_offer »
* Bouton orange « Enregistrer » (en-haut à droite)

Assignation de l’attribut à un produit:

* CATALOGUE > Produits
* Choisir un produit Abonnement à éditer (colonne « Action », cliquer sur « Modifier »)
* Scroller jusqu’au volet « Attributs » et cliquer dessus pour l’ouvrir
* Passer le champ « new offer » à « Oui »
* Bouton orange « Enregistrer » (en-haut à droite)
* Ne pas oublier de vider les caches

[Magento 2] Des images au survol hover dans la liste produit en ajoutant un attribut custom

25/05/2020 / admin

Testé fonctionnel Magento 2.3, 2.4!

Attention: j’ai trouvé plusieurs tutos sur le net qui m’ont mis sur la bonne voie, mais seul celui-ci comporte l’ensemble des éléments qui permettra de mettre en place la fonctionnalité voulue: How to change product image on hover?.

En backoffice:

Créer un attribut custom hover_image

boutiques > attributs > produit

ajouter un attribut

propriétés de l’attribut:

libellé par défaut: « hover_image »

type d’entrée…: « image »

Propriétés avancée des attributs:

code: « hover_image »

ajouter aux option de colonne: « non »

utiliser dans les options de filtrage: « non »

Propriétés du front office: (se référer au paragraphe ATTENTION juste en-dessous)

Visible sur les pages du catalogue de la boutique: oui

Utiliser dans les listes de produits: oui

bouton enregistrer l’attribut

ATTENTION

Là, vous vous dites probablement: « Mais où qu’il est ce menu Propriétés du front office??? ». Il y a un bug dans le BO de Magento 2 qui applique un display: none; sur cette entrée de menu, mais elle est bien présente!!! Supprimer le display: none; avec l’inspecteur d’éléments pour pouvoir accéder à ce menu.

Sinon, vous pouvez également suivre la méthode suivante et appliquer directement la modification en base de données:

Now we have to use this attribute in the listing page. So we have to make used_in_product_listing to 1. We can do that by using MySQL.

You need to take hover_image Attribute_ID from admin. You can go to your hover_image attribute page in admin and get its ID from URL.

Suppose that Attribute_ID is 99 in our case. Now, go to the database and select the catalog_eav_attribute table. Select the attribute with id 99 and change the value of the used_in_product_listing column to 1.

Or use below MySQL query :

UPDATE catalog_eav_attribute SET used_in_product_listing = ‘1’ WHERE attribute_id = 99;

1

UPDATE catalog_eav_attribute SET used_in_product_listing = ‘1’ WHERE attribute_id = 99;

Plaçons notre attribut custom hover_image dans le bon groupe d’attributs (images)

boutiques > attributs > jeu d’attributs

choisir le jeu d’attributs (« default » si il n’y a que celui là)

dans la colonne « groupes » glisser le nouvel attribut hover_image dans le dossier « images » (normalement, vous le trouverez tout en bas de l’arbre)

bouton enregistrer

Affectons une image hover à l’un de nos produits

catalogue > produits

éditer un produit

boutons ajouter un attribut

cocher hover_image

bouton ajouter la sélection

section Images et vidéos

accéder à la configuration de l’image que vous souhaitez voir apparaître au hover en cliquant sur la petite icône en forme de damier située en haut à gauche du visuel

Dans Role, sélectionner hover_image

cliquez sur la croix pour fermer

bouton enregistrer

Dans le code source:

app/design/frontend/VendorName/themename/etc/view.xml

<?xml version="1.0"?>  <view xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/view.xsd"> <media> <images module="Magento_Catalog"> <image id="category_page_grid_hover" type="hover_image"> <width>261</width> <height>206</height> </image> <image id="category_page_list_hover" type="hover_image"> <width>261</width> <height>206</height> </image> </images> </media> </view>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<?xml version="1.0"?>

<view xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/view.xsd">
    <media>
        <images module="Magento_Catalog">
            <image id="category_page_grid_hover" type="hover_image">
                <width>261</width>
                <height>206</height>
            </image>
            <image id="category_page_list_hover" type="hover_image">
                <width>261</width>
                <height>206</height>
            </image>
        </images>
    </media>
</view>

app/design/frontend/VendorName/themename/Magento_Catalog/templates/product/list.phtml

$_imageHelper = $this->helper('Magento\Catalog\Helper\Image'); $hoverimg = 'category_page_grid_hover'; $hoverimg = 'category_page_list_hover';

1
2
3

$_imageHelper = $this->helper('Magento\Catalog\Helper\Image');
$hoverimg = 'category_page_grid_hover';
$hoverimg = 'category_page_list_hover';

<?php // Product Image ?> <?php // Product Image Hovered $productHoverImage = $_imageHelper->init($_product, $hoverimg); $productHoverImageUrl = $productHoverImage->getUrl(); $placeholder = "placeholder"; ?> <a href="<?= $block->escapeUrl($_product->getProductUrl()) ?>" class="product photo product-item-photo" tabindex="-1" <?php if(strpos($productHoverImageUrl, $placeholder) !== false) : ?> data-has-hovered-state="false" <?php else : ?> data-has-hovered-state="true" <?php endif; ?> > <?= $productImage->toHtml() ?> <?php // Product Image Hovered ?> <?php if(strpos($productHoverImageUrl, $placeholder) !== false) : ?> <?php // "Placeholder" word Found in URL! -> no Image Hovered was set ?> <?php else : ?> <?php // "Placeholder" word Not Found in URL! -> show existing Image Hovered ?> <img class="product-image-photo" src="<?php echo $productHoverImageUrl; ?>" alt="<?php echo $productHoverImage->getLabel(); ?>" max-width="<?php echo $productImage->getWidth(); ?>" /> <?php endif; ?> </a>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

<?php // Product Image ?>
<?php
    // Product Image Hovered
    $productHoverImage = $_imageHelper->init($_product, $hoverimg);
    $productHoverImageUrl = $productHoverImage->getUrl();
    $placeholder = "placeholder";
?>
<a href="<?= $block->escapeUrl($_product->getProductUrl()) ?>"
   class="product photo product-item-photo"
   tabindex="-1"
    <?php if(strpos($productHoverImageUrl, $placeholder) !== false) : ?>
        data-has-hovered-state="false"
    <?php else : ?>
        data-has-hovered-state="true"
    <?php endif; ?>
>
    <?= $productImage->toHtml() ?>

    <?php // Product Image Hovered ?>
    <?php if(strpos($productHoverImageUrl, $placeholder) !== false) : ?>
        <?php // "Placeholder" word Found in URL! -> no Image Hovered was set ?>
    <?php else : ?>
        <?php // "Placeholder" word Not Found in URL! -> show existing Image Hovered ?>
        <img class="product-image-photo" src="<?php echo $productHoverImageUrl; ?>" alt="<?php echo $productHoverImage->getLabel(); ?>" max-width="<?php echo $productImage->getWidth(); ?>" />
    <?php endif; ?>
</a>

app/design/frontend/VendorName/themename/Magento_Catalog/web/css/source/_modules.less

// // Common // _____________________________________________ & when (@media-common = true) { // // Product images general container // --------------------------------------------- .product-image-photo { display: block; height: auto; margin: auto; max-width: 100%; + .product-image-photo { display: none !important; } } .product-item { &:hover { .product-item-photo[data-has-hovered-state="true"] { .product-image-photo { display: none !important; + .product-image-photo { display: block !important; } } } } } }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

//
//  Common
//  _____________________________________________

& when (@media-common = true) {

    //
    //  Product images general container
    //  ---------------------------------------------

    .product-image-photo {
        display: block;
        height: auto;
        margin: auto;
        max-width: 100%;
        + .product-image-photo {
            display: none !important;
        }
    }

    .product-item {
        &:hover {
            .product-item-photo[data-has-hovered-state="true"] {
                .product-image-photo {
                    display: none !important;
                    + .product-image-photo {
                        display: block !important;
                    }
                }
            }
        }
    }
}

En bash:

$ cache:clean

1

$ cache:clean

Une autre source (incomplète) m’ayant mis sur la voie: How to make a Product Listing with Hover images on Magento 2 et version PDF de l’article, pour la postérité.

[Magento 2] Récupérer la valeur d’un attribut produit dans une page category, product list, product

26/03/2020 / admin

Les codes des attributs sont visibles en backoffice en se rendant dans STORES > Product [Attributes].

Attention: de manière générale votre attribut ne sera pas visible en front si il n’est pas configuré comme tel en admin. STORES > Product [Attributes]. Editez l’attribut de votre choix. Dans la partie Storefront Properties, vous pouvez configurer la visibilité de votre attribut pour les pages du catalogue, son utilisation pour la recherche, la focntionnalité de comparaison, etc…

Pour un attribut de type text

// Pour un attribut donc le code name est "test_frank": // solution 1. <?php echo $_product->getData('test_frank'); ?> // solution 2. <?php echo $_product->getTestFrank(); ?>

1
2
3
4
5

// Pour un attribut donc le code name est "test_frank":
// solution 1.
<?php echo $_product->getData('test_frank'); ?>
// solution 2.
<?php echo $_product->getTestFrank(); ?>

// solution 3. <?php $customAttribute = $_product->getData('test_frank'); ?> <span><?= $customAttribute ?></span>

1
2
3
4
5

// solution 3.
<?php
$customAttribute = $_product->getData('test_frank');
?>
<span><?= $customAttribute ?></span>

Pour un attribut de type dropdown

<?= $_product->getAttributeText('test_frank'); ?>

1

<?= $_product->getAttributeText('test_frank'); ?>

En BO, mettre « Used in Product Listing » à « Yes » dans ATTRIBUTE INFORMATION > Storefront Properties.

[Magento 2] Récupérer le compte des produits possédant un attribut donné

14/02/2020 / admin

Attention: pas testé.

Source: Magento 2 product count by attribute.

protected $_productCollectionFactory; protected $attributFactory; protected $eavConfig; public function __construct( \Magento\Catalog\Model\ResourceModel\Product $productFactory, \Magento\Eav\Model\ResourceModel\Entity\Attribute\Option\CollectionFactory $attributFactory, \Magento\Eav\Model\Config $eavConfig ) { $this->eavConfig = $eavConfig; $this->attributFactory = $attributFactory; $this->_productCollectionFactory = $productFactory; } public function getProductCountByAttributeCode() { $attributeCode = ‘you_attribute_code’; $attribute = $this->eavConfig->getAttribute('catalog_product', $attributeCode); $attributFactory = $this->attributFactory->create()->setStoreFilter(0, false); $itemCollection = $this->_productCollectionFactory; $attributFactory->getSelect() ->joinLeft( array('value_table' => $itemCollection->getTable('catalog_product_entity_int')), 'main_table.option_id=value_table.value AND main_table.attribute_id=value_table.attribute_id', 'entity_id') ->reset(\Zend_Db_Select::COLUMNS) ->columns(array('main_table.option_id',new \Zend_Db_Expr('COUNT(value_table.entity_id)'))) ->where('main_table.attribute_id=:attribute_id') ->group('main_table.option_id'); $result = $itemCollection->getConnection()->fetchPairs( $attributFactory->getSelect(), array('attribute_id' => $attribute->getId())); return $result; }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

    protected $_productCollectionFactory;
    protected $attributFactory;
    protected $eavConfig;

    public function __construct(

        \Magento\Catalog\Model\ResourceModel\Product $productFactory,
        \Magento\Eav\Model\ResourceModel\Entity\Attribute\Option\CollectionFactory $attributFactory,
        \Magento\Eav\Model\Config $eavConfig


    ) {

        $this->eavConfig = $eavConfig;
        $this->attributFactory = $attributFactory;
        $this->_productCollectionFactory = $productFactory;

    }

    public function getProductCountByAttributeCode()
     {
        $attributeCode = ‘you_attribute_code’;
        $attribute = $this->eavConfig->getAttribute('catalog_product', $attributeCode);
        $attributFactory = $this->attributFactory->create()->setStoreFilter(0, false);
         $itemCollection = $this->_productCollectionFactory;
        $attributFactory->getSelect()
        ->joinLeft(
            array('value_table' => $itemCollection->getTable('catalog_product_entity_int')),
            'main_table.option_id=value_table.value AND main_table.attribute_id=value_table.attribute_id', 'entity_id')
        ->reset(\Zend_Db_Select::COLUMNS)
        ->columns(array('main_table.option_id',new \Zend_Db_Expr('COUNT(value_table.entity_id)')))
        ->where('main_table.attribute_id=:attribute_id')
        ->group('main_table.option_id');
        $result = $itemCollection->getConnection()->fetchPairs(
        $attributFactory->getSelect(), array('attribute_id' => $attribute->getId()));
        return $result;
    }

[jQuery] Agir uniquement sur des blocs contenant des boutons radio ou des cases à cocher possédant un attribut Name dont la valeur est identique

12/06/2015 / admin

A voir aussi : Si l’action à effectuer au clic est pilotée en Javascript par le biais d’un attribut onclick="" placé sur le booléen.

jQuery(document).ready(function(){ // http://devfrontend.info/jquery-agir-uniquement-sur-des-blocs-contenant-des-boutons-radio-ou-des-cases-a-cocher-possedant-un-attribut-name-dont-la-valeur-est-identique/ jQuery('.radio-boxes-group').on('click', '.radio-box', function(){ var nameAttributeValue = jQuery(this).closest('.radio-boxes-group').find('.is-checked').children('input:radio').attr('name'); jQuery(this).closest('.radio-boxes-group').find('.is-checked').toggleClass('is-checked'); jQuery(this).find('input:radio')[0].checked = true; if(jQuery(this).children('input:radio').attr('name') == nameAttributeValue ) { jQuery(this).toggleClass('is-checked'); } else { // do nothing ... } }); });

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

jQuery(document).ready(function(){
    // http://devfrontend.info/jquery-agir-uniquement-sur-des-blocs-contenant-des-boutons-radio-ou-des-cases-a-cocher-possedant-un-attribut-name-dont-la-valeur-est-identique/
    jQuery('.radio-boxes-group').on('click', '.radio-box', function(){
        var nameAttributeValue = jQuery(this).closest('.radio-boxes-group').find('.is-checked').children('input:radio').attr('name');

        jQuery(this).closest('.radio-boxes-group').find('.is-checked').toggleClass('is-checked');
        jQuery(this).find('input:radio')[0].checked = true;

        if(jQuery(this).children('input:radio').attr('name') == nameAttributeValue ) {
            jQuery(this).toggleClass('is-checked');
        } else {
            // do nothing ...
        }
    });
});

 <div class="radio-boxes-group"> <div class="row"> <div class="six columns payment-mode"> <div class="radio-box is-checked"> <input type="radio" id="monthly_payment" name="payment_mode" value="" checked="checked" /> <div class="information"> <label for="monthly_payment">Par mois</label> <p class="complementary-information">15€/mois</p> </div> </div> </div> <div class="six columns payment-mode"> <div class="radio-box"> <input type="radio" id="yearly_payment" name="payment_mode" value="" /> <div class="information"> <label for="yearly_payment">En une fois</label> <p class="complementary-information">180€ pour 1 an</p> </div> </div> </div> </div> </div>  <div class="radio-boxes-group"> <div class="row"> <div class="twelve columns payment-method"> <div class="radio-box is-checked"> <input type="radio" id="cb_method" name="payment_method" value="" checked="checked" /> <div class="information"> <label for="cb_method">Prélèvement CB</label> <p class="complementary-information">Confirmation d'achat et facture à l'étape suivante</p> </div> </div> </div> </div> <div class="row"> <div class="twelve columns payment-method"> <div class="radio-box"> <input type="radio" id="cheque_method" name="payment_method" value="" /> <div class="information"> <label for="cheque_method">Par chèque</label> </div> </div> </div> </div> <div class="row"> <div class="twelve columns payment-method"> <div class="radio-box"> <input type="radio" id="sepa_method" name="payment_method" value="" /> <div class="information"> <label for="sepa_method">Prélèvement SEPA (RIB)</label> </div> </div> </div> </div> </div>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58


<div class="radio-boxes-group">
    <div class="row">
        <div class="six columns payment-mode">
            <div class="radio-box is-checked">
                <input type="radio" id="monthly_payment" name="payment_mode" value="" checked="checked" />
                <div class="information">
                    <label for="monthly_payment">Par mois</label>
                    <p class="complementary-information">15€/mois</p>
                </div>
            </div>
        </div>
        <div class="six columns payment-mode">
            <div class="radio-box">
                <input type="radio" id="yearly_payment" name="payment_mode" value="" />
                <div class="information">
                    <label for="yearly_payment">En une fois</label>
                    <p class="complementary-information">180€ pour 1 an</p>
                </div>
            </div>
        </div>
    </div>
</div>


<div class="radio-boxes-group">
    <div class="row">
        <div class="twelve columns payment-method">
            <div class="radio-box is-checked">
                <input type="radio" id="cb_method" name="payment_method" value="" checked="checked" />
                <div class="information">
                    <label for="cb_method">Prélèvement CB</label>
                    <p class="complementary-information">Confirmation d'achat et facture à l'étape suivante</p>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="twelve columns payment-method">
            <div class="radio-box">
                <input type="radio" id="cheque_method" name="payment_method" value="" />
                <div class="information">
                    <label for="cheque_method">Par chèque</label>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="twelve columns payment-method">
            <div class="radio-box">
                <input type="radio" id="sepa_method" name="payment_method" value="" />
                <div class="information">
                    <label for="sepa_method">Prélèvement SEPA (RIB)</label>
                </div>
            </div>
        </div>
    </div>
</div>

Si l’action à effectuer au clic est pilotée en Javascript par le biais d’un attribut onclick="" placé sur le booléen

<div class="radio-box"> <input onclick="[...]" /> </div>

1
2
3

<div class="radio-box">
    <input onclick="[...]" />
</div>

Ajouter une ligne de code jQuery pour statuer qu’un clic utilisateur sur une zone .radio-box, compte pour un clic sur le champ radio ou checkbox dont il est le parent.

if(jQuery(this).children('input:radio').attr('name') == nameAttributeValue ) { jQuery(this).children('input').click(); // ajouter cette ligne dans le cas où un attribut 'onclick=""' est placé sur l'input. jQuery(this).toggleClass('is-checked'); } else { // do nothing ... }

1
2
3
4
5
6

if(jQuery(this).children('input:radio').attr('name') == nameAttributeValue ) {
    jQuery(this).children('input').click(); // ajouter cette ligne dans le cas où un attribut 'onclick=""' est placé sur l'input.
    jQuery(this).toggleClass('is-checked');
} else {
    // do nothing ...
}

Articles récents

Catégories

Archives

Méta

Étiquette : attribut

[Magento 2] Pour créer un attribut produit custom depuis l’interface d’administration

Pour afficher votre nouvel attribut dans un PHTML

Création d’un nouvel attribut:

Après enregistrement du nouvel attribut, nous sommes redirigés sur la page qui liste l’ensemble des attributs disponibles.

Après édition du nouvel attribut, il faut l’ajouter au jeu d’attributs des produits de type « Abonnement ».

Assignation de l’attribut à un produit:

[Magento 2] Des images au survol hover dans la liste produit en ajoutant un attribut custom

En backoffice:

Créer un attribut custom `hover_image`

ATTENTION

Plaçons notre attribut custom `hover_image` dans le bon groupe d’attributs (images)

Affectons une image hover à l’un de nos produits

Dans le code source:

app/design/frontend/VendorName/themename/etc/view.xml

app/design/frontend/VendorName/themename/Magento_Catalog/templates/product/list.phtml

app/design/frontend/VendorName/themename/Magento_Catalog/web/css/source/_modules.less

En bash:

[Magento 2] Récupérer la valeur d’un attribut produit dans une page category, product list, product

Pour un attribut de type `text`

Pour un attribut de type `dropdown`

[Magento 2] Récupérer le compte des produits possédant un attribut donné

[jQuery] Agir uniquement sur des blocs contenant des boutons radio ou des cases à cocher possédant un attribut Name dont la valeur est identique

Si l’action à effectuer au clic est pilotée en Javascript par le biais d’un attribut `onclick=""` placé sur le booléen

Pour afficher votre nouvel attribut dans un PHTML

Création d’un nouvel attribut:

Après enregistrement du nouvel attribut, nous sommes redirigés sur la page qui liste l’ensemble des attributs disponibles.

Après édition du nouvel attribut, il faut l’ajouter au jeu d’attributs des produits de type « Abonnement ».

Assignation de l’attribut à un produit:

En backoffice:

Créer un attribut custom hover_image

ATTENTION

Plaçons notre attribut custom hover_image dans le bon groupe d’attributs (images)

Affectons une image hover à l’un de nos produits

Dans le code source:

app/design/frontend/VendorName/themename/etc/view.xml

app/design/frontend/VendorName/themename/Magento_Catalog/templates/product/list.phtml

app/design/frontend/VendorName/themename/Magento_Catalog/web/css/source/_modules.less

En bash:

Pour un attribut de type text

Pour un attribut de type dropdown

Si l’action à effectuer au clic est pilotée en Javascript par le biais d’un attribut onclick="" placé sur le booléen

Créer un attribut custom `hover_image`

Plaçons notre attribut custom `hover_image` dans le bon groupe d’attributs (images)

Pour un attribut de type `text`

Pour un attribut de type `dropdown`

Si l’action à effectuer au clic est pilotée en Javascript par le biais d’un attribut `onclick=""` placé sur le booléen