#52 – breadcrumb not enabled

Posted in ‘ BreadCrumbs Advanced (GPLv2 License)’
This is a public ticket. Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.
Wednesday, 09 August 2017 00:59 CEST
 Hi UWiX, (Apologies if this question was already posted, I couldn`t find a record of it, so am reposting)

I have run into a new Breadcrumb Adv problem. In this case, it appears the custom css class used for the Breadcrumb Adv is not being loaded into the webpage. The exact same css class works on a different website. The problem may be a conflict in classes or something else I`ve overlooked, but after several days I haven`t uncovered the cause. I`m hoping someone else might be able to suggest what the problem might be.

The examples show a comparison between the site that *is not* working, with an existing site with an *identical* implementation where Breadcrumb Adv *is* working.

Some screenshots to illustrate the problem,
1. breadcrumb_corp1,jpg - shows missing Home icon (Font awesome), other css attributes not applied
2. breadcrumb_corp2,jpg - Chrome Dev Tools, showing missing custom breadcrumbs class
3. breadcrumb_corp3,jpg - Chrome Dev Tools, different site with *working* version of breadcrumbs class
4. breadcrumb_corp4,jpg - breadcrumbs class added to module
5. breadcrumb_corp5,jpg - the custom breadcrumbs class

Any suggestions would be most welcomed. Thanks in advance for your help,
Custom Fields
BCA version 302
Brower used Chrome
Wednesday, 09 August 2017 13:24 CEST
Hello Ian,

Sadly enough the screenshots cannot be view because it appears only a filename is included in the ticket (and not the full url to the pictures).

To see what's going on on the troubled page(s) it's better for me to see the full source of the page. So is it possible you provide me with a live URL to the troubled page? That way I can try to analyze that.

I've set this ticket to private so only you and the UWiX support staff can read this ticket. What I also would like is a link to the backend of your website including some temporary administrator credentials. We're working in a timezone difference here (about 6 to 8 hours?) so to prevent you'll have to wait a full day before any response from me it's better we've already got all the input we need.

Please provide the following if that is possible, ofcourse:
  1. An url to the trouble page(s).
  2. The url to the backend of the troubled site.
  3. A user account with administrator credentials (no worries, nothing is changed without letting you know).

This thing should be possibile to fix. :-)

Greetz, Nikolai

Bug? That's not a bug, that's a feature. :-)

Wednesday, 09 August 2017 22:33 CEST
Hi Nikolai,

Thanks for helping to troubleshoot this problem. I`ve setup a temporary guest account for you.
Here is the information you requested. If you are able to find a solution, please let me know how you fixed it :)

1. All pages except Home show the issue, but here is an example.

2. URL to login

Guest User account
login: .......
pwd: .......

The css styles defined for the breadcrumb adv are in custom.css, (but not getting applied)

Thanks again,
Wednesday, 09 August 2017 23:23 CEST
Hello Ian,

It's hard at first glance why styles aren't applied. The custom.css does get loaded in the page but I'm not sure what style difference should appear when they do get applied. Okay, I do know my CSS good enough to read the custom.css but .... well, not important because I think I see where things go 'wrong' ;-)

When I examen the breadcrumb layer definied in your page I notice the following in the classname:
<div class="breadcrumbsbreadcrumbs-custom" style..... >

Hey, that's a weird classname... Then I've check your module settings in the backend and for the "Module Class Suffix" I have entered a space in front off the "breadcrumbs-custom" declaration.

Does that solve the problem of the CSS not being applied? ;-) Joomla! has a stange default little thingy when using the "Module Class Suffix" of not using a default space. That's done so you can 'extend' a classname. But when you want to use a seperate (extra) class name you'll have to enter a space in front for correct usage.

Hope this will get your head straight for now :-) Sometimes you'll keep on trying to fix something but you just cannot see the solution.

Greetz, Nikolai van Nes

p.s. only change made is a space entered in front of your Module Class Suffix declaration in the backend of the BCA module.

Bug? That's not a bug, that's a feature. :-)

Thursday, 10 August 2017 03:40 CEST
Hi Nikolai,
You were correct to spot the issue with the extra space in front of the class name on the Breadcrumb Adv module.

However, this only adds to the puzzle. I have a different working site where the Module Class Suffix is "breadcrumb-custom" (note, without an 's'). The leading space is also *omitted* from the class name in the Module, and the Breadcrumb styles and Home icon still display correctly .

In the case of the new site however, the same setup does not work. Instead I found that I needed to rename the class to *breadcrumbs-custom*, with an 's', and also *omit* the space in front of the Module Class Suffix.

It is hard to explain, but this configuration works on the new site. I don't know how the two setups can be different but both work. But all that really matters is that it fixes the issue.

By drawing my attention to the leading space got me thinking about the Class name, and adding the 's' to the name was the unexpected key.

So thank you again for your help. This solution remains a mystery to me, but one at least that has been resolved in our favor.

Best regards,
Thursday, 10 August 2017 09:56 CEST
Hello Ian,

Well, everything you describe should lead to the declared CSS styles on your websites. If the "s" matters it should be the case it's also declared with the "s" in your style sheet(s).

In case of the sample page you've sent me I still notice a missing space in front of the class "breadcrumbs-custom" inside the div with class "module-content".
Anyway - CSS can be a complex thing if it doesn't work as it should. I always use the Firebug add-on for FIreFox to follow in what order CSS styling is applied to an element. Most of the time I can find the troubled CSS with that option. But in case of some tiny type-o .... well, that can take days :-(

If you need any more assistance, please let me know!

Greetz, Nikolai van Nes

Bug? That's not a bug, that's a feature. :-)

Thursday, 10 August 2017 18:40 CEST
Hi Nikolai,
I worked with the CSS a bit longer and got both sites to work the same way. i.e. the custom class is "breadcrumb-custom", without an `s` or leading space in the Module Class Suffix.

However with Firebug (which I also like using), if you add a space between the concatenated class, "breadcrumbsbreadcrumb-custom", then you may notice the :before selector causes the Home icon to repeat twice.

So I found I have to leave the class name as is, without adding the extra space. Then it works.

I have experimented with other css variations in an attempt to fix this, but couldn't find one. So I am leaving it like this, at least it works :)

Thanks again for your help,
Thursday, 10 August 2017 19:35 CEST
You're very welcome. Sometimes CSS can be a pain in the .... eh... head.... ;-)

Happy coding!

Greetz, Nikolai.

Bug? That's not a bug, that's a feature. :-)

Sunday, 10 September 2017 00:00 CEST
This ticket has been automatically closed. All tickets which have been inactive for a long time are automatically closed. If you believe that this ticket was closed in error, please contact us.
This ticket is closed, therefore read-only. You can no longer reply to it. If you need to provide more information, please open a new ticket and mention this ticket's number.
Support Availability

Working days: Monday to Friday. The is available 24 hours a day, 7 days a week but will only be answered during workings days according CET.
Reply time: Depending on the complexity of your support issue it's usually between a few minutes and 48 hours. When we expect longer delays we will notify you when you file a ticket or reply.