Difference between #3 and #4 of
Yii2 - Upgrading to Bootstrap 4

Revision #4 has been created by Richard Pillay on Mar 20, 2020, 12:18:55 PM with the memo:

Added a note regarding Breadcrumbs to prevent readers wasting time that may not need to be spent.
« previous (#3)

Changes

Title unchanged

Yii2 - Upgrading to Bootstrap 4

Category unchanged

How-tos

Yii version unchanged

2.0

Tags unchanged

newbie,Twitter Bootstrap,navbar,bootstrap4

Content changed

[...]
<br>

**Breadcrumbs**

> **Note - March 2020**: This entire section on Breadcrumbs may no longer be an issue. While I've left the section in as a tutorial, before making any changes read what Davide has to say in the user comments.
 
 
So, that fixed my navbar. Next, I noticed that the breadcrumbs were not quite right - the slash separating the path elements was no longer there. Preparing for a lot of debugging, I went to the Bootstrap site to look for a little inspiration. I didn't need to look any further - Bootstrap 4 requires each Breadcrumb element to have a class of "breadcrumb-item". After I spent a little time looking at vendors/yiisoft/yii2/widgets/Breadcrumbs.php to get some understanding of the issue, I discovered all that's needed is to change the itemTemplate and activeItemTemplate. Of course, since these are part of the Yii2 framework, you don't want to change that file, otherwise, it will probably get updated at some stage, and all your changes would be lost. Since both of these attributes are public, you can change them from outside the class, and the easiest place to do this is in frontend/views/main.php:
```html
<div class="container">
<?= Breadcrumbs::widget([
'itemTemplate' => "\n\t<li class=\"breadcrumb-item\"><i>{link}</i></li>\n", // template for all links
'activeItemTemplate' => "\t<li class=\"breadcrumb-item active\">{link}</li>\n", // template for the active link
[...]
12 0
6 followers
Viewed: 79 517 times
Version: 2.0
Category: How-tos
Tags: bootstrap4, navbar, newbie, Twitter Bootstrap
Written by: Richard Pillay
Last updated by: Richard Pillay
Created on: Feb 16, 2020
Last updated: 4 years ago
Update Article
Revert to #3 | Revert to #4

Revisions

View all history