Jump to content

Modificaciones en las fichas detalle productos (Solucionado)


xavivila

Recommended Posts

Hola a todos,

 

Me he encontrado con el siguiente problema:

 

En la ficha detalle de los productos encima de la foto me salen varios simbolos los cuales me gustaría que saliese bien ya que se ve muy feo.

 

En dichas fichas si hay más de un producto los pequeñitos que salen abajo del pricipal salen cortados y no se ven.

 

Y por último he estado intentando cambiar el fondo amarillo de "mas" pero no lo consigo hacer..

 

A ver si alguien me pudiera ayudar porfavor

 

Saludos y gracias de antemano

 

url: http://love-sensatio...3912257847.html

Edited by xavivila (see edit history)
  • Like 1
Link to comment
Share on other sites

 

Y por último he estado intentando cambiar el fondo amarillo de "mas" pero no lo consigo hacer..

 

Para cambiar el fondo amarillo de "Mas" el borde amarillo tambien

 

Fichero:

 

/themes/prestashop_new/css/global.css

 

Busca esto:

 

.idTabs {
list-style-type: none;
margin-top: 20px;
padding: 0 5px;
border-bottom: 8px solid #F7B900;
}

 

 

Y donde dice:

 

border-bottom: 8px solid #F7B900;

 

Asignale otro color depende el

 

#F7B900

 

(Este es el borde amarillo, que hay debajo de "Mas")

 

Ahora el fondo de la palabra "Mas"

 

En el mismo fichero, busca esto:

 

.idTabs .selected {
color: black;
background: url(../img/bg_li_idTabs.png) #FFE3F1 repeat-x 0 0;
}

 

Y ya el back-ground dependera del que le asignes.

  • Like 1
Link to comment
Share on other sites

En la ficha detalle de los productos encima de la foto me salen varios simbolos los cuales me gustaría que saliese bien ya que se ve muy feo.

 

 

Supongo que te refieres al simbolo que aparece que es como una lupa duplicada... (Dejar la lupa sin duplicación)

 

Busca esto:

 

pb-right-column #image-block #view_full_size .span_link {
position: absolute;
bottom: 10px;
left: 32%;
display: block;
padding: 0 12px 0 30px;
line-height: 20px;
color: white;
text-shadow: 0 1px 0 black;
text-align: center;
text-transform: uppercase;
background-image: url(../img/icon/zoom.png);
background-repeat: no-repeat #00000;
background-position: 10px 2px;
background-color: black;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
}

 

 

Y dejalo asi:

 

pb-right-column #image-block #view_full_size .span_link {
position: absolute;
bottom: 10px;
left: 32%;
display: block;
padding: 0 12px 0 30px;
line-height: 20px;
color: white;
text-shadow: 0 1px 0 black;
text-align: center;
text-transform: uppercase;
background-image: url(../img/icon/zoom.png);
background-repeat: no-repeat;
background-position: 10px 2px;
background-color: black;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
}

  • Like 1
Link to comment
Share on other sites

Buenas nosches....hecho pero el fondo (aunque lo he cambiado) del mas no me varia...

 

Logico, por que lo has dejado asi:

 

.idTabs .selected {
color: black;
background: url(../img/bg_li_idTabs.png) #AE4D4D repeat-x 0 0;
}

 

 

Y

 

../img/bg_li_idTabs.png

 

Hace referencia a:

 

/themes/prestashop_new/img/bg_li_idTabs.png

 

Prueba dejarlo directamente con el color asi:

 

.idTabs .selected {
color: black;
background:#AE4D4D;
}

  • Like 1
Link to comment
Share on other sites

Supongo que te refieres al simbolo que aparece que es como una lupa duplicada... (Dejar la lupa sin duplicación)

 

Busca esto:

 

pb-right-column #image-block #view_full_size .span_link {
position: absolute;
bottom: 10px;
left: 32%;
display: block;
padding: 0 12px 0 30px;
line-height: 20px;
color: white;
text-shadow: 0 1px 0 black;
text-align: center;
text-transform: uppercase;
background-image: url(../img/icon/zoom.png);
background-repeat: no-repeat #00000;
background-position: 10px 2px;
background-color: black;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
}

 

 

Y dejalo asi:

 

pb-right-column #image-block #view_full_size .span_link {
position: absolute;
bottom: 10px;
left: 32%;
display: block;
padding: 0 12px 0 30px;
line-height: 20px;
color: white;
text-shadow: 0 1px 0 black;
text-align: center;
text-transform: uppercase;
background-image: url(../img/icon/zoom.png);
background-repeat: no-repeat;
background-position: 10px 2px;
background-color: black;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
}

 

Esto en el

 

/themes/prestashop_new/css/product.css

 

 

Todo lo otro que te he comentado por ahora en el global.css, menos esto que es en el fichero que menciono.

  • Like 1
Link to comment
Share on other sites

Te falta lo de la ficha del Producto, cuando hay mas de dos miniaturas...

 

¿Puedes pasarme una url de un producto en concreto que tenga mas de dos miniaturas? (Lo digo por la url de arriba no funciona, dice producto no encontrado)

Link to comment
Share on other sites

Ahora si te fijas cuando en la ficha detallada hay mas de una foto las pequeñitas de abajo salen cortadas...

 

Respuesta:

 

 

Te falta lo de la ficha del Producto, cuando hay mas de dos miniaturas...

 

¿Puedes pasarme una url de un producto en concreto que tenga mas de dos miniaturas? (Lo digo por la url de arriba no funciona, dice producto no encontrado)

Link to comment
Share on other sites

url: http://love-sensatio...8403150036.html

 

Si, nos habiamos cruzado escribiendo.. :D

 

Prueba esto edita el fichero:

 

/themes/prestashop_new/product.tpl

 

Busca esto:

 

   <img id="thumb_{$image.id_image}" src="{$link->getImageLink($product->link_rewrite, $imageIds, 'medium')}" alt="{$image.legend|htmlspecialchars}" height="{$mediumSize.height}" width="{$mediumSize.width}" />

 

 

Y dejalo asi:

 

   <img id="thumb_{$image.id_image}" src="{$link->getImageLink($product->link_rewrite, $imageIds, 'small')}" alt="{$image.legend|htmlspecialchars}" height="{$smallSize.height}" width="{$smallSize.width}" />

  • Like 1
Link to comment
Share on other sites

En este ultimo paso, como has tenido que modificar un fichero *.tpl, no se te olvide ir a la pestaña Preferencias -> Rendimiento y señalar Forzar Compilación -> SI, para que se apliquen los cambios (Una vez aplicado los cambios lo dejas en NO).

Link to comment
Share on other sites

he limpiado el cache de IE y tampoco se ven las fotos...porque puede ser?

 

Haz esto a modo super chapuza...

 

Fichero:

 

 

/themes/prestashop_new/css/product.css

 

 

Busca esto:

 

#thumbs_list li img {
margin: 0 6px;
border: 1px solid #CDCDCD;
}

 

 

Y dejalo asi:

 

#thumbs_list li img {
margin: 0 6px;
border: 1px solid #CDCDCD;
height: 45px;
width: 45px;
}

 

Y dime si se te ve.

  • Like 1
Link to comment
Share on other sites

Pues si señor...se ve perfecto en ambos...si ya digo yo que eres un genio !!!

Un placer ayudarte y servirte!

 

Si das el tema como solucionado, edita el titulo del tema, editando el primer mensaje del tema y añadiendo la palabra "Solucionado" al titulo, esto ayudara a mantener una mayor organización en el foro.

 

Un saludo y recuerda que estaremos en el foro, para guiarte por este mundo oscuro y tenebroso.

  • Like 1
Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
×
×
  • Create New...