Edit History

Hello Prestashop users,

I’m working on an e-shop for a french clothing brand and I’m strugguling with the same problem for a couple weeks. I’m using Prestashop 1.7.

What I’m trying to do is to display the available sizes on the items in the product miniatures while hovering it. Then, when the user click on the size he wants, the item is directly added to his basket, without having to go on the product page or on the quickview.

There’s an exemple of what I’m trying to do on this website : https://international.victoriabeckham.com/

What I’ve already done is creating a radio input for each size on the item on the file located in templates>catalog>_partials>miniatures>product.tpl. But these buttons are not connected to the stock and sizes available. I’ve also added a link on these buttons « data-button-action="add-to-cart" ». The link is actually working but it’s not connected to the item and the chosen size.

        <div class="product-variants">
          <div class="clearfix product-variants-item">
      <span class="control-label"></span>
              <li class="shortsize">
                      <button value="27" title="34"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">34</button>
                      <button value="28" title="36"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">36</button>
                      <button value="29" title="38"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">38</button>
                      <button value="30" title="40"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">40</button>
                      <button value="31" title="42"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">42</button>
                      <button value="32" title="44"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">44</button>
                      <button value="33" title="46"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">46</button>

                </li>
          </div>
      </div>

I’ve red this topic and tried the solution offered by Vekia but it doesn’t seem to work on Prestashop 1.7. https://www.prestashop.com/forums/topic/314731-available-product-sizes-on-product-listsolved/

The next thing I’ve tried is to download a free module that adds the « add to cart » link on product miniature : https://www.prestashop.com/forums/topic/661291-free-module-display-add-to-cart-button-in-product-list-pages/

But still not done with my issue..

That’s why I’m here, asking for advices, or any kind of help.

Thanks a lot for reading me, I hope I’ve been precise on my issue as much as I had to.

Hello Prestashop users,

I’m working on an e-shop for a french clothing brand and I’m strugguling with the same problem for a couple weeks. I’m using Prestashop 1.7.

What I’m trying to do is to display the available sizes on the items in the product miniatures while hovering it. Then, when the user click on the size he wants, the item is directly added to his basket, without having to go on the product page or on the quickview.

There’s an exemple of what I’m trying to do on this website : https://international.victoriabeckham.com/

What I’ve already done is creating a radio input for each size on the item on the file located in templates>catalog>_partials>miniatures>product.tpl. But these buttons are not connected to the stock and sizes available. I’ve also added a link on these buttons « data-button-action="add-to-cart" ». The link is actually working but it’s not connected to the item and the chosen size.

        <div class="product-variants">
          <div class="clearfix product-variants-item">
      <span class="control-label"></span>
              <li class="shortsize">
                      <button value="27" title="34"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">34</button>
                      <button value="28" title="36"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">36</button>
                      <button value="29" title="38"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">38</button>
                      <button value="30" title="40"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">40</button>
                      <button value="31" title="42"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">42</button>
                      <button value="32" title="44"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">44</button>
                      <button value="33" title="46"id="group_1" data-product-attribute="1" name="group[1]" data-button-action="add-to-cart" type="submit">46</button>

                </li>
          </div>
      </div>

I’ve red this topic and tried the solution offered by Vekia but it doesn’t seem to work on Prestashop 1.7. https://www.prestashop.com/forums/topic/314731-available-product-sizes-on-product-listsolved/

The next thing I’ve tried is to download a free module that adds the « add to cart » link on product miniature : https://www.prestashop.com/forums/topic/661291-free-module-display-add-to-cart-button-in-product-list-pages/

But still not done with my issue..

That’s why I’m here, asking for advices, or any kind of help.

Thanks a lot for reading me, I hope I’ve been precise on my issue as much as I had to.