Jump to content

[Solucionado] Ocultar precios sin "perder" el carrito


CastelaoSL

Recommended Posts

Hola!!

Nos gustaría ocultar los precios para los visitantes y que aparezcan a los clientes registrados. Así lo hemos hecho:

image.png.54c8d59486b3944ff9fb185f1447dce3.png

 

Pero nos gustaría que siguiera apareciendo la opción de "añadir al carrito"... o en su defecto, un botón/enunciado que ponga "regístrate para visualizar el precio" (o algo así).

image.thumb.png.c7dcd14d88dd34fd9da4dcf96fb140b3.png

 

image.thumb.png.4689c4c05d4233579756e1a891acce89.png

 

Un saludo y gracias!!

 

Link to comment
Share on other sites

Que tal!

pon este código en el archivo product.tpl

{block name='product_price_and_shipping'}
        {if !$product.show_price}
               <div class="block-login-prod"><a class="link-login" href="tu link/url para iniciar sesión">Inicie sesión para ver precios y realizar su pedido</a></div>
        {/if}
       {/block} 

en la ruta --> themes/ecmart/templates/catalog/product.tpl

despues de el bloque:

          {block name='product_prices'}
            {include file='catalog/_partials/product-prices.tpl'}
          {/block}

En la línea 77 más o menos...

  • Like 1
Link to comment
Share on other sites

  • 3 weeks later...
On 6/16/2021 at 9:33 PM, AleAlejandro said:

Que tal!

pon este código en el archivo product.tpl

{block name='product_price_and_shipping'}
        {if !$product.show_price}
               <div class="block-login-prod"><a class="link-login" href="tu link/url para iniciar sesión">Inicie sesión para ver precios y realizar su pedido</a></div>
        {/if}
       {/block} 

en la ruta --> themes/ecmart/templates/catalog/product.tpl

despues de el bloque:

          {block name='product_prices'}
            {include file='catalog/_partials/product-prices.tpl'}
          {/block}

En la línea 77 más o menos...

Hola!!

Gracias por la respuesta!!

Funciona, pero ¿sería posible cambiar el color de fondo, como si fuera un botón? para que sea más visible, pues creo que así pasa muy desapercibido

000.thumb.jpg.728ab584b0631e16d5c10d680fe73d79.jpg

Link to comment
Share on other sites

15 minutes ago, CastelaoSL said:

Hola!!

Gracias por la respuesta!!

Funciona, pero ¿sería posible cambiar el color de fondo, como si fuera un botón? para que sea más visible, pues creo que así pasa muy desapercibido

000.thumb.jpg.728ab584b0631e16d5c10d680fe73d79.jpg

 

Buenas CastelaoSL,

por supuesto que puedes darle estilos al texto, lo único que necesitas hacer es ponerte CSS a tu archivo para darle el estilo que buscas.

Tienes 2 opciones:

1. Coger la clase del objeto que en este caso sería block-login-prodlink-login una vez tienes la clase te vas al archivo css del tema que tienes instalado y le pones las características que quieras, te dejo un ejemplo:
 

.block-login-prod {
  background-color: EL COLOR QUE QUIERAS;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

 

2. Coger y en el mismo lugar que te pone el código html (es decir en el propio .tpl) añadir un style al objeto, quedando así:

<div style="background-color: EL COLOR QUE QUIERAS; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer;" class="block-login-prod"><a class="link-login" href="tu link/url para iniciar sesión">Inicie sesión para ver precios y realizar su pedido</a></div>

 

La mejor opción es colocar esto dentro del CSS correspondiente del tema, es decir, la opción 1.

 

Un saludo y espero que te aclares con esto :)

  • Like 1
Link to comment
Share on other sites

6 minutes ago, david19942 said:

 

Buenas CastelaoSL,

por supuesto que puedes darle estilos al texto, lo único que necesitas hacer es ponerte CSS a tu archivo para darle el estilo que buscas.

Tienes 2 opciones:

1. Coger la clase del objeto que en este caso sería block-login-prodlink-login una vez tienes la clase te vas al archivo css del tema que tienes instalado y le pones las características que quieras, te dejo un ejemplo:
 

.block-login-prod {
  background-color: EL COLOR QUE QUIERAS;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

 

2. Coger y en el mismo lugar que te pone el código html (es decir en el propio .tpl) añadir un style al objeto, quedando así:

<div style="background-color: EL COLOR QUE QUIERAS; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer;" class="block-login-prod"><a class="link-login" href="tu link/url para iniciar sesión">Inicie sesión para ver precios y realizar su pedido</a></div>

 

La mejor opción es colocar esto dentro del CSS correspondiente del tema, es decir, la opción 1.

 

Un saludo y espero que te aclares con esto :)

Gracias por la respuesta tan rápida!

Necesito un poco más de información, pues no somos informáticos y en estas cosas de códigos, vamos perdidos.

Esta es la dirección correcta?? qué archivo hay que modificar y en qué líneas?

image.png.0e2db7be8b8803c4ebb66dc062e15341.png

 

 

Link to comment
Share on other sites

2 minutes ago, CastelaoSL said:

Gracias por la respuesta tan rápida!

Necesito un poco más de información, pues no somos informáticos y en estas cosas de códigos, vamos perdidos.

Esta es la dirección correcta?? qué archivo hay que modificar y en qué líneas?

image.png.0e2db7be8b8803c4ebb66dc062e15341.png

 

 

Tienes que editar el custom.css y las líneas donde quieras siempre que este el código después de una llave de cierre (})

Link to comment
Share on other sites

4 minutes ago, CastelaoSL said:

Genial!! Muchas gracias!!

image.thumb.png.8c2643dd14f306da571dbeb0b34d3c5b.png

 

¿Puedo abusar un poco de tus conocimientos, @david19942 ?

Nos gustaría, también, poner una línea como la siguiente:

image.png.aebea1bf9cacac0135560bba287d25b9.png

Tanto si se ha iniciado sesión, como si no.

Gracias, de nuevo!

Eso ya tiene más "chicha" jajaja, se puede hacer sin problemas y no es difícil pero claro eso ya depende del tema que tengas instalado porque ahí si que hay que tocar código en los tpl.

De normal para tocar/añadir cosas en esa posición hay que irse al .tpl de product pero como te digo cada tema tiene este archivo puesto en otro sitio o llamado de otra forma al original, sería cuestión de buscar.

Link to comment
Share on other sites

 

hace 2 horas, CastelaoSL dijo:

Genial!! Muchas gracias!!

image.thumb.png.8c2643dd14f306da571dbeb0b34d3c5b.png

 

¿Puedo abusar un poco de tus conocimientos, @david19942 ?

Nos gustaría, también, poner una línea como la siguiente:

image.png.aebea1bf9cacac0135560bba287d25b9.png

Tanto si se ha iniciado sesión, como si no.

Gracias, de nuevo!

Si deseas que la misma frase quede en todos los productos puedes agregar esa frase en la ruta:

themes/su_thema/templates/catalog/product.tpl

Donde pusiste lo primero

Link to comment
Share on other sites

21 hours ago, david19942 said:

 

Buenas CastelaoSL,

por supuesto que puedes darle estilos al texto, lo único que necesitas hacer es ponerte CSS a tu archivo para darle el estilo que buscas.

Tienes 2 opciones:

1. Coger la clase del objeto que en este caso sería block-login-prodlink-login una vez tienes la clase te vas al archivo css del tema que tienes instalado y le pones las características que quieras, te dejo un ejemplo:
 

.block-login-prod {
  background-color: EL COLOR QUE QUIERAS;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

 

2. Coger y en el mismo lugar que te pone el código html (es decir en el propio .tpl) añadir un style al objeto, quedando así:

<div style="background-color: EL COLOR QUE QUIERAS; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer;" class="block-login-prod"><a class="link-login" href="tu link/url para iniciar sesión">Inicie sesión para ver precios y realizar su pedido</a></div>

 

La mejor opción es colocar esto dentro del CSS correspondiente del tema, es decir, la opción 1.

 

Un saludo y espero que te aclares con esto :)

Hola! perdona que te molestemos otra vez con esto. Pero en la versión móvil no aparece el fondo verde:

image.thumb.png.ab9018fe0571d956e8332a66a264886d.png

Se puede poner de alguna manera?

Gracias!! 

 

Link to comment
Share on other sites

17 hours ago, AleAlejandro said:

 

Si deseas que la misma frase quede en todos los productos puedes agregar esa frase en la ruta:

themes/su_thema/templates/catalog/product.tpl

Donde pusiste lo primero

Hola! gracias por la respuesta.

¿me podrías decir cuál es la frase que hay que poner con sus corchetes y esas cosas?

Gracias!

Link to comment
Share on other sites

hace 5 horas, CastelaoSL dijo:

Hola! gracias por la respuesta.

¿me podrías decir cuál es la frase que hay que poner con sus corchetes y esas cosas?

Gracias!

{block name='product_adds'}   

     <div class="block-login-prod"> 

Aquí va lo que quiera que aparezca

     </div>

   {/block} 

 

 

  • Like 1
Link to comment
Share on other sites

18 hours ago, AleAlejandro said:

{block name='product_adds'}   

     <div class="block-login-prod"> 

Aquí va lo que quiera que aparezca

     </div>

   {/block} 

 

 

Genial! Muchas gracias! Funciona... pero sería mucho pedir que el color de fondo fueran diferentes?

image.thumb.png.8b5caac4f1083c0f2c2e36de6c6332a4.png

Link to comment
Share on other sites

11 minutes ago, CastelaoSL said:

Genial! Muchas gracias! Funciona... pero sería mucho pedir que el color de fondo fueran diferentes?

image.thumb.png.8b5caac4f1083c0f2c2e36de6c6332a4.png

 

Lo único que tienes que hacer es en el .tpl cambiarle el nombre a la clase, si te das cuenta tu clase para ese div se llama "block-login-prod", cámbiale este nombre y le colocas el que tu quieras, los espacios tienen que ir separados de guiones.

Una vez le hayas puesto el nombre de clase que tu quieras te vas al CSS y vuelves a copiar el código que te pase, es decir, este:

.NOMBRE-DE-LA-CLASE {
  background-color: EL COLOR QUE QUIERAS;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

Donde te he puesto nombre de la clase tendrás que indicarle el nuevo nombre que le has colocado en el tpl. El punto es necesario para referenciar a las clases.

 

Un saludo y espero que te sirva!

  • Like 1
Link to comment
Share on other sites

Para poner el tema como solucionado indícalo en el titulo del post!

 

Sube al titulo y mantén haciendo click un par de segundo encima y te dejara editarlo,  poner [Solucionado] delante del todo y le das a enter y listo!

 

Un saludo!

  • Like 1
Link to comment
Share on other sites

  • CastelaoSL changed the title to [Solucionado] Ocultar precios sin "perder" el carrito

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