ecomyseoÚltimamente cuando visitamos una web con nuestro smartphone, vemos en muchas paginas el botón de añadir al carrito flotante, esto quiere decir que vemos el botón siempre visible, normalmente en la parte mas abajo de nuestra web.
Con estas instrucciones vamos a poder añadir el codigo necesario para tenerlo en nuestra pagina y de esta manera ayudaremos a los clientes a poder comprar sin tener que moverse por la pagina hacia arriba o abajo para buscar el botón.
Pasos donde XXXX -> nombre de la plantilla/theme usado
Siempre haced copias de seguridad, no me responsabilizo de problemas o errores al añadir este código a vuestra web
Versión Prestashop 1.6
Editar el fichero /themes/XXXXX/product.tpl
Buscad el código
<!-- quantity wanted -->
o el siguiente
{if !$PS_CATALOG_MODE}
Añadir el código siguiente antes del <div> que este por encima del anterior código
<!-- end fixed add smart -->
<div class="qt_cart_box clearfix visible-sm visible-xs" style="text-align: center;position: fixed;bottom: 40px;left: 0;right: 0;z-index: 1030;background-color: #fff;box-shadow: 0 -5px 15px -5px rgba(0,0,0,.23);padding-bottom: 2px;">
<h3>{$product->name|escape:'html':'UTF-8'}</h3>
{if !$PS_CATALOG_MODE}
<p id="quantity_wanted_p"{if (!$allow_oosp && $product->quantity <= 0) || !$product->available_for_order || $PS_CATALOG_MODE} style="display: none;"{/if}>
<span class="quantity_input_wrap clearfix">
<a href="#" data-field-qty="qty" class="product_quantity_down">-</a>
<input type="text" min="1" name="qty" id="quantity_wanted" class="text" value="{if isset($quantityBackup)}{$quantityBackup|intval}{else}{if $product->minimal_quantity > 1}{$product->minimal_quantity}{else}1{/if}{/if}" />
<a href="#" data-field-qty="qty" class="product_quantity_up">+</a>
</span>
</p>
{/if}
<div id="add_to_cart_wrap" class="{if (!$allow_oosp && $product->quantity <= 0) || !$product->available_for_order || (isset($restricted_country_mode) && $restricted_country_mode) || $PS_CATALOG_MODE} unvisible {/if}">
<p id="add_to_cart" class="buttons_bottom_block no-print">
<button type="submit" name="Submit" class="btn btn-default btn_primary exclusive">
<span>{if $content_only && (isset($product->customization_required) && $product->customization_required)}{l s='Customize'}{else}{l s='Add to cart'}{/if}</span>
</button>
</p>
</div>
</div>
<!-- end fixed add smart -->
Versión Prestashop 1.7
Subir el fichero product-add-to-cart-smart.tpl a /themes/xxxxx/templates/catalog/_partials
Editar el fichero /themes/xxxxxx/templates/catalog/product.tpl
Buscad :
{block name='product_add_to_cart'}
{include file='catalog/_partials/product-add-to-cart.tpl'}
{/block}
Y a continuación añadir, recordad que hay que subir el fichero anterior
{block name='product_additional_info'}
{include file='catalog/_partials/product-add-to-cart-smart.tpl'}
{/block}
De esta manera ya tenemos nuestro botón flotante solo para los smartphones.
Si el botón esta muy alto respecto al final de la pagina, cambiad el bottom: 40px por el respectivo numero mas acorde a vuestra web.
ecomyseo
