WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] [Theme: The Bootstrap] LESS Support? (2 posts)

  1. Myxomatosis
    Member
    Posted 1 year ago #

    I thought TWBS had built in support for LESS. Is this not the case? I'm having trouble getting it to work within this theme.
    Do you have any plans to add LESS support?

  2. Myxomatosis
    Member
    Posted 1 year ago #

    Well I figured this out with some help from this blog. This bit of code adds the less.js and the bootstrap.less.

    function my_lesscss() {
    	//First we register the script
    	//wp_register_script( $handle, $src, $deps, $ver, $in_footer );
    	wp_register_script( 'lesscss',
    						get_stylesheet_directory_uri() . '/js/less-1.3.0.min.js',
    						false,
    						'1.3',
    						false );
    
    	//wp_register_style( $handle, $src, $deps, $ver, $media );
    	wp_register_style( 'lesscss',
    						get_stylesheet_directory_uri() . '/less/bootstrap.less',
    						false,
    						'2.1',
    						'screen');
    
    	//wp_enqueue_script($handle, $src, $deps, $ver, $in_footer); we already defined all these so we just need to call our handle
    	wp_enqueue_script('lesscss');
    	wp_enqueue_style('lesscss');
    }
    add_action('wp_enqueue_scripts', 'my_lesscss');
    add_action('wp_enqueue_style', 'my_lesscss');
    
    function enqueue_less_styles($tag, $handle) {
        global $wp_styles;
        $match_pattern = '/\.less$/U';
        if ( preg_match( $match_pattern, $wp_styles->registered[$handle]->src ) ) {
            $handle = $wp_styles->registered[$handle]->handle;
            $media = $wp_styles->registered[$handle]->args;
            $href = $wp_styles->registered[$handle]->src . '?ver=' . $wp_styles->registered[$handle]->ver;
            $rel = isset($wp_styles->registered[$handle]->extra['alt']) && $wp_styles->registered[$handle]->extra['alt'] ? 'alternate stylesheet' : 'stylesheet';
            $title = isset($wp_styles->registered[$handle]->extra['title']) ? "title='" . esc_attr( $wp_styles->registered[$handle]->extra['title'] ) . "'" : '';
    
            $tag = "<link rel='stylesheet' id='$handle' $title href='$href' type='text/less' media='$media' />";
        }
        return $tag;
    }
    add_filter( 'style_loader_tag', 'enqueue_less_styles', 5, 2);

    The bootstrap.less would be great to utilize for development, which is my whole reason for this headache, BUT since the bootstrap.less show up before the adult theme and child theme's style sheets the bootstrap style sheet is overridden. So I removed them with the following function

    add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
    function my_deregister_styles() {
    	wp_deregister_style('tw-bootstrap');
    	wp_deregister_style('the-bootstrap');
    }

    It works, they are removed; however, I also lost the responsiveness. Can anyone tell me why? I don't want to start editing the-bootstrap's code, but it would be a lot easier.

Topic Closed

This topic has been closed to new replies.

About this Topic