Skip Navigation

[Resuelto] Errors in checkout page of woocommerce

This support ticket is created hace 2 años, 2 meses. There's a good chance that you are reading advice that it now obsolete.

Este es el foro de soporte técnico para Toolset: un paquete de plugines para el desarrollo de sitios WordPress sin escribir PHP.

Cualquier persona puede leerlo, pero solo los clientes de Toolset pueden publicar en este foro. El soporte de Toolset atiende 6 días a la semana, 19 horas por día.

This topic contains 9 respuestas, has 2 mensajes.

Last updated by ericL-12 hace 2 años, 2 meses.

Assigned support staff: Nigel.

Autor
Mensajes
#1519775

Estoy tratando de:

The checkout fields (woocommerce) design is broken when Toolset is activated.

URL de (mi) sitio web donde aparece el problema:

hidden link

Yo esperaba ver:

hidden link

En vez de eso, obtuve:

hidden link

#1520219

Nigel
Supporter

Languages: Inglés (English ) Español (Español )

Timezone: Europe/London (GMT+01:00)

I logged in and tried to test the checkout page—I'm guessing some stylesheet is loaded by Toolset which is clashing with the normal styles—but the shop page is empty and if I visit a single product page the Add-to-cart button is inactive.

What do I need to do to be able to test the cart?

#1524643

Hello Nigel,

Variation must be selected. Try with this URL: hidden link

Thank you1

#1525187

Nigel
Supporter

Languages: Inglés (English ) Español (Español )

Timezone: Europe/London (GMT+01:00)

Screenshot 2020-02-24 at 14.05.24.png

It looks like the problem arises because of a conflict between the WC checkout styles for columns and those used by Bootstrap 4 (see screenshot).

You can go to Toolset > Settings and change the Bootstrap settings to say that this site is not using Bootstrap.

#1525327

Hello,

I need bootstrap for my views... Ano other option to fix it?

#1525737
Screenshot (30).png

I've managed to solve the issue you mentioned with some css, but there is still styles that are broken. Nothing is aligned etc...

CSS I added is:

#customer_details div.col-1 {
	max-width: 100% !important;
}

Screenshot of result attached.

#1526603

Nigel
Supporter

Languages: Inglés (English ) Español (Español )

Timezone: Europe/London (GMT+01:00)

I think an easier approach may be to simply dequeue Bootstrap on the checkout page, so it will load on other pages where you may need it, but not on this page that is causing you problems.

So you could add the following snippet to Toolset > Settings > Custom Code:

/**
 * Don't enqueue Bootstrap on WC checkout page
 */
function ts_dequeue_bootstrap(){

  if ( is_page( 'finalizar-compra' ) ) {


    // dequeue Bootstrap CSS
    function ts_dequeue_bootstrap_css(){
      wp_dequeue_style( 'toolset_bootstrap_styles' );
    }
    add_action( 'wp_print_styles', 'ts_dequeue_bootstrap_css' );

    // dequeue Bootstrap JS 
    function ts_dequeue_bootstrap_js(){
      wp_dequeue_script( 'toolset_bootstrap' );
    }
    add_action( 'wp_print_scripts', 'ts_dequeue_bootstrap_js' );    

  }

}
add_action( 'wp_enqueue_scripts', 'ts_dequeue_bootstrap', 100 );

Can you try that?

#1530871
Screenshot (33).png
Screenshot (34).png

Hello,

thanks. I did it but there are still some errors. Screenshot attached.

Thanks again

#1531709

Nigel
Supporter

Languages: Inglés (English ) Español (Español )

Timezone: Europe/London (GMT+01:00)

I checked your page and see that Bootstrap is still added to the page.

I double-checked and see that the handles for enqueuing Bootstrap were changed with BS4 so I updated the code so that it dequeues BS3 and BS4 on your checkout page:

/**
 * Don't enqueue Bootstrap on WC checkout page
 */
function ts_dequeue_bootstrap(){
 
  if ( is_page( 'finalizar-compra' ) ) {
  
    // dequeue Bootstrap CSS
    function ts_dequeue_bootstrap_css(){
      wp_dequeue_style( 'toolset_bootstrap_styles' );
      wp_dequeue_style( 'toolset_bootstrap_4' );
    }
    add_action( 'wp_print_styles', 'ts_dequeue_bootstrap_css' );
 
    // dequeue Bootstrap JS 
    function ts_dequeue_bootstrap_js(){
      wp_dequeue_script( 'toolset_bootstrap' );
      wp_dequeue_script( 'toolset_bootstrap_4' );
    }
    add_action( 'wp_print_scripts', 'ts_dequeue_bootstrap_js' );    
 
  }
 
}
add_action( 'wp_enqueue_scripts', 'ts_dequeue_bootstrap', 100 );

Can you please try with the updated code?

#1532369

My issue is resolver, thank you so much Nigel. Best support ever