Public Forums 71,145 posts

[Richard A Friend Richard AJoin date: January 2013Posts: 190Downloads:19Uploads:14 Thanks: 35 Thanked: 18 times in 2 posts]

#197074

EasyBlog and EasyDiscuss have the same problem – no quick route back to the parent category – unless backspace or the Joomla Breadcrumbs module is used, the latter being the only real option to cover all components in case EasySocial or other components have the same issue.

It works very well if you place the Breadcrumbs module in a position just below the main menu (navhelper is the one I use).

You also need to adjust the default background colour of the breadcrumbs as well as the T3 Framework (both set to #eee) to make it blend in correctly by adjusting in the custom.css file.

It will be different colours for people using different templates, but for Purity 3 this is the adjustment to blend in with the white background:

.breadcrumb {
background-color: #fff;
}

.t3-navhelper {
background: #fff;
padding: 0;
}

Note: The t3-navhelper padding is also changed, from 5px to 0, to remove a gap (between blocks) that would appear on any pages the module is not used – for example, the home page.

The image below shows the result (in the Breadcrumbs module you can apply it to any menu and remove ‘Home’ from the visible path if you wish):

---

Attachments:

1. 

[corecidex Friend corecidexJoin date: November 2014Posts: 11Downloads:0Uploads:4 Thanks: 3]

#557666

.breadcrumb {
background-color: #fff
}

.t3-navhelper {
background: #fff
padding: 0;
}

Hi, where can I change the css for the breadcrumb?

Thanks in advance!

[Richard A Friend Richard AJoin date: January 2013Posts: 190Downloads:19Uploads:14 Thanks: 35 Thanked: 18 times in 2 posts]

#557668

If you wish to change the actual breadcrumb css style/format as well as the background, make the change by adding the code you wish to use in the ../templates/purity_iii/css/custom.css file.

If you do not have a custom.css file create it in the ../templates/purity_iii/css/ folder.

All the original template css code can be found in the ..templates/purity_iii/css/template.css file and if you search the file for all code with the name ‘breadcrumb’ you should find something like this:

.breadcrumb {
margin-bottom: 0;
padding-left: 0;
padding-right: 0;
border-radius: 0;
}
.breadcrumb > li + li:before {
content: "/0a0";
}
.breadcrumb > li:nth-child(2):before {
content: "";
}
.breadcrumb > .active {
color: #999999
}
.breadcrumb .divider {
display: none;
}

.module-ct > ol.breadcrumb {
padding: 6px 12px;
margin-left: 0;
}

Decide what you wish to change, copy the original section into the custom.css file and edit there as required until you get the result you are looking for on your site.

1 user says Thank You to Richard A for this useful post

1. TomC

[Author]

Posts