Page 1 of 1
Costumizing nuBuilder bar
Posted: Mon Apr 17, 2023 8:44 pm
by pedromiceli
Hi guys, im trying to costumize the bar that stays in the top of the site, my objective is put a logo in the middle of the bar like in the example:
I have the image already in the nuBuilder files.
There is a simple way of doing this??????
Re: Costumizing nuBuilder bar
Posted: Tue Apr 18, 2023 7:44 am
by kev1n
Hi,
Here's an example how to add a logo to the Breadcrumb Holder.
Add this JS in Setup -> Header, inside the nuOnLoad() function:
Code: Select all
// Create a new image element
var image = $('<img>', {
src: 'core/graphics/logo.png', // Replace with the actual image URL
alt: 'Centered Image'
});
// Append the image to the nuBreadcrumbHolder div
$('#nuBreadcrumbHolder').append(image);
// Function to center the image horizontally
function centerImageHorizontally() {
var parentWidth = $('#nuBreadcrumbHolder').width();
var imageWidth = image.width();
var marginLeft = (parentWidth - imageWidth) / 2;
image.css('margin-left', marginLeft + 'px');
}
// Call the function initially
centerImageHorizontally();
// Call the function again whenever the window is resized
$(window).resize(function() {
centerImageHorizontally();
});