Visualización detalle productos version responsive virtuemart  

 
SALVADOR
 SALVADOR
Usuario experto

Buenos días

Parece que en alguna actualización de joomla o virtuemart la visualización detallada del producto se ha visto alterada, y en la versión responsive desaparece (o desposicionan), tanto el precio del producto como el botón de enviar.

También parece que los botones de redes sociales se han desconfigurado en la versión responsive.

Le he estado dando vueltas a todo, y realizando cambios con otra web alojada que tengo clonada, que si funciona correctamente tanto en la versión responsive como la normal, pero aún copiando los archivos de virtuemart de una a otra sigue sin funcionar.

Gracias anticipadas por vuestra aportación

Citar
Respondido : 18/12/2018 11:38 am
Pepe
 Pepe
Soporte CMS Webempresa Moderator

Hola Salvador.

Prueba añadiendo lo siguiente a tu archivo palene-custom.css que encontraras en la ruta templates -> palene -> css -> palene-custom.css

@media (max-width:767px) { 
.vm-product-details-container {
    float: none;
    width: 55%;
}
.productdetails-view .addtocart-bar {
	left:33%;
}
}
.product-price {
text-align: -webkit-left;
}

Revisa si después de esta modificación se visualiza mejor.

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 : 18/12/2018 1:31 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

SALVADOR
 SALVADOR
Usuario experto

Hola Pepe, gracias por tu respuesta

Ya había toqueteado algo el palene-custom sin éxito. También he probado con el css que me indicas y no parece que haga absolutamente nada. Puede que haya algo prioritario indicado?

También es cierto que este archivo palene-custom está plagado de advertencias de posibles conflictos, no se ya donde tocar.

Te paso código palene-custom por si vieras algo mas. Gracias

/* estilos nuevos */

.browse-view .vm-details-button{
    display: none!important;
}

.spacer.product-container {
    border: 1px solid #ddd !important;
}

span.addtocart-button input.addtocart-button, span.addtocart-button input.addtocart-button:hover, span.addtocart-button input.notify-button, span.addtocart-button input.notify-button:hover, input.highlight-button, input.highlight-button:hover, a.highlight, a.highlight:hover {
    
    color: #fff !important;
    background-color: #3d3a38 !important;
    border: 0px solid white !important;
    border-radius: 0px !important;
    padding: 0 6px !important;
    line-height: 28px !important;
        font-size: 14px !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
}

.orderlistcontainer > .title{
    display: none !important;
}

.orderlistcontainer > .activeOrder{
    margin-top: 20px !important;
}

.virtuemart_search{
    display: none !important;
}

.browse-view .vm-product-rating-container{
    display: none !important;
}

.back-to-category > a.product-details {
    background: none !important;
    border: solid #3d3a38 1px !important;
    border-radius: 0px !important;
}

.browse-view h1{
    margin-top: 30px !important;
    margin-bottom: 40px !important;
}

.orderby-displaynumber {
    border-bottom: solid #E9E8E8 0px !important;
    border-top: solid #E9E8E8 0px !important;
}

.productdetails h1{
        margin-bottom: 40px !important;
}


.vm-order-done .vm-button-correct{
    color: white !important;
    margin: 0 auto;
    margin-top: 25px;
    margin-bottom: 25px;
}

.page-id-217 .alert-error, .proopc-error-msg{
    display: none !important;
}



.vm-price-value .PricesalesPrice{
	font-size:24px!important;
	color:red!important;
}



.vm-price-value .PricebasePriceWhithTax{
	font-size:24px!important;
	color:red!important;
}
.productlist .price-box .PricesalesPrice .PricebasePriceWithTax{
	color : red!important;
}
a.product-details {
display: inline !important;
}


.spacer.product-container {
    border: 1px solid #ddd !important;
}


.vm-product-details-container .PricebasePriceVariant, .vm-product-details-container .PricebasePrice,.vm-product-details-container  .PricesalesPriceTt,.vm-product-details-container  .PricediscountedPriceWithoutTax, .vm-product-details-container  .PricediscountedPriceWithoutTaxTt, .vm-product-details-container  .PricediscountAmount, .vm-product-details-container  .PricediscountAmountTt, .vm-product-details-container  .PricetaxAmount, .vm-product-details-container  .PricetaxAmountTt, .vm-product-details-container .PricepriceWithoutTax, .vm-product-details-container .PricepriceWithoutTaxTt{
    display: none !important;
}


.category-view .PricebasePriceVariant, .category-view .PricebasePrice,.category-view  .PricesalesPriceTt,.category-view  .PricediscountedPriceWithoutTax, .category-view  .PricediscountedPriceWithoutTaxTt, .category-view .PricediscountAmount, .category-view  .PricediscountAmountTt, .category-view  .PricetaxAmount, .category-view  .PricetaxAmountTt, .category-view .PricepriceWithoutTax, .category-view .PricepriceWithoutTaxTt{
    display: none !important;
}


.cart-images{
    display: none !important;
}

#ProOPC .cart-product-description.with-image {
    padding-left: 0px !important;
}

.vm-order-done .vm-button-correct{
    color: white !important;
    margin: 0 auto;
    margin-top: 25px;
    margin-bottom: 25px;
}

.page-id-217 .alert-error, .proopc-error-msg{
    display: none !important;
}
.browse-view .orderby-displaynumber{
	
}

.vmproductcenter .quantity-box, .vmproductcenter .quantity-controls{
    display: none !important;
}


.continue_link{
    display: none !important;
}


@media (min-width: 600px) {

.product-field-type-R, .product-field-type-Z {
    float: left;
    margin: 0 16px;
    max-width: 24%;
    float: left;
    clear: none;
}

.moduletable_pro .spacer .cat-image {
min-height: 208px;
}

}
.gf-menu-toggle{
	top:130px;

    
}
@media (max-width:767px) { 
.vm-product-details-container {
    float: none;
    width: 55%;
}
.productdetails-view .addtocart-bar {
	left:33%;
}
}
.product-price {
text-align: -webkit-left;
}
ResponderCitar
Respondido : 18/12/2018 2:00 pm
Pepe
 Pepe
Soporte CMS Webempresa Moderator

Hola Salvador.

Si lo reviso con el inspector del navegador no veo el código añadido en el archivo.

Añade de nuevo el codigo en el archivo, esta vez le añadimos la etiqueta !important:

@media (max-width:767px) { 
.vm-product-details-container {
    float: none!important;
    width: 55%!important;
}
.productdetails-view .addtocart-bar {
	left:33%!important;
}
}
.product-price {
text-align: -webkit-left!important;
}

Si ves que no se muestra el resultado, intenta acceder con el navegador en privado:
-> https://support.google.com/chrome/answer/95464?co=GENIE.Platform%3DDesktop&hl=es
-> https://support.mozilla.org/es/kb/navegacion-privada-Firefox-no-guardar-historial-navegacion

Si aun así sigues sin ver los resultado deja el código añadido en el archivo y lo indicas para que podamos seguir revisando.

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 : 18/12/2018 3:12 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

SALVADOR
 SALVADOR
Usuario experto

Hola de nuevo Pepe

Parece que hemos conseguido visualizar el precio, pero sigue sin mostrar botón de compra.
Por otro lado, aplicando este important! parece que modificamos también el css de módulos de destacados y previsualización de artículos en la categoría, quedando todo muy descuadrado.

La foto por otra parte tampoco realiza ninguna modificación, ni en tamaño, ni en posición por lo que hay dispositivos que tampoco se ve si no estan en horizontal.

Gracias, seguiré probando, espero sugerencias

Saludos

ResponderCitar
Respondido : 18/12/2018 3:39 pm
Jhon Marreros Guzman
 Jhon Marreros Guzman
Soporte CMS Webempresa Moderator

Hola

Elimina el código anterior y sólo deja el siguiente código, ya que al parecer esta mal el contenedor

.productdetails-view .vm-product-container{
    width: auto!important;
}

Saludos.

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 18/12/2018 5:44 pm

Cursos Gratuitos WordPress

SALVADOR
 SALVADOR
Usuario experto

Gracias John y Pepe

Todo solucionado, con las vueltas que le damos a veces y luego lo sencillo que parece... jejeje

Saludos

ResponderCitar
Respondido : 18/12/2018 6:16 pm

Por favor Iniciar Sesión o Registro