2015-03-26-add-a-top-banner-to-hue.md 3.5 KB


title: Add a top banner to Hue! author: admin type: post date: 2015-03-26T17:05:02+00:00 url: /add-a-top-banner-to-hue/ sf_thumbnail_type:

  • none sf_thumbnail_link_type:
  • link_to_post sf_detail_type:
  • none sf_page_title:
  • 1 sf_page_title_style:
  • standard sf_no_breadcrumbs:
  • 1 sf_page_title_bg:
  • none sf_page_title_text_style:
  • light sf_background_image_size:
  • cover sf_social_sharing:
  • 1 sf_sidebar_config:
  • left-sidebar sf_left_sidebar:
  • Sidebar-2 sf_right_sidebar:
  • Sidebar-1 sf_caption_position:
  • caption-right categories:
  • Development

We have already seen in this post how you can configure Hue in your cluster. But did you know that there’s a property that can make a top banner appear in your Hue installation? This is quite useful if you want for instance to show a disclaimer to your users, or to clearly mark a testing or production environment, or if you want to display some dynamic information there. Depending on if you are using Cloudera Manager or not, you should either add a safety valve or edit a .ini file to use this feature. For details on how to change the configuration, read here. In the desktop/custom section of the ini file you can find the banner_top_html property:

[desktop]

[[custom]]

\# Top banner HTML code

banner_top_html=

Then it’s just a matter of writing some HTML/CSS and even Javascript code to customized it as you prefer. Keep in mind that you have a limited height to do that (30px). For instance, to write a the same message you see on demo.gethue.com, you can write this:

[desktop]

[[custom]]

\# Top banner HTML code

banner_top_html='
This is Hue 3.11 read-only demo - Read more about it or open a sample query!
'

Or we could even use a very old HTML tag to display a running ticker!

[desktop]

[[custom]]

\# Top banner HTML code

banner_top_html='Welcome to the test environment.'

.

Pretty cool, uh? Now it’s your turn to create something useful with it! As usual feel free to comment on the hue-user list or @gethue!