Hey,
I want to place a HTML link in the position where the Help | About menu resides in Splunk Web.
Does anyone know the layoutPanel value (e.g. appHeader) that will make this possible?
Also does anyone know where I can get a list of all of the layoutPanel positions that I can use in Advanced XML? This will be useful for positioning modules in a view.
Thanks in advance for your help.
That sould be navigationHeader
. You can take a look at the (mako-) template that renderes the view at $SPLUNK_HOME/share/splunk/search_mrsparkle/view/dashboard.html
and $SPLUNK_HOME/share/splunk/search_mrsparkle/view/search.html
(search form).
Available regions for a dashboard (might not be complete):
appHeader
navigationHeader
viewHeader
splSearchControls-inline
mainSearchControls
panel_row{n}_col{n}[_grp{n}]
One option to position the content to the right of the Help | About Links is to add it before the AppBar:
<module name="StaticContentSample" layoutPanel="navigationHeader">
<param name="text"><![CDATA[ <span>|</span><a href="#"> Test</a> ]]></param>
</module>
<module name="AppBar" layoutPanel="navigationHeader"/>
and set the CSS (application.css) to float right:
.navigationHeader .StaticContentSample { float: right; }
Tweaking the padding/margin in the CSS might help in positioning it.
An easier option as well, is to just use JS to add the link to the menu. In application.js:
$('<a href="#">Test</a> <span>|</span>').prependTo(".AppBar .auxLinks");
or
$('<span>|</span> <a href="#">Test</a>').appendTo(".AppBar .auxLinks");
If you only want to do this in one view, you can do this by surround this statements with something like:
if($('body.splView-flashtimeline').length) { ... }
That sould be navigationHeader
. You can take a look at the (mako-) template that renderes the view at $SPLUNK_HOME/share/splunk/search_mrsparkle/view/dashboard.html
and $SPLUNK_HOME/share/splunk/search_mrsparkle/view/search.html
(search form).
Available regions for a dashboard (might not be complete):
appHeader
navigationHeader
viewHeader
splSearchControls-inline
mainSearchControls
panel_row{n}_col{n}[_grp{n}]
One option to position the content to the right of the Help | About Links is to add it before the AppBar:
<module name="StaticContentSample" layoutPanel="navigationHeader">
<param name="text"><![CDATA[ <span>|</span><a href="#"> Test</a> ]]></param>
</module>
<module name="AppBar" layoutPanel="navigationHeader"/>
and set the CSS (application.css) to float right:
.navigationHeader .StaticContentSample { float: right; }
Tweaking the padding/margin in the CSS might help in positioning it.
An easier option as well, is to just use JS to add the link to the menu. In application.js:
$('<a href="#">Test</a> <span>|</span>').prependTo(".AppBar .auxLinks");
or
$('<span>|</span> <a href="#">Test</a>').appendTo(".AppBar .auxLinks");
If you only want to do this in one view, you can do this by surround this statements with something like:
if($('body.splView-flashtimeline').length) { ... }
Thanks for the JS info. I might give it a try. Thanks for the different options.
It works! but I am not surprised. Clever thinking as usual from yourself. Thanks again.
Modified answer
Hi Ziegfried. Thanks for the info. I tried navigationHeader before but it puts my link just below the menu bar. Is there a (simple) way of positioning the module so that it appears on the right hand side and not the left?