Jump to content

PS 1.7 resaltar etiqueta ruptura de stock


Eutanasio

Recommended Posts

Buenas,

Dónde encuentro el tpl para poder añadir un color de fondo a la etiqueta que muestra en la página de producto que dicho producto está en ruptura de stock con pedidos autorizados? véase "form_stock_oos_allowed_backorders_2". Quisiera ponerle un color de fondo para resaltar bien el hecho de que no está en stock, muchos clientes lo pasan por alto y luego nos causa problemas.

Gracias

Link to comment
Share on other sites

  • 3 weeks later...

Hola.

Si solo quieres cambiar el color o que tenga un color de fondo no tienes que tocar ningún tpl. Hazlo con en los css. La ruta para llegar seria, con el tema por defecto, en Prestashop 1.7: /theme/classic/assets/css/theme.css

Si es otro tema en /classic/ elige el tuyo.

Por ejemplo, en “classic” tienes el icono de “prohibido”:

#product-availability .product-last-items, #product-availability .product-unavailable

{

Color: #ff9a52;

}

Que es naranja. Puedes cambiarlo al color que quieras.

Con las letras el color igual: “Fuera de stock”

En:

.product-information

{

..

Color:#....;

}

Para la caja, esto lo hago demasiado simple, se puede mejorar. Añades en:

#product-availability

{

Font-size: 30px; (se verá grande, tienes que hacer que quede bien. Elige el tamaño)

Backgroud: #(color que quieras);

}

Puedes cambiar el color que veas más llamativo.

Lo que necesites utilizando css para llamar la atención.

Que tengas un buen día. Saludos y muchas gracias.

1.png

Link to comment
Share on other sites

Muchas gracias por la respuesta! he intentado modificar el CSS pero no se aplica lo q hago. Tengo el tema por defecto, fuerzo compilación, desactivo cache y uso navegación anónima, pero nada. Esta es la sección del CSS que he encontrado para esto e imagino que cada #Product-availability es según el stock:

#product-availability{margin-top:.625rem;display:inline-block;font-weight:700;}
#product-availability .material-icons{line-height:inherit}
#product-availability .product-available{color:#4cbb6c}
#product-availability .product-last-items,
#product-availability .product-unavailable{color:#ff9a52}

De todas formas creo que tal y como funciona actualmente el sistema de gestión de stock de Prestashop, por mucho que haga lo del background no me funcionaría bien ya que para Prestashop:

- Product-available: es igual a producto disponible a la venta (independientemente del nivel de stock, positivo o negativo)
- Product-last-items: producto en stock, disponible a la venta y últimas unidades (según lo que se haya establecido en el admin como cantidad para alertar de últimas unidades)
- Produc-unavailable: Producto no disponible a la venta (independientemente del nivel de stock positivo o negativo)

En mi caso lo que quiero es que cuando el stock sea 0 o negativo (por lo tanto no hay stock) se muestre texto "out of stock" con background de un color.

Link to comment
Share on other sites

  • 3 weeks later...

Hola.

Perdón, por tardar tanto en contestar. Para ver los cambios, debes vaciar la cache de tu navegador: ctrl+F5, o puede que necesites, tambien, vaciar la cache de Prestashop. Es entonces cuando podrás ver los cambios. Acuérdate de poner los permisos de los archivos que vayas a modificar en “777” y después de comprobar los cambios ponerlos en los que tengas en el directorio. La navegación privada, forzar compilación, no van a hacer que puedas ver los cambios. El desactivar la cache, hará que veas los cambios inmediatamente, si borras la cache del navegador. La cache de tu Prestashop es lo que puede que haya podido hacer que no hayas visto los cambios. Pruébalo; tiene que funcionar.

 

Link to comment
Share on other sites

Entiendo entonces que lo que necesitas es algo como esto... por ejemplo aquí: https://www.rock.ma/stock/8702-cordes-rockma-acoustique.html en el caso de que no tuviera stock, que mostrase el texto más destacado, ¿algo como esto?

image.thumb.png.f83073973a9cdb64bec6b292ded34ff4.png

Me adelanto y te confirmo que para ello, debes tocar el theme.css de tu tema classic. Y dejar algo como esto...

#product-availability {
    margin-top: .625rem;
    display: inline-block;
    font-weight: 700;
    background-color: #ff00008a;
    padding: 10px;
    border: 1px solid red;
}

Una vez aplicado el cambio, debes vaciar la caché de Prestashop tal y como te ha indicado el compañero fbmj_lorca. Y también te recomiendo, que modifiques desde la configuración de tu BO el que no permita realizar pedidos cuando un producto esté con stock agotado.
Espero que te sea de utilidad la explicación.
Un saludo.

Link to comment
Share on other sites

2 hours ago, Luisejo said:

Entiendo entonces que lo que necesitas es algo como esto... por ejemplo aquí: https://www.rock.ma/stock/8702-cordes-rockma-acoustique.html en el caso de que no tuviera stock, que mostrase el texto más destacado, ¿algo como esto?

image.thumb.png.f83073973a9cdb64bec6b292ded34ff4.png

Me adelanto y te confirmo que para ello, debes tocar el theme.css de tu tema classic. Y dejar algo como esto...

#product-availability {
    margin-top: .625rem;
    display: inline-block;
    font-weight: 700;
    background-color: #ff00008a;
    padding: 10px;
    border: 1px solid red;
}

Una vez aplicado el cambio, debes vaciar la caché de Prestashop tal y como te ha indicado el compañero fbmj_lorca. Y también te recomiendo, que modifiques desde la configuración de tu BO el que no permita realizar pedidos cuando un producto esté con stock agotado.
Espero que te sea de utilidad la explicación.
Un saludo.

Gracias por la respuesta, es justo el resultado que busco, pero no he conseguido implementarlo (he forzado compilacción, desactivado cache, uso navegación anónima y fuerzo la re-carga en el navegador). La ruta que modifico es: themes / classic / assets / css / theme.css

También me gustaría cambiar la banda naranja de Promo , me gustaría que fuera del estilo de la que indica producto nuevo, ya que me tapa muchas imágenes la parte superior de los productos.

Gracias!

Link to comment
Share on other sites

La ruta que has modificado es correcta. Y tal y como lo has realizado, si has seguido las indicaciones comentadas, también lo es.

Yo mismo podría realizar el cambio si lo necesitas, pero tendría que pasar la tarea por la agencia, si estás interesado, me contactas por privado y hablamos.

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...