Search code examples
wordpresstwitter-bootstrapwoocommercehook-woocommercewoocommerce-theming

WooCommerce: change button class without overwrite template files


I want to change the button classes of WooCommerce with the classes from Bootstrap.

At the moment I've done that by overwriting the existing templates files. In many cases, the button classes are the only changes.

Is there any hook to do this for all buttons instead of overwriting the template files?

I couldn't find anything


Solution

  • I don't know about a hook for this (there could be one), and I don't know about the Bootstrap classes. But if you want to avoid overwriting template files you could achieve it with some JavaScript.

    Add this code to the functions.php and it will change the class names accordingly.

    But the functions.php file will be overwritten with every theme update. So the proper way would be to create a child theme.

    add_action( 'wp_head', 'change_button_class' );
    function change_button_class() {
        ?>
    
        <script type="text/javascript">
        jQuery(document).ready(function($){
            $('.button-1').addClass('button-2').removeClass('button-1');
        });
        </script>
    
        <?php
    }
    

    Update

    Added script tag