Home Analyst Portal

How can I add a block of text to the Home page?

NIcholas_ScottNIcholas_Scott Customer IT Monkey ✭
I want to include a paragraph with some instructions to our end users on how to use the portal on the Home page. How do I go about adding text to the Home page? I'm looking to add the text where this red box is.

Best Answer

  • john_doylejohn_doyle Cireson Support Ninja IT Monkey ✭✭✭✭
    edited November 2017 Answer ✓
    @NIcholas_Scott,
    You can try adding this code to the custom.js file:
    $(window).load(function() {<br>	if (window.location.pathname == "/View/94ecd540-714b-49dc-82d1-0b34bf11888f")<br>		$("#alertMessagesContainer").before("<div class='col-md-12'>Some useful information</div>");<br>});
    Change the pathname if necessary to match the Home page you are using and then add the HTML code you require.



Answers

  • john_doylejohn_doyle Cireson Support Ninja IT Monkey ✭✭✭✭
    edited November 2017 Answer ✓
    @NIcholas_Scott,
    You can try adding this code to the custom.js file:
    $(window).load(function() {<br>	if (window.location.pathname == "/View/94ecd540-714b-49dc-82d1-0b34bf11888f")<br>		$("#alertMessagesContainer").before("<div class='col-md-12'>Some useful information</div>");<br>});
    Change the pathname if necessary to match the Home page you are using and then add the HTML code you require.



  • NIcholas_ScottNIcholas_Scott Customer IT Monkey ✭
    Thanks! That worked perfectly! It's a lot better than the 10-15 lines of code I was trying to do.
  • Ann-Christin_WeiergrAnn-Christin_Weiergr Customer IT Monkey ✭

    I want to do the same described here. I'm struggling to add the text after the "Home". I added code in the onload function only for endusers on the homepage, but I'm not able to add the text at the required position. Can you give me an example how to add the paragraph after the headline "Home"?

  • Mikkel_MadsenMikkel_Madsen Customer Advanced IT Monkey ✭✭✭

    @Ann-Christin_Weiergr what do you have so far - can you share your code?

  • Ann-Christin_WeiergrAnn-Christin_Weiergr Customer IT Monkey ✭

    I tried different approaches e.g. described here: https://community.cireson.com/discussion/comment/4217#Comment_4217

    My current approach is the following:

    $(window).on("load",function () {

    if (!session.user.Analyst && window.location.href.indexOf('IDofHomepage') > -1){

    text = $('<h4>Das ist die Beschreibung</h4>')

    $('h1').after(text);

    }}

    Thanks!

  • Mikkel_MadsenMikkel_Madsen Customer Advanced IT Monkey ✭✭✭

    Here you go - I don't know if you already has a script loader in your custom.js but else this is the full guide 😊

    Place this code in your custom.js file:

    /* ----------------------------------------------- */
    /* -------------- Script Loader V2 --------------- */
    /* ----------------------------------------------- */
    
    
    // This helps with loading scripts and debugging
    // Pass in the path of the js file and an array of url segments on which to run this code
    // EG loadScript("/CustomSpace/CustomExtension/CustomExtension.js",["ServiceRequest","Incident"]);
    var loadScriptV2 = function (path,urls) { 
    	urls.forEach(function(url){	
    		if(window.location.href.indexOf(url) !== -1){ // Verify we are on the valid page
    		
    			var result = $.Deferred(),
    				script = document.createElement("script");
    			script.async = "async";
    			script.type = "text/javascript";
    			script.src = path;
    			script.onload = script.onreadystatechange = function(_, isAbort) {
    				if (!script.readyState || /loaded|complete/.test(script.readyState)) {
    					if (isAbort)
    						result.reject();
    					else
    						result.resolve();
    				}
    			};
    			script.onerror = function () { result.reject(); };
    			$("head")[0].appendChild(script);
    			console.log("Loaded " + path)
    			return result.promise();
    		}
    	})
    };
    
    
    /* ----------------------------------------------- */
    /* ------------- END Script Loader V2 ------------ */
    /* ----------------------------------------------- */
    
    //Load your script - filepath, [array of sites where you want to load your script]
    loadScriptV2('/CustomSpace/AddTextToHome.js',["94ecd540-714b-49dc-82d1-0b34bf11888f"]);
    
    

    Then put this code into af file called AddTextToHome.js and place it in your CustomSpace folder

    $(document).ready(function() {
    	
    	//Checks if the user is an analyst - if yes, then exit
    	if (session.user.Analyst) {
    		console.log("AddTextToHome.js: User is Analyst, exiting...");
    		return;
    	}
    	
    	//The navigation node doesn't load immediately. Get the main div that definitely exists.
    	var mainPageNode = document.getElementById('main_wrapper');
    
    
    	
         // create an observer instance
    	var observer = new MutationObserver(function(mutations) {
    		
    		if ($('.page_title').length > 0) {
    			//An element with class of page_title exists.
    			
    			//We are done observing.
    			observer.disconnect();
    			
    			//The htmlcode you want to insert into the site
    			htmlCode = '<h4>Das ist die Beschreibung</h4>'
    			
    			//The element where you want to put your code after
    			$('.page_title').after(htmlCode);
    		}
    	});
         
    	// configure the observer and start the instance.
    	var observerConfig = { attributes: true, childList: true, subtree: true, characterData: true };
    	observer.observe(mainPageNode, observerConfig);
    });
    
Sign In or Register to comment.