Jump to content

Módulo o sistema para colocar progress bar en productos


Recommended Posts

Hola! Lo que estoy buscando me tiene bastante desesperado, ya que no encuentro ningún módulo ni la forma de hacerlo, y toda mi competencia lo tiene (algunos usan wordpress u otros sistemas de tienda online, pero no prestashop).

Tengo una web de colchones, y me gustaría añadir a cada producto una barra de progreso en la que el cliente pueda ver fácilmente el nivel de dureza de los colchones, como en el ejemplo que pongo más abajo. Yo con poner solo la barra de *firmeza ya me daría con un canto en los dientes.

¿Existe alguna forma de hacerlo?

Mil gracias por adelantado

 

barra progreso.jpg

Link to comment
Share on other sites

existe un modulo que añade iconos a las caracterisiticas de los productos, uno por cada valor, en vez de usar una barra, puedes usar un circulo o quesito con el %

 https://www.prestashop.com/forums/topic/591859-free-module-feature-value-with-image/ 

https://github.com/openagence/oa_features

 

De esa manera añadira la imagen del % en las caracteristicas

Link to comment
Share on other sites

La mejor solución es la que te indica el compañero de mas arriba, un modulo personalizado que sobreescriba la classe Features y añada un registro nuevo en la base de datos para que aplique un valor de porcentaje.

Si solo lo necesitas para una característica en concreto puedes hacer un apaño, así por ejemplo

en el archivo

themes/classic/templates/catalog/_partials/product-details.tpl

Busca esta parte

  {block name='product_features'}
.......
...
...
  {/block}

y sustituyes todo el contenido por este codigo

  {block name='product_features'}
    {if $product.grouped_features}
      <section class="product-features">
        <p class="h6">{l s='Data sheet' d='Shop.Theme.Catalog'}</p>
        <dl class="data-sheet">
          {foreach from=$product.grouped_features item=feature}
           {if $feature.id_feature == 6}
            <div class="name_new">
             <span style="margin-right:20px">
            {$feature.name}</span>
            <progress value="{if $feature.value == 'Media'}25{elseif $feature.value == 'Intermedia'}55{else}90{/if}" max="100"></progress>
            <span style="margin-left:20px">{$feature.value|escape:'htmlall'|nl2br nofilter}</span></div> 
              {else}
              <dt class="name">{$feature.name}</dt>
            <dd class="value">{$feature.value|escape:'htmlall'|nl2br nofilter}</dd>
            {/if}
          {/foreach}
        </dl>
      </section>
    {/if}
  {/block}
 

 

El id_feature  6 que aparece en rojo seria el id de la característica en la que quieres que aparezca el indicador, puedes mirarlo desde el backoffice , en

Catalogo /Attributes & Features/Features

Luego en rojo también aparecen los valores de esa característica indicada, en este caso y a modo de ejemplo al valor Media le corresponde un valor numérico 25, a Intermedia un valor de 55 y al que queda Intermedia-alta le correspondería un valor de 90. Estos valores numéricos o de porcentaje de cada valor de característica serán los que definan la barra de progreso. 

El resultado seria el de la imagen adjunta

 

Features • My Store 2018-08-08 14-49-52.png

Hummingbird notebook 2018-08-08 14-57-14.png

  • Like 1
Link to comment
Share on other sites

  • 3 weeks later...
En 8/8/2018 a las 3:06 PM, ventura dijo:

La mejor solución es la que te indica el compañero de mas arriba, un modulo personalizado que sobreescriba la classe Features y añada un registro nuevo en la base de datos para que aplique un valor de porcentaje.

Si solo lo necesitas para una característica en concreto puedes hacer un apaño, así por ejemplo

en el archivo


themes/classic/templates/catalog/_partials/product-details.tpl

Busca esta parte


  {block name='product_features'}
.......
...
...
  {/block}

y sustituyes todo el contenido por este codigo

  {block name='product_features'}
    {if $product.grouped_features}
      <section class="product-features">
        <p class="h6">{l s='Data sheet' d='Shop.Theme.Catalog'}</p>
        <dl class="data-sheet">
          {foreach from=$product.grouped_features item=feature}
           {if $feature.id_feature == 6}
            <div class="name_new">
             <span style="margin-right:20px">
            {$feature.name}</span>
            <progress value="{if $feature.value == 'Media'}25{elseif $feature.value == 'Intermedia'}55{else}90{/if}" max="100"></progress>
            <span style="margin-left:20px">{$feature.value|escape:'htmlall'|nl2br nofilter}</span></div> 
              {else}
              <dt class="name">{$feature.name}</dt>
            <dd class="value">{$feature.value|escape:'htmlall'|nl2br nofilter}</dd>
            {/if}
          {/foreach}
        </dl>
      </section>
    {/if}
  {/block}
 

 

El id_feature  6 que aparece en rojo seria el id de la característica en la que quieres que aparezca el indicador, puedes mirarlo desde el backoffice , en


Catalogo /Attributes & Features/Features

Luego en rojo también aparecen los valores de esa característica indicada, en este caso y a modo de ejemplo al valor Media le corresponde un valor numérico 25, a Intermedia un valor de 55 y al que queda Intermedia-alta le correspondería un valor de 90. Estos valores numéricos o de porcentaje de cada valor de característica serán los que definan la barra de progreso. 

El resultado seria el de la imagen adjunta

 

Features • My Store 2018-08-08 14-49-52.png

Hummingbird notebook 2018-08-08 14-57-14.png

Muy buenas, compañero, lo primero de todo disculparme por no haber contestado antes. Ahora que estoy de vuelta quería agradecerte mucho tu ayuda, eres un auténtico crack, esto es exactamente lo que buscaba.

 

¿Crees que podría colocarlo justo encima o debajo del texto de resumen de producto como en la imagen adjunta? Yo lo que he hecho es colocar una imagen en cada producto, y tengo varias hechas, según la firmeza del colchón. 

 

Ya es mala suerte que no haya ningún módulo que haga esto :/ me piden una riñonada por hacerme uno, cuando en realidad ya podría haber uno como en wordpress, que además es gratuito :( aixxxx

Link to comment
Share on other sites

No te preocupes compañero. Todos contestamos cuando podemos

En principio la colocación es lo de menos puedes mover el bloque de codigo a la posicion donde mas te convenga, ya depende de la plantilla que estes utilizando y/o si tienes algun modulo instalado en ese bloque. Puedes ayudarte de las herramientas de desarrollador de Chrome por ejemplo para buscar la ubicacion. También es una opción la de la imagen o puedes utlizar el codigo que te dije y ponerlo  utilizando etiquetas process, asi por ejemplo en la descripción del producto

Efectivamente, la mejor opción seria un modulo personalizado incluido en las caracteristicas del producto y que permitiera añadir valores o que los calculará directamente según el calor de la caracteristica.

 

Saludos

  • Like 1
Link to comment
Share on other sites

hace 57 minutos, gusman126 dijo:

Una pregunta seria de una caracteristica o de varias?

Lo digo porque estoy desarrollando para un cliente algo parecido y por ahora solo lo quiere de una característica. 

Lo mas seguro es que lo ponga en mi pagina para vender.

image.png.046be12b1be1b678ec2a285b7faaaf1e.png

image.thumb.png.f0ea5d514789cbcf6c6e02d0e9936120.png

 

Muy buenas tardes!

 

En principio con la característica de firmeza ya estaría bien, pero si pudiese añadir una más, llamada "adaptabilidad" sería más que ideal.

 

Estaré pendiente de novedades, estaría interesado en el tema

 

Gracias a todos, 

 

Saludos

Link to comment
Share on other sites

Finalmente ya esta desarrollado, con algunas opciones extra

https://www.prestashop.com/forums/topic/896615-module-progress-bar-using-feature-or-adding-bars-by-product/

Ademas de usar una caracteristica, se pueden añadir todas las barras que se quieran por cada producto.

Y con un pequeño cambio, se podria mostrar el Stock 

Edited by gusman126 (see edit history)
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...