Small "Add to cart" button on category

[ChristosDs]

Hi.

I'm using the code bellow on theme/catalog/_partials/miniatures/product.tpl file and some css to add an "Add to cart" button to classic theme but if I hide or remove the label the button doesn't work. When i click it, the popup opens but it doesn't add the product to cart basket.

    <div class="mini-add-to-cart">
      {if !$configuration.is_catalog}
            <form action="{$urls.pages.cart}" method="post" class="add-to-cart-or-refresh">
              <input type="hidden" name="token" value="{$static_token}">
              <input type="hidden" name="id_product" value="{$product.id}" class="product_page_product_id">
              <input type="hidden" name="qty" value="1">
              <button class="btn btn-primary add-to-cart" data-button-action="add-to-cart" type="submit" {if $product.quantity < 1 }disabled{/if}>
                <i aria-hidden="true" class="material-icons shopping-cart">shopping_cart</i>{l s='Add to cart' d='Shop.Theme.Actions'}
              </button>
            </form>
          {/if}
      </div>

The only solutions I have found is to use a html symbol instead of the material  icon and label but I would prefer to use the material icon.

<button class="btn btn-primary add-to-cart" data-button-action="add-to-cart" type="submit" {if $product.quantity < 1 }disabled{/if}>
✔
</button>

Any help would be much appreciated.

[Inform-All]

Please elaborate what you are trying to achieve.
You can't just add that code anywhere without the corresponding JS functionality that actually does the work.

 

If you are trying to add a "add to cart button" to the category try this forum post: 

 

[ChristosDs]

Hi.

The code above works as it is. My problem is that because I'm trying to move the "Add to cart" button bellow the Wishlist button and remove the label  {l s='Add to cart' d='Shop.Theme.Actions'} so to keep only the material icon when i do that the button it stops adding the product to basket. If I remove the material icon and the label together and add for example the ✔ icon

<div class="mini-add-to-cart">
      {if !$configuration.is_catalog}
            <form action="{$urls.pages.cart}" method="post" class="add-to-cart-or-refresh">
              <input type="hidden" name="token" value="{$static_token}">
              <input type="hidden" name="id_product" value="{$product.id}" class="product_page_product_id">
              <input type="hidden" name="qty" value="1">
              <button class="btn btn-primary add-to-cart" data-button-action="add-to-cart" type="submit" {if $product.quantity < 1 }disabled{/if}>
               <!--<i aria-hidden="true" class="material-icons shopping-cart">shopping_cart</i>{l s='Add to cart' d='Shop.Theme.Actions'}-->
                ✔
              </button>
            </form>
          {/if}
      </div>

the the code/button works. 

What I want to achieve is to keep using the material icon for the button.

[ChristosDs]

In case someone else are interested it was a problem with Prestahop 1.7.8.0. After upgrading to 1.7.8.1 the button with material icon only it's working fine.