Where can I add another class for woocommerce wrapper?

Question

Woocommerce has a div with the class "woocommmerce". I want to add another class or delete a class. Which file is this?

   <div class="woocommerce"></div>

Answer 1

there is no ready-made filter or anything similar that allows you to do this, but you can filter the_contentto do this.

function so33675604_add_class_to_checkout( $content ) {
    //condition to check for the proper page
    if ( is_checkout() ) :
        //disable error reporting for falsy formatted html code
        libxml_use_internal_errors(true);

        //parse the $content html (treat content as UTF-8, don't add any doctype or other html wrappers)
        $html = new DOMDocument();
        $html->loadHTML( mb_convert_encoding($content, 'HTML-ENTITIES', 'UTF-8'), LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD );

        //search for the very first div
        $container = $html->getElementsByTagName('div')->item(0);
        //add classes (remember to put woocommerce, since thats been used by some js functions)
        $container->setAttribute('class', 'woocommerce oink');

        //return the result
        return $html->saveHTML();
    endif;
    return $content;
}
//add the filter (priority must be high, so it runs later, after the shortcodes have been processed)
add_filter( 'the_content', 'so33675604_add_class_to_checkout', 100 );

remember that this function uses conditional expressions, and they may not work in wp-ajax calls / you would find another way to check if checkout (or else), possibly through the global one wp_query.

Answer 2

WooCommerce , "" , .

<div class="woocommerce"></div>

" ". WooCommerce .

WooCommerce "" , (, js) .. , .

, , CSS, .

Github, , , , WooCommerce " " ( , ).

, , css <div class="woocommerce"></div> CSS- (Bootstrap 4).

, <div class="woocommerce container-fluid container-application"></div>

?

WooCommerce class-wc-shortcodes.php include includes/, . , shortcode_wrapper(), "" . , woocommerce, <div class="woocommerce"></div>.

, , <div class="woocommerce"></div> " " shortcode_wrapper(), , " " <div class="woocommerce"></div>.

, WooCommerce, , , WooCommerce, .

(!)

" "

, <div class="woocommerce"></div> .

, WC_Shortcodes(). "" WooCommerce .

" ", , WooCommerce.

, WooCommerce , , , WordPress, . [woocommerce_my_account] WooCommerce , [woocommerce_my_account], .

functions.php, .

    /**
    * WooCommerce My Account
    * Returns custom html / css class for WooCommerce default wrapper on My Account pages
    * @see https://github.com/woocommerce/woocommerce/blob/857c5cbc5edc0451cf965b19788e3993804d4131/includes/class-wc-shortcodes.php#L59
    *
    **/
    if ( class_exists( 'woocommerce' ) ) {

      function wp_wc_my_account_shortcode_handler( $atts ) {

        $whichClass = new WC_Shortcodes();
        $wrapper = array(
          'class'  => 'woocommerce container-fluid container-application',
          'before' => null,
          'after'  => null
        );

        return $whichClass->shortcode_wrapper( array( 'WC_Shortcode_My_Account', 'output' ), $atts , $wrapper );

      }

      add_shortcode( 'new_woocommerce_my_account', 'wp_wc_my_account_shortcode_handler' );
    } 

------------------/ / ------------------

" " HTML . , . , Admin >> pages >> My Account [woocommerce_my_account] WooCommerce [woocommerce_my_account] [new_woocommerce_my_account].

/ " " , " " <div class="woocommerce container-fluid container-application"></div> <div class="woocommerce container-fluid container-application"></div>.

HTML

HTML- , / CSS. :

        $wrapper = array(
          'class'  => '',
          'before' => '<section class="woocommerce container-fluid container-application>',
          'after'  => '</section>'
        );

<div></div> <section></section>.

() , WooCommerce, , , , , , ..