Viewing 12 replies - 1 through 12 (of 12 total)
  • Hello,

    You can try this in your Custom CSS for Breadcrumb:

    https://ww.wp.xz.cn/plugins/wordpress-seo/

    Thank you.

    Thread Starter Zodiac5

    (@zodiac5)

    Hello, thank you for your answer. I would like to add a css code to style.css if that’s possible. Like this one: https://css-tricks.com/triangle-breadcrumbs/
    But I don’t know what exactly to add to look like example above.

    Hello,

    If you do as in the link you provide me then it will show the same Breadcrumb in all pages.

    So you need to use the plugin i provide you and follow the instructions on this link:
    http://kb.yoast.com/article/245-implement-wordpress-seo-breadcrumbs

    But if you want to add Breadcrumb in only one page you can try the link you provide me.

    Thank you.

    Thread Starter Zodiac5

    (@zodiac5)

    Yes, I did that, but it still showing like this: http://postimg.org/image/5oa07zg81/
    I want to look for example like this: http://postimg.org/image/74liq4j4x/

    Hello,

    Can you please provide the link of both the sites whose screenshot you mentioned above.

    Looking forward for your reply.

    Thank you.

    Thread Starter Zodiac5

    (@zodiac5)

    Hello,

    First of all to remove the double arrows you need to go to your Dashboard > SEO > Advanced > Breadcrumbs > Separator between breadcrumbs , remove it from there and save the changes.

    Then you can try this code in your Custom CSS for achieving that:

    .cont_nav_inner a:first-child::after {
        border-bottom: 25px solid transparent;
        border-left: 10px solid;
        border-top: 25px solid transparent;
        color: #015999;
        content: "";
        left: 512px;
        position: absolute;
        top: -14px;
    }
    .cont_nav_inner a:first-child {
        background-color: #015999;
        color: #fff !important;
        font-size: 18px;
        font-weight: bold;
        padding: 14px;
    }
    .cont_nav_inner a + a::after {
        border-bottom: 25px solid transparent;
        border-left: 10px solid;
        border-top: 25px solid transparent;
        color: #087dd1;
        content: "";
        position: absolute;
        right: 551px;
        top: -14px;
    }
    .cont_nav_inner a + a {
        background-color: #087dd1;
        color: #fff !important;
        font-size: 18px;
        font-weight: bold;
        padding: 14px;
    }
    .cont_nav_inner span::after {
        border-bottom: 25px solid transparent;
        border-left: 10px solid;
        border-top: 25px solid transparent;
        color: #0490f4;
        content: "";
        position: absolute;
        right: 429px;
        top: -14px;
    }
    .cont_nav_inner span {
        background-color: #0490f4;
        color: #fff;
        font-size: 18px;
        font-weight: 500;
        padding: 14px;
    }

    You can adjust the values as per your requirement.

    Hope that helps you, feel free to ask if there is any other problem.

    Thank you.

    Thread Starter Zodiac5

    (@zodiac5)

    Hello, thanks for answer. Look, I don’t need SEO breadcrumbs because theme have own breadcrumbs. When I press customize, I can turn off and on that breadcrumbs. CSS file that you sent me is for that breadcrumbs and it’s good, but I need only to remove double arrows so it can look good. For now it looks like this: http://postimg.org/image/njdnquttj/

    Hello,

    If you want to use the themes default breadcrumb then please activate that
    and deactivate the SEO breadcrumb so that i can give you the CSS for that.

    And if you want to remove the double arrow as i mentioned above you can go through your Dashboard > SEO > Advanced > Breadcrumbs > Separator between breadcrumbs , remove it from there and save the changes.

    Thank you.

    Thread Starter Zodiac5

    (@zodiac5)

    Hey, like I told you before, the css that you gave me is for default breadcrumb. I already deactivated SEO breadcrumb, so the CSS that you gave me is working, but I just want to know how to remove double arrows from default breadcrumbs. Thanks

    Thread Starter Zodiac5

    (@zodiac5)

    Anything?

    Hello,

    Sorry for the misunderstanding. You can edit the themes core file to remove the double arrow from your breadcrumb. Or you can contact the theme author for better result.

    Thank you.

Viewing 12 replies - 1 through 12 (of 12 total)

The topic ‘Breadcrumb custom CSS’ is closed to new replies.