Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • November 10, 2018 at 12:17 pm #1032000
    kenwcmg

    Hi,
    I’ve tried to put in a breadcrumb, but have a couple of issues:
    1) The breadcrumb for most of the portfolio items doesn’t actually reflect the Menu Structure, I.e. for all of my portfolio items, the breadcrumb trail looks like this: Home/Skye Cuillin /*portfolio item* when there are only a few portfolio items that should be under the sub-menu of Skye Cuillin, as per the menu bar.
    2) Is it possible to move the breadcrumb to be incorporated into the Menu container, as per the attached image, so that the logo doesn’t have a gap beneath it.
    Move-Breadcrumb

    • This topic was modified 6 years ago by kenwcmg.
    November 14, 2018 at 2:15 am #1033292
    Vinay

    Hey kenwcmg,

    1. I checked your site and there are 3 items in the “Skye Cullin” category. Let us know which other items you noticed is not in this category but still show up here.

    2. Please use the below CSS to move the breadcrumbs inside the header.

    
#main .title_container {    
    z-index: 999;
    margin-top: -12px;
    border: none;
    background: transparent;
}

    Best regards,
    Vinay

    November 14, 2018 at 9:37 pm #1033693
    kenwcmg

    Hi Vinay,
    Brilliant, many thanks for that CSS code, that works a treat.

    Currently, all my portfolio items (I.e. all of my winter courses and summer courses) are showing up with the breadcrumb: Home / Skye Cuillin / ….

    November 15, 2018 at 4:44 pm #1034032
    kenwcmg

    I thought that the CSS code that you gave me that would put the breadcrumb trail in the header worked well, but I found out that it would then mean that if trying to click on a sub-menu item (portfolio item), the sub-menu box would disappear, so I’ve since hidden the Header Title and Breadcrumbs and removed the associated CSS code, so back to square 1.

    November 17, 2018 at 5:28 pm #1034759
    Basilis

    Hi,

    That happens because we put a z-index:999 to the code, so it can look before anything else and can work for what you need to do.

    Best regards,
    Basilis

    November 19, 2018 at 11:26 am #1035121
    kenwcmg

    Thanks, I’ve no idea what a z-index:999 is, or what it does. Any ideas for why my breadcrumb isn’t displaying the correct location?

    November 21, 2018 at 2:59 pm #1036086
    Nikko

    Hi kenwcmg,

    z-index is basically a technical term, which is used in css: https://www.w3schools.com/cssref/pr_pos_z-index.asp
    You can think of it as a layer, the layer which gets a higher z-index it’s added on the front/foreground, the lower the number then it’s positioned at the background.
    Can you try to change the z-index of the code Vinay gave from 999 to 980, so it’s:

    #main .title_container {    
    z-index: 980;
    margin-top: -12px;
    border: none;
    background: transparent;
}

    Then add more z-index to the header, so you need to add this code also:

    #top #header_main {
    z-index: 990;
}

    Hope this helps.

    Best regards,
    Nikko

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.