Modificar pagina de producto prestashop  

 
Manuel
 Manuel
Usuario eminente

Hola a todos,
He adjuntado imágenes de mi sitio para referenciar lo que necesito, espero explicarme lo mejor posible.
En mi pagina de producto, como se puede apreciar en la imagen 1, tengo marcados con #1 y #2 los precios que necesito trabajar.
#1: Precio de lista de mi prestashop.
#2: Precio promocional de mi prestashop.
Necesito colocarlos como muestra la imagen "final.jpg" y además agergar un precio "#3", que siempre va a ser el precio #2 multiplicado por un porcentaje fijo (en caso de tener precio #2, sino será el precio #1 multiplicado por un porcentaje fijo).

¿Me podrían dar una mano? La agradeceré muchísimo.

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 19/08/2018 1:16 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Manuel.

No es tan fácil lo que comentas ya que tienes que modificar código de la pagina del producto y hay que ir con mucho cuidado de lo contrario se puede caer la web.

Lo primero añade lo siguiente a tu archivo de estilos CSS, no se si utilizas algún archivo custom para las modificaciones de css ya que carga en cache y no puedo ver los archivos de tu web.

.our_price_display {
    display: -webkit-box;
}

.- Edita el archivo Product.tpl que encontraras en themes -> warehouse -> product.tpl
.- sobre la linea 396 veras el siguiente codigo:

specificPrice || !$product->specificPrice.reduction)} class="hidden"{/if}>{strip} {if $priceDisplay >= 0 && $priceDisplay <= 2} {hook h="displayProductPriceBlock" product=$product type="old_price"} {if $productPriceWithoutReduction > $productPrice}{convertPrice price=$productPriceWithoutReduction|floatval}{/if}{if $tax_enabled && $display_tax_label == 1} {if $priceDisplay == 1}{l s='tax excl.'}{else}{l s='tax incl.'}{/if}{/if} {/if} {/strip}

.- Corta el código y lo añades después de este código que tiene que estar sobre la linea 380

							

Modifica la siguiente linea del código anterior:

{if $productPriceWithoutReduction > 

Por esta:

Antes: {if $productPriceWithoutReduction >

.- Busca el siguiente código que tiene que estar sobre la linea 386 ( puede variar ya que movimos el código anterior )

<span id="our_price_display" class="price" itemprop="price" 

Modifica el código por lo siguiente:

Ahora<span id="our_price_display" class="price" itemprop="price" 

Sobre la consulta del tercer precio es algo mas complicado ya que tienes que añadir variables, etc.. y no es lo mismo que mover código de posición, en eso me temo que no podemos ayudarte.

Nota: Antes de realizar las modificaciones descarga el archivo para tener una copia de seguridad pro si algo sale mal y tienes que volver a dejarlo como estaba.

Un saludo

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar Testimonio
¿Has probado WpCenter?, es nuestro nuevo manager de WordPress desde el propio cPanel sin necesidad de acceder a tu administración, te permitirá configurar actualizaciones automáticas y mucho más.
Pruébalo accediendo a tu cPanel > Aplicaciones Webempresa > WpCenter
¡Gracias!.

ResponderCitar
Respondido : 19/08/2018 11:31 am

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Manuel
 Manuel
Usuario eminente

Pepe, tu ayuda me ha sido de gran utilidad.
Necesito saber una cosa mas, cómo hago el salto de linea entre ambos precios? Utilizando la etiqueta
no lo logré. Por último, para agregar un espacio entre el precio final (color verde) y la etiqueta magenta de decuento como tendría que hacer?
Muchísimas gracias,
Saludos.

ResponderCitar
Respondido : 20/08/2018 7:38 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Manuel.

cómo hago el salto de linea entre ambos precios?
tienes que añadir el codigo de estilos que te indique en la anterior entrada:

.our_price_display {
    display: -webkit-box!important;
}

Si lo añadiste, modifica el código añadiendo la etiqueta important, como tienes en el código de arriba y prueba si se realiza el salto de los dos precios.

agregar un espacio entre el precio final (color verde) y la etiqueta magenta de decuento

Añade lo siguiente:

p#reduction_percent {
    margin-left:2em;
}

Un saludo

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar Testimonio
¿Has probado WpCenter?, es nuestro nuevo manager de WordPress desde el propio cPanel sin necesidad de acceder a tu administración, te permitirá configurar actualizaciones automáticas y mucho más.
Pruébalo accediendo a tu cPanel > Aplicaciones Webempresa > WpCenter
¡Gracias!.

ResponderCitar
Respondido : 20/08/2018 12:45 pm

Cursos Gratuitos WordPress

Por favor Iniciar Sesión o Registro