This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Changing breadcrumbs delimiter & Bootstrap

  • Creator
    Topic
  • #16862
    Eleven Sites
    Participant

    Hi Jason,

    I’m trying to change the breadcrumbs delimiter using the following code.

    /*-------------------------------------------------------*/
    /* Modify ThemeBlvd breadcrumb delimiter
    /*-------------------------------------------------------*/
     
    function my_breadcrumb_atts( $atts ) {
        $atts['delimiter'] = '<span class="divider">></span>';
        return $atts;
    }
    add_filter( 'themeblvd_breadcrumb_atts', 'my_breadcrumb_atts' );

    I’ve added this before the framework is called in my functions file. Although, it is showing, it’s not taking the place of the default delimiter “/”. So, both delimiters are showing, but I’m guessing that the second delimiter is being put there by Bootstrap.

    I’ve tried to modify the delimiter with my custom CSS file, but it’s not overwriting the bootstrap.min.css values. How do I get rid of the Bootstrap delimiter?

Viewing 1 replies (of 1 total)
  • Author
    Replies
  • #16876
    Jason Bobich
    Keymaster

    Hello,

    In Bootstrap 3, they started doing it with purely CSS. The “delimiter” in the framework is sort of there just for those that want to continue to use it. But really, you can ditch the filter, and just do it with CSS.

    .breadcrumb > li + li:before {
    	content: "\003E";
    	/* Your other styling for the divider here ... */
    }

    Note: \003E would be the equivalent of >.

    Here’s some more info on how CSS content works in general:

    http://css-tricks.com/css-content/

    Here’s a handy little converter for inserting characters into CSS content:

    http://www.evotech.net/articles/testjsentities.html

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.