@eveh Welcome board 🙂
The code you are referring to is custom written as no such functionality exists under NodeBB. However, adding the functionality is relatively trivial. Below are the required steps
Navigate to /admin/appearance/customise#custom-header
Add the below code to your header, and save once completed
<ol id="mainbanner" class="breadcrumb"><li id="addtext">Your Title Goes Here</li></ol>
Navigate to /admin/appearance/customise#custom-js and add the below code, then save
$(document).ready(function() {
$(window).on('action:ajaxify.end', function(data) {
// Initialise mainbanner ID, but hide it from view
$('#mainbanner').hide();
var pathname = window.location.pathname;
if (pathname === "/") {
$("#addtext").text("Your Title");
$('#mainbanner').show();
} else {}
// If we want to add a title to a sub page, uncomment the below and adjust accordingly
//if (pathname === "/yourpath") {
//$("#addtext").text("Your Title");
//$('#mainbanner').show();
//}
});
});
Navigate to /admin/appearance/customise#custom-css and add the below
CSS block
.breadcrumb {
right: 0;
margin-right: auto;
text-align: center;
background: #0086c4;
color: #ffffff;
width: 100vw;
position: relative;
margin-left: -50vw;
left: 50%;
top: 50px;
position: fixed;
z-index: 1020;
}
Note, that you will need to adjust your CSS code to suit your own site / requirements.
.
undefined phenomlab marked this topic as a regular topic
