Adding Static Text to Portal Header

Jonathan_Boles

Good Afternoon Cireson Community,

I'm looking to add some static text, specifically a phone number, to the header of the Cireson Portal that is easily view-able for our end-users.



Can anyone possibly provide some assistance for how I would go about adding this? It would also be beneficial if this text could be localized for different languages.

Thanks in advance,

Jonathan Boles

Geoff_Ross

Hi Jonathon,

This will hopefully get you started. You'll need to play with the styling to get it in the right place, colours etc.

text = $('<div><h3>Some Text Here</h3>')
text.insertBefore('#side_nav_toggle')

Geoff

PS, Inserting HTML code into this was a pain, it just rendered the HTML onto the page!

Geoff_Ross

Hi Jonathon,

This will hopefully get you started. You'll need to play with the styling to get it in the right place, colours etc.

text = $('<div><h3>Some Text Here</h3>')
text.insertBefore('#side_nav_toggle')

Geoff

PS, Inserting HTML code into this was a pain, it just rendered the HTML onto the page!

David_Wells

Hi Geoff, we are keen to get a robust solution for this (and have previously raised Feature Request for this). With a bit of trial and error (and no coding skills) we got this working but it screws up the responsive grid when window resizing. Any chance you can provide detailed code?

Jonathan_Boles

Hi @David_Wells, do you mind sharing the code you're using currently?

David_Wells

No warranties, I'm a google coder

Add this to custom.js:

$(document).ready ( function addBanner {
  var insertPos = document.getElementById('side_nav_toggle');
  var insertParent = insertPos.ParentNode;
  var bannerNode = document.createElement('div');
  bannerNode.className = "navbar-header";
  var bannerText = "<h4 class="label label-primary" style="font:100%; margin-left:30px;">Add Your Text</h4>;
  bannerNode.innerHTML = bannerText;
  insertParent.insertBefore(bannerNode, insertPos);
});

Would love someone to provide something more elegant.

David_Wells

Sorry first line should be:

$(document).ready (function addBanner() {

David_Wells

Our other request in this vein is to add text to the bottom Drawer Task bar.

For example we are using a host name alias with multiple web front end servers and want to display the actual server name of the server being hit by the user  somewhere unobtrusive so we can troubleshoot more easily. To date I have:

$(document).ready ( function addServerName() {
 varServerNode = document.createElement('span');
 serverNode.className = "small pull-right";
 serverNode.innerText = "YourServerNameHere";
 var insertParent = document.getElementById('drawer-taskbar');
 insertParent.appendChild(serverNode);
});

Looking to vertically align this to bottom of the bar if anyone knows how.

Any improvements?